/* =========================================================
   CONQUISTALATINO - DAY / NIGHT THEME
   ========================================================= */

/* BOTON */

.navbar .toolbar .theme-toggle {
    width: 46px;
    height: 46px;

    padding: 0;
    margin: 0;

    border: 1px solid rgba(255,255,255,0.15);
    border-radius: 50%;

    background: transparent;

    color: #606975;

    cursor: pointer;

    font-size: 18px;
    line-height: 46px;
    text-align: center;

    outline: none;

    transition:
        color .25s ease,
        border-color .25s ease,
        background-color .25s ease;
}

.navbar .toolbar .theme-toggle:hover {
    color: #0da9ef;
    border-color: #0da9ef;
}


/* =========================================================
   DARK MODE
   ========================================================= */

/*
   IMPORTANTE:
   No modificamos .hero-slider.
   No modificamos .hero-slide.
   No modificamos .site-footer.
*/

body.dark-mode {

    background-color: #11161c;
    color: #c8d0d9;

}


/* HEADER */

body.dark-mode .navbar {

    background-color: #11161c !important;

    border-bottom-color: #29313b;

}

body.dark-mode .site-menu ul > li > a {

    color: #c8d0d9;

}

body.dark-mode .site-menu ul > li:hover > a {

    color: #0da9ef;

}

body.dark-mode .site-menu ul > li.active > a {

    color: #0da9ef;

}


/* BOTON EN MODO OSCURO */

body.dark-mode .navbar .toolbar .theme-toggle {

    color: #ffd35a;

    border-color: rgba(255,255,255,0.18);

}

body.dark-mode .navbar .toolbar .theme-toggle:hover {

    color: #ffffff;

    border-color: #0da9ef;

}


/* =========================================================
   CONTENIDO DEBAJO DEL HERO
   ========================================================= */

/*
   El HERO queda completamente intacto.
   Solo oscurecemos el contenido que viene después.
*/

body.dark-mode main {

    background-color: #11161c;

}


/* Contenedores principales */

body.dark-mode main > .container:not(.hero-slider .container) {

    color: #c8d0d9;

}


/* Secciones normales */

body.dark-mode main > section:not(.hero-slider) {

    background-color: #11161c;

    color: #c8d0d9;

}


/* Secciones bg-faded */

body.dark-mode .bg-faded {

    background-color: #181e25 !important;

    color: #c8d0d9;

}


/* =========================================================
   TEXTOS DEL CONTENIDO
   ========================================================= */

body.dark-mode main:not(.hero-slider) h1,
body.dark-mode main:not(.hero-slider) h2,
body.dark-mode main:not(.hero-slider) h3,
body.dark-mode main:not(.hero-slider) h4,
body.dark-mode main:not(.hero-slider) h5,
body.dark-mode main:not(.hero-slider) h6 {

    color: #e2e8ee;

}

body.dark-mode main:not(.hero-slider) p {

    color: #c8d0d9;

}

body.dark-mode main:not(.hero-slider) li {

    color: #c8d0d9;

}

body.dark-mode main:not(.hero-slider) strong {

    color: #ffffff;

}


/* =========================================================
   CARDS / BOXES DEL CONTENIDO
   ========================================================= */

body.dark-mode main .card {

    background-color: #1a2028;

    border-color: #2c3540;

}

body.dark-mode main .card-header {

    background-color: #1a2028;

    border-bottom-color: #2c3540;

    color: #e2e8ee;

}

body.dark-mode main .card-body {

    color: #c8d0d9;

}


/* =========================================================
   ENLACES DEL CONTENIDO
   ========================================================= */

body.dark-mode main a {

    color: #0da9ef;

}

body.dark-mode main a:hover {

    color: #45c4f5;

}


/* =========================================================
   FORMULARIOS
   ========================================================= */

body.dark-mode main input,
body.dark-mode main textarea,
body.dark-mode main select {

    background-color: #1a2028;

    color: #ffffff;

    border-color: #394552;

}

body.dark-mode main input::placeholder,
body.dark-mode main textarea::placeholder {

    color: #8995a3;

}


/* =========================================================
   HR
   ========================================================= */

body.dark-mode main hr {

    border-color: #303945;

}


/* =========================================================
   TRANSICIONES
   ========================================================= */

