.navigation {
    list-style-type: none;
}

.box-shadow--2dp {
    box-shadow: 0 2px 2px 0 rgba(0, 0, 0, .14), 0 3px 1px -2px rgba(0, 0, 0, .2), 0 1px 5px 0 rgba(0, 0, 0, .12)
}
.box-shadow--3dp {
    box-shadow: 0 3px 4px 0 rgba(0, 0, 0, .14), 0 3px 3px -2px rgba(0, 0, 0, .2), 0 1px 8px 0 rgba(0, 0, 0, .12)
}
.box-shadow--4dp {
    box-shadow: 0 4px 5px 0 rgba(0, 0, 0, .14), 0 1px 10px 0 rgba(0, 0, 0, .12), 0 2px 4px -1px rgba(0, 0, 0, .2)
}
.box-shadow--6dp {
    box-shadow: 0 6px 10px 0 rgba(0, 0, 0, .14), 0 1px 18px 0 rgba(0, 0, 0, .12), 0 3px 5px -1px rgba(0, 0, 0, .2)
}
.box-shadow--8dp {
    box-shadow: 0 8px 10px 1px rgba(0, 0, 0, .14), 0 3px 14px 2px rgba(0, 0, 0, .12), 0 5px 5px -3px rgba(0, 0, 0, .2)
}
.box-shadow--16dp {
    box-shadow: 0 16px 24px 2px rgba(0, 0, 0, .14), 0 6px 30px 5px rgba(0, 0, 0, .12), 0 8px 10px -5px rgba(0, 0, 0, .2)
}

.navigation-item {
    float: left;
    padding-left: 10px;
    padding-right: 10px;
}

.backgroundheader {
    background-image: url("/static/multipybot_header_new.png");
    background-repeat: no-repeat;
}

.banner {
    width: 100%;
    height: 180px; /* Sicherstellen, dass der Banner eine sichtbare Höhe hat */
    background-image: url("/static/multipybot_header_new_ohne-logo.png");
    background-size: cover; /* Bild wird auf die Größe des Containers angepasst */
    background-position: top center; /* Bild wird oben und zentriert ausgerichtet */
    position: relative; /* Verhindert Layoutprobleme und gibt Flexibilität */
    z-index: -1; /* Hintergrund bleibt hinter anderen Elementen */
}

/* Logo über dem Banner */
.banner-logo {
  position: absolute; /* Absolute Positionierung relativ zum Banner */
  bottom: 20px; /* Abstand vom unteren Rand */
  right: 30px; /* Abstand vom rechten Rand */
  width: 300px; /* Breite des Logos (anpassen nach Bedarf) */
  height: auto; /* Höhe wird proportional zur Breite skaliert */
}

.equal-width-btn {
    width: 150px; /* Oder eine andere feste Breite */
}


.navbar {
    position: relative;
    z-index: 1; /* Setzt die Navbar über andere Elemente, aber unter den Banner */
    height: 50px; /* Oder eine gewünschte feste Höhe */
    min-height: 50px;
    padding: 0;
    margin: 0;
    box-sizing: border-box;
}

#bootstrap-version {
    font-size: 1rem; /* Größere Schrift */
    padding: 0.6rem 1rem; /* Größere Padding für mehr Platz */
}