body,
.navbar,
main,
main > section:not(.hero-slider),
.bg-faded,
.card {

    transition:
        background-color .25s ease,
        color .25s ease,
        border-color .25s ease;

}
/* =========================================================
   TEXTO BLANCO EN BOTONES AZULES Y VERDES - DARK MODE
   ========================================================= */

body.dark-mode .btn-primary,
body.dark-mode .btn-success,
body.dark-mode a.btn-primary,
body.dark-mode a.btn-success,
body.dark-mode button.btn-primary,
body.dark-mode button.btn-success {
    color: #ffffff !important;
}

/* =========================================================
   THEME TOGGLE - PREMIUM
   ========================================================= */

#theme-toggle-btn {
    position: relative;
    overflow: hidden;

    width: 46px;
    height: 46px;

    border-radius: 50% !important;

    background: rgba(255, 255, 255, 0.92) !important;

    border: 2px solid rgba(96,105,117,.35) !important;

    box-shadow:
        0 2px 8px rgba(0,0,0,.12),
        inset 0 0 0 1px rgba(255,255,255,.7);

    transition:
        transform .35s ease,
        background-color .35s ease,
        border-color .35s ease,
        box-shadow .35s ease !important;
}


/* =========================================================
   SOL
   ========================================================= */

#theme-toggle-btn i::before {
    content: "☀";

    display: inline-block;

    font-family: Arial, sans-serif;
    font-size: 24px;

    line-height: 42px;

    transition:
        transform .45s cubic-bezier(.4,0,.2,1),
        text-shadow .35s ease;
}


/* =========================================================
   ANIMACIÓN PERMANENTE
   ========================================================= */

#theme-toggle-btn:hover {
    transform: rotate(12deg) scale(1.08);

    background: rgba(255,255,255,1) !important;

    border-color: #0da9ef !important;

    box-shadow:
        0 0 0 4px rgba(13,169,239,.07),
        0 0 20px rgba(13,169,239,.20),
        inset 0 0 0 1px rgba(255,255,255,.9);
}

#theme-toggle-btn:hover i::before {
    transform: rotate(25deg) scale(1.12);

    text-shadow:
        0 0 6px rgba(255,211,90,.8),
        0 0 14px rgba(255,211,90,.4);
}


/* =========================================================
   MODO OSCURO
   ========================================================= */

body.dark-mode #theme-toggle-btn {

    background: rgba(30,37,46,.95) !important;

    border-color: rgba(255,255,255,.22) !important;

    box-shadow:
        0 2px 10px rgba(0,0,0,.35),
        inset 0 0 0 1px rgba(255,255,255,.04);
}


body.dark-mode #theme-toggle-btn i::before {

    content: "☾";

    font-size: 28px;

    transform: rotate(-15deg);

    text-shadow:
        0 0 7px rgba(255,255,255,.55),
        0 0 16px rgba(255,255,255,.18);
}


/* =========================================================
   HOVER LUNA
   ========================================================= */

body.dark-mode #theme-toggle-btn:hover {

    background: rgba(35,43,53,1) !important;

    border-color: #0da9ef !important;

    box-shadow:
        0 0 0 4px rgba(13,169,239,.07),
        0 0 20px rgba(13,169,239,.18);
}


body.dark-mode #theme-toggle-btn:hover i::before {

    transform: rotate(15deg) scale(1.15);
}


/* =========================================================
   CLICK
   ========================================================= */

#theme-toggle-btn:active {
    transform: scale(.90);
}
/* =========================================================
   THEME BUTTON - ANIMACIÓN PREMIUM
   ========================================================= */

#theme-toggle-btn {
    position: relative !important;
    z-index: 20 !important;

    animation: themeFloat 3s ease-in-out infinite;

    transition:
        transform .35s ease,
        box-shadow .35s ease,
        border-color .35s ease !important;
}


/* MOVIMIENTO SUAVE DEL CÍRCULO */

@keyframes themeFloat {

    0% {
        transform: translateY(0) rotate(0deg);
    }

    25% {
        transform: translateY(-3px) rotate(-3deg);
    }

    50% {
        transform: translateY(0) rotate(0deg);
    }

    75% {
        transform: translateY(3px) rotate(3deg);
    }

    100% {
        transform: translateY(0) rotate(0deg);
    }

}


/* =========================================================
   AURA ALREDEDOR DEL CÍRCULO
   ========================================================= */