.badge {
    min-width: 110px; /* Oder eine passende Breite wählen */
    display: inline-block;
    padding: 0.5em 1em;
    font-size: 0.9rem;
    font-weight: bold;
    text-align: center;
    border-radius: 8px;
    border: 1px solid transparent;
}
/* Bronze Badge - Stärkerer Gradient mit passendem Text */
.badge-bronze {
    background: linear-gradient(145deg, #cd7f32, #b87333, #8c6239, #5a3e1b);
    border: 1px solid #5a3e1b;
    box-shadow: inset 0 3px 6px rgba(255, 255, 255, 0.6),
                0 4px 8px rgba(0, 0, 0, 0.3);
    color: transparent;
    background-clip: text;
    -webkit-background-clip: text;
    background: linear-gradient(145deg, #ffcc99, #d19275, #8c6239); /* Schrift-Gradient */
    text-shadow: 0 0 1px rgba(0, 0, 0, 0.6);
}

/* Silver Badge - Stärkerer Gradient mit passendem Text */
.badge-silver {
    background: linear-gradient(145deg, #f4f4f4, #b0b0b0, #e0e0e0, #8c8c8c);
    border: 1px solid #8c8c8c;
    box-shadow: inset 0 3px 6px rgba(255, 255, 255, 0.8),
                0 4px 8px rgba(0, 0, 0, 0.3);

    color: transparent;
    background-clip: text;
    -webkit-background-clip: text;
    background: linear-gradient(145deg, #ffffff, #d6d6d6, #9f9f9f); /* Schrift-Gradient */
    text-shadow: 0 0 1px rgba(0, 0, 0, 0.6); /* Geringere Unschärfe */
}

/* Gold Badge - Stärkerer Gradient mit passendem Text */
.badge-gold {
    background: linear-gradient(145deg, #fff5b7, #ffcc00, #e6a400, #a67500);
    border: 1px solid #a67500;
    box-shadow: inset 0 3px 6px rgba(255, 255, 255, 0.5),
                0 4px 8px rgba(0, 0, 0, 0.3);

    color: transparent;
    background-clip: text;
    -webkit-background-clip: text;
    background: linear-gradient(145deg, #fff5b7, #ffdd33, #b58f00); /* Schrift-Gradient */
    text-shadow: 0 0 1px rgba(0, 0, 0, 0.6); /* Geringe Unschärfe */
}

/* Diamond Badge - Stärkerer Gradient mit passendem Text */
.badge-diamond {
    background: linear-gradient(145deg, #e0ffff, #b0e4f9, #7fd7f4, #5bc0de);
    border: 1px solid #5bc0de;
    box-shadow: inset 0 3px 8px rgba(255, 255, 255, 0.7),
                0 4px 10px rgba(0, 0, 0, 0.3);

    color: transparent;
    background-clip: text;
    -webkit-background-clip: text;
    background: linear-gradient(145deg, #e0ffff, #9cd5ea, #4fbddc); /* Schrift-Gradient */
    text-shadow: 0 0 1px rgba(0, 0, 0, 0.6); /* Geringe Unschärfe */
}



.bg-image {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.overlay-image {
    positon: relative;
    z-index: 1;
}

.backgroundheadergrey {
    background-image: url("/static/multipy_grey.png");
    background-repeat: no-repeat;
}

.logologin {
    background-image: url("/static/Multipybot_neu.png");
    background-repeat: no-repeat;
}


.logo {
    background-image: url("/static/logo.png");
    background-repeat: no-repeat;
}

.backgroundheadernew{
  height: 100vh;
  min-height: 500px;
  background-image: url("/static/multipynewly.jpg");
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
}

.my-custom-scrollbar {
position: relative;
height: 200px;
overflow: auto;
}
.table-wrapper-scroll-y {
display: block;
}
body {
background-color: #DBF9FC;
}
.btn-default
{
background-color: #68889E;
color:#FFF;
border-color: #2F3E48;
}
.btn-default:hover, .btn-default:focus, .btn-default:active, .btn-default.active, .open .dropdown-toggle.btn-default {
background-color: #2F3E48;
color:#FFF;
border-color: #31347B;
}
}

.btn-testbutton  {
    background-color: #4657fc;
    color: yellow;
}

.btn-primary {
  background-color: Red !important;
  border-color: Red !important;
}
.btn-primary:hover,
.btn-primary:active,
.btn-primary:visited,
.btn-primary:focus {
  background-color: DarkBlue !important;
  border-color: DarkBlue !important;
}

.custom-element {
  color: $gray-100;
  background-color: $dark;
}

.btn-primary, .btn-primary:hover, .btn-primary:active, .btn-primary:visited {
    background-color: #8064FF !important;
}

.mbpbotdefaultbutton {
    min-width: 100px !important;
    max-width: 800px !important;
}

.custom-btn-size {
  max-width: 10rem !important;
  min-height: 4rem !important;
  font-size: 1.5rem !important;
}

.button1 {width: 100px;}

.scale{
     scale:20px;
}

.login
{
width: 20%;
margin-top: 39.5%;
margin-left: 35%;
}

.ispwown
{
font-size:60px;
color:#F2F2F2;
}

.nopwown
{
font-size:60px;
color:#FF0000;
}

.mpbbackground
{
background-image: linear-gradient(to top, #054057, #015a7b, #0075a1, #0091c9, #02aef3);
}

/* Benutzerdefinierte Toast-Stile */
.custom-toast {
    font-size: 24px; /* Setze die gewünschte Schriftgröße hier */
    top: 50% !important; /* Vertikal zentrieren */
    transform: translateY(-50%); /* Korrektur für das Zentrieren */
    /* Weitere benutzerdefinierte Stile nach Bedarf */
}

input.custom-tradetbl-width {
    width: 80px;
}

input.custom-tradetbl-width-sm {
    width: 65px;
}