#theme-toggle-btn::after {
    content: "";

    position: absolute;

    top: -5px;
    left: -5px;

    width: calc(100% + 10px);
    height: calc(100% + 10px);

    border-radius: 50%;

    border: 2px solid rgba(13,169,239,.25);

    box-shadow:
        0 0 8px rgba(13,169,239,.25),
        0 0 18px rgba(13,169,239,.15);

    pointer-events: none;

    animation: themeAura 2.5s ease-in-out infinite;
}


@keyframes themeAura {

    0% {
        transform: scale(.92);
        opacity: .25;
    }

    50% {
        transform: scale(1.12);
        opacity: .85;
    }

    100% {
        transform: scale(.92);
        opacity: .25;
    }

}


/* =========================================================
   HOVER - MÁS POTENTE
   ========================================================= */

#theme-toggle-btn:hover {
    animation-play-state: paused;

    transform: scale(1.12) rotate(8deg) !important;

    box-shadow:
        0 0 0 4px rgba(13,169,239,.08),
        0 0 15px rgba(13,169,239,.35),
        0 0 30px rgba(13,169,239,.2) !important;
}

#theme-toggle-btn:hover::after {
    animation-play-state: paused;

    transform: scale(1.18);

    opacity: 1;
}


/* =========================================================
   NOCHE
   ========================================================= */

body.dark-mode #theme-toggle-btn::after {
    border-color: rgba(255,255,255,.22);

    box-shadow:
        0 0 8px rgba(255,255,255,.18),
        0 0 20px rgba(255,255,255,.10);
}

/* =========================================================
   LÍNEA PREMIUM DEBAJO DEL NAVBAR
   ========================================================= */

.navbar {
    position: relative;
}

.navbar::after {
    content: "";

    position: absolute;

    left: 0;
    bottom: -1px;

    width: 100%;
    height: 2px;

    background: linear-gradient(
        90deg,
        transparent 0%,
        rgba(13,169,239,.15) 20%,
        rgba(13,169,239,.85) 45%,
        rgba(255,140,0,.85) 55%,
        rgba(255,140,0,.15) 80%,
        transparent 100%
    );

    box-shadow:
        0 0 6px rgba(13,169,239,.25),
        0 0 10px rgba(255,140,0,.15);

    opacity: .9;

    z-index: 50;
}

/* =========================================================
   TITULO Y BREADCRUMB DE LAS PÁGINAS - DARK MODE
   ========================================================= */

body.dark-mode .page-header,
body.dark-mode .page-title,
body.dark-mode .breadcrumb,
body.dark-mode .breadcrumb-area {
    background-color: #11161c !important;
    color: #ffffff !important;
}

/* Título principal */

body.dark-mode .page-header h1,
body.dark-mode .page-header h2,
body.dark-mode .page-title h1,
body.dark-mode .page-title h2 {
    color: #ffffff !important;
}

/* Breadcrumb */

body.dark-mode .breadcrumb li,
body.dark-mode .breadcrumb li a {
    color: #ffffff !important;
}

body.dark-mode .breadcrumb li a:hover {
    color: #0da9ef !important;
}

/* Separadores del breadcrumb */

body.dark-mode .breadcrumb > li + li:before {
    color: #8995a3 !important;
}

/* =========================================================
   DROPDOWN / SUBMENU - MODO OSCURO
   ========================================================= */

body.dark-mode .site-menu ul ul,
body.dark-mode .site-menu ul ul li,
body.dark-mode .site-menu ul ul li a {
    background-color: #181e25 !important;
}

body.dark-mode .site-menu ul ul {
    border: 1px solid #2c3540 !important;

    box-shadow:
        0 8px 25px rgba(0,0,0,.55) !important;
}

body.dark-mode .site-menu ul ul li a {
    color: #dce3ea !important;
}

body.dark-mode .site-menu ul ul li a:hover {
    color: #ffffff !important;
    background-color: #222c36 !important;
}
/* =========================================================
   LÍNEA PREMIUM - DETRÁS DEL MENÚ
   ========================================================= */

.navbar::after {
    z-index: 0 !important;
    pointer-events: none !important;
}

.site-menu ul ul {
    z-index: 999 !important;
}

/* =========================================================
   TIENDA - DARK MODE
   ========================================================= */

/* TARJETA COMPLETA */
body.dark-mode .store-product-card {
    background: #181e25 !important;
    border-color: #303945 !important;
    box-shadow: 0 2px 8px rgba(0,0,0,.30) !important;
}

/* ÁREA DE LA IMAGEN */
body.dark-mode .store-product-card .product-thumb {
    background: #181e25 !important;
    border-bottom-color: #303945 !important;
}

/* IMPORTANTE: NO CAMBIAMOS LA IMAGEN */

/* TÍTULOS */
body.dark-mode .store-product-card .product-title,
body.dark-mode .store-product-card .product-title span,
body.dark-mode .store-product-card .product-title a {
    color: #ffffff !important;
}

/* PRECIO */
body.dark-mode .store-product-card .product-price {
    color: #0da9ef !important;
}

/* PRECIO ANTERIOR */
body.dark-mode .store-product-card .product-price-old {
    color: #8995a3 !important;
}

/* PRECIO DE OFERTA */
body.dark-mode .store-product-card .product-price-sale {
    color: #ff5252 !important;
}

/* DESCRIPCIÓN */
body.dark-mode .store-product-card .product-desc {
    color: #c8d0d9 !important;
}

/* LÍNEA / SEPARADOR */
body.dark-mode .store-product-card .product-thumb {
    border-bottom-color: #303945 !important;
}

/* BOTÓN INICIAR SESIÓN */
body.dark-mode .store-product-card .btn-default {
    color: #ffffff !important;
    border-color: #394552 !important;
    background-color: transparent !important;
}

/* HOVER DEL BOTÓN */
body.dark-mode .store-product-card .btn-default:hover {
    color: #ffffff !important;
    border-color: #0da9ef !important;
    background-color: rgba(13,169,239,.10) !important;
}

/* =========================================================
   TIENDA - MARCO BLANCO PARA IMÁGENES EN DARK MODE
   ========================================================= */

body.dark-mode .store-product-card .product-thumb {
    background: #181e25 !important;

    border: 2px solid rgba(255,255,255,.85) !important;
    border-radius: 10px !important;

    box-shadow:
        0 0 6px rgba(255,255,255,.25),
        0 0 14px rgba(255,255,255,.10) !important;
}


/* La imagen queda transparente sobre el fondo oscuro */

body.dark-mode .store-product-card .product-thumb img {
    background: transparent !important;
}


/* =========================================================
   BRILLO SUAVE DEL MARCO
   ========================================================= */

body.dark-mode .store-product-card .product-thumb {
    animation: productFrameGlow 3s ease-in-out infinite;
}

@keyframes productFrameGlow {

    0% {
        box-shadow:
            0 0 5px rgba(255,255,255,.18),
            0 0 10px rgba(255,255,255,.05);
    }

    50% {
        box-shadow:
            0 0 8px rgba(255,255,255,.35),
            0 0 18px rgba(255,255,255,.12);
    }

    100% {
        box-shadow:
            0 0 5px rgba(255,255,255,.18),
            0 0 10px rgba(255,255,255,.05);
    }

}



/* =========================================================
   CARRITO - RESUMEN EN DARK MODE
   ========================================================= */

body.dark-mode .cart-summary-box {
    background: #181e25 !important;
    border-color: #303945 !important;
    color: #ffffff !important;
}


/* TÍTULO + LÍNEA */

body.dark-mode .cart-summary-box h4 {
    color: #ffffff !important;
    border-bottom-color: #303945 !important;
}


/* ITEMS Y SUBTOTAL */

body.dark-mode .cart-summary-box .summary-row {
    color: #d5dce4 !important;
}


/* TOTAL */

body.dark-mode .cart-summary-box .summary-total {
    color: #ffffff !important;
}


/* NÚMEROS DEL TOTAL */

body.dark-mode .cart-summary-box .summary-total span {
    color: #ffffff !important;
}


/* BOTÓN DE CHECKOUT - SE QUEDA AZUL */

body.dark-mode .cart-summary-box .proceed-checkout-btn {
    background: #0da9ef !important;
    color: #ffffff !important;
}


/* HOVER */

body.dark-mode .cart-summary-box .proceed-checkout-btn:hover {
    background: #0797d8 !important;
    color: #ffffff !important;
}

/* =========================================================
   CHECKOUT - DARK MODE
   ========================================================= */

/* CAJAS PRINCIPALES */

body.dark-mode .checkout-section {
    background: #181e25 !important;
    border-color: #303945 !important;
    color: #d5dce4 !important;
}


/* TÍTULOS */

body.dark-mode .checkout-section-title {
    color: #ffffff !important;
    border-bottom-color: #303945 !important;
}


/* =========================================================
   ARTÍCULOS DEL PEDIDO
   ========================================================= */

body.dark-mode .checkout-section .table {
    background-color: transparent !important;
    color: #d5dce4 !important;
}

body.dark-mode .checkout-section .table th,
body.dark-mode .checkout-section .table td {
    color: #d5dce4 !important;
    border-color: #303945 !important;
}

body.dark-mode .checkout-section .table thead th {
    color: #ffffff !important;
}

body.dark-mode .order-item span {
    color: #ffffff !important;
}


/* =========================================================
   CUPÓN
   ========================================================= */

body.dark-mode #coupon-input {
    background-color: #11161c !important;
    color: #ffffff !important;
    border-color: #394552 !important;
}

body.dark-mode #coupon-input::placeholder {
    color: #8995a3 !important;
}

body.dark-mode #apply-coupon-btn {
    color: #ffffff !important;
    background-color: transparent !important;
    border-color: #394552 !important;
}

body.dark-mode #apply-coupon-btn:hover {
    color: #ffffff !important;
    border-color: #0da9ef !important;
    background-color: rgba(13,169,239,.10) !important;
}


/* =========================================================
   MÉTODO DE PAGO
   ========================================================= */

body.dark-mode .stripe-method {
    background: #1e252e !important;
    border-color: #394552 !important;
}

body.dark-mode .stripe-method strong {
    color: #ffffff !important;
}

body.dark-mode .stripe-method p {
    color: #b8c1cc !important;
}


/* =========================================================
   VISA / MASTERCARD / AMEX
   ========================================================= */

body.dark-mode .stripe-method + div span {
    background: #181e25 !important;
    border-color: #4a5664 !important;
    color: #ffffff !important;
}


/* =========================================================
   TEXTO INFORMATIVO DEL PAGO
   ========================================================= */

body.dark-mode .checkout-section > p {
    color: #aeb8c4 !important;
}


/* =========================================================
   CARRITO / RESUMEN
   ========================================================= */

body.dark-mode .cart-summary-box {
    background: #181e25 !important;
    border-color: #303945 !important;
    color: #d5dce4 !important;
}

body.dark-mode .cart-summary-box h4 {
    color: #ffffff !important;
    border-bottom-color: #303945 !important;
}

body.dark-mode .summary-row {
    color: #d5dce4 !important;
}

body.dark-mode .summary-total {
    color: #0da9ef !important;
}


/* =========================================================
   BOTÓN PASAR POR LA CAJA
   ========================================================= */

body.dark-mode .proceed-checkout-btn {
    color: #ffffff !important;
}


/* =========================================================
   VENTANA DE CARGA DE PAGO
   ========================================================= */

body.dark-mode .payment-loading-box {
    background: #181e25 !important;
    color: #ffffff !important;
}

body.dark-mode .payment-loading-box h3,
body.dark-mode .payment-loading-box p {
    color: #ffffff !important;
}

/* =========================================================
   DESCARGAS - MARKET BUTTONS - DARK MODE
   ========================================================= */

body.dark-mode .market-button {
    background-color: #181e25 !important;
    border-color: #303945 !important;
    color: #ffffff !important;

    box-shadow:
        0 3px 10px rgba(0,0,0,.35);
}


/* SUBTÍTULO */

body.dark-mode .market-button .mb-subtitle {
    color: #aeb8c4 !important;
}


/* TÍTULO */

body.dark-mode .market-button .mb-title {
    color: #ffffff !important;
}


/* HOVER */

body.dark-mode .market-button:hover {
    background-color: #202832 !important;
    border-color: #0da9ef !important;
}


/* EL SVG CONSERVA SUS COLORES ORIGINALES */

body.dark-mode .market-button .dl-ico {
    background: transparent !important;
}
/* =========================================================
   PERFIL - DARK MODE
   ========================================================= */

/* FONDO GENERAL DEL PERFIL */

body.dark-mode .profile-body {
    color: #d5dce4 !important;
}


/* =========================================================
   TARJETAS
   ========================================================= */

body.dark-mode .profile-card {
    background: #181e25 !important;
    border-color: #303945 !important;
    color: #d5dce4 !important;
}


/* CABECERAS */

body.dark-mode .profile-card-header {
    background: #1e252e !important;
    border-bottom-color: #303945 !important;
    color: #ffffff !important;
}


/* CUERPO */

body.dark-mode .profile-card-body {
    background: #181e25 !important;
    color: #d5dce4 !important;
}


/* =========================================================
   INFORMACIÓN DE CUENTA
   ========================================================= */

body.dark-mode .profile-info-row {
    border-bottom-color: #303945 !important;
}

body.dark-mode .profile-info-label {
    color: #9da9b9 !important;
}

body.dark-mode .profile-info-value {
    color: #ffffff !important;
}


/* =========================================================
   HERO DEL PERFIL
   ========================================================= */

body.dark-mode .profile-hero {
    background: linear-gradient(
        to bottom,
        #181e25 0%,
        #11161c 100%
    ) !important;

    border-color: #303945 !important;
}

body.dark-mode .profile-player-name {
    color: #ffffff !important;
}

body.dark-mode .profile-player-label {
    color: #9da9b9 !important;
}


/* =========================================================
   VIP
   ========================================================= */

body.dark-mode .perm-level-num {
    color: #29b6f6 !important;
}

body.dark-mode .perm-total {
    color: #aeb8c4 !important;
}

body.dark-mode .perm-total strong {
    color: #29b6f6 !important;
}


/* BARRA DE PROGRESO */

body.dark-mode .perm-progress-wrap {
    background: #303945 !important;
}

body.dark-mode .perm-progress-labels {
    color: #9da9b9 !important;
}

body.dark-mode .perm-lvl-hints {
    color: #9da9b9 !important;
}


/* =========================================================
   HISTORIAL DE TRANSACCIONES
   ========================================================= */

body.dark-mode .orders-table {
    background: #181e25 !important;
    color: #d5dce4 !important;
}

body.dark-mode .orders-table th {
    background: #1e252e !important;
    color: #ffffff !important;
    border-bottom-color: #303945 !important;
}

body.dark-mode .orders-table td {
    background: #181e25 !important;
    color: #d5dce4 !important;
    border-bottom-color: #303945 !important;
}

body.dark-mode .orders-table tbody tr:hover td {
    background: #202832 !important;
}


/* =========================================================
   ESTADOS VIP
   ========================================================= */

body.dark-mode .profile-badge-active {
    background: #173a29 !important;
    color: #55d98a !important;
}

body.dark-mode .profile-badge-none {
    background: #252c34 !important;
    color: #aeb8c4 !important;
}

body.dark-mode .profile-badge-expired {
    background: #3a2025 !important;
    color: #ff7777 !important;
}


/* =========================================================
   ENLACES
   ========================================================= */

body.dark-mode .profile-body a {
    color: #29b6f6 !important;
}

body.dark-mode .profile-body a:hover {
    color: #61d0ff !important;
}


/* =========================================================
   TEXTO "AÚN NO HAY VIP..."
   ========================================================= */

body.dark-mode .perm-level-num[style] {
    color: #aeb8c4 !important;
}

/* =========================================================
   PERFIL - FONDO GENERAL DARK MODE
   ========================================================= */

/* FONDO QUE QUEDA DETRÁS DE TODO EL PERFIL */

body.dark-mode .offcanvas-wrapper {
    background-color: #11161c !important;
}


/* ÁREA DEL CONTENIDO */

body.dark-mode .profile-body {
    background-color: transparent !important;
}


/* BARRA "MI PERFIL" */

body.dark-mode .profile-page-header {
    background-color: #181e25 !important;
    border-bottom-color: #303945 !important;
}


/* TÍTULO MI PERFIL */

body.dark-mode .profile-page-header h2 {
    color: #ffffff !important;
}


/* BREADCRUMBS */

body.dark-mode .profile-breadcrumb {
    color: #8995a3 !important;
}

body.dark-mode .profile-breadcrumb a {
    color: #aeb8c4 !important;
}

body.dark-mode .profile-breadcrumb span {
    color: #29b6f6 !important;
}


/* EVITA CUALQUIER FONDO BLANCO DEL CONTENEDOR */

body.dark-mode #app,
body.dark-mode .offcanvas-container {
    background-color: #11161c !important;
}