.dropdown-toggle::after {

      display: none !important;
    }

ul, ol{

      padding: 0;

      list-style: none;

      text-decoration: none; 

}

a:link, a:visited, a:hover, a:active{

    text-decoration: none !important;
    color: inherit !important;

  }


.main-footer{

  border-top:0 !important; 

}

.text-facebook{

    color: #1877F2 ; 
}

.text-instagram{

    color: #C13584 ;
}

.text-twitter{

    color: #000000 ;
}

.text-linkedin{

    color: #0A66C2 ;
}

.text-youtube{

    color: #FF0000;
}

.text-twitch{

    color: #9146FF;
}

[class*=sidebar-dark-] .sidebar a {

    color: #c2c7d0 !important;
}

[class*=sidebar-dark] .brand-link, [class*=sidebar-dark] .brand-link .pushmenu {

    color: rgba(255,255,255, .8) !important;

}

.page-error{

    height: 50vh !important; 
    
}

.page-item.active .page-link{

    background-color:#8FAB3A !important;
    border: none;
    color: #fff !important;
}

.form-check-input:checked{

    background-color:#8FAB3A !important;
    border: none;

}

.dropdown-item:active, 
.dropdown-item:focus {
    background-color: #8FAB3A !important; 
    color: white !important; 
}
.select2-container--default .select2-results__option--highlighted[aria-selected], .select2-container--default .select2-results__option--highlighted[aria-selected]:hover{

    background-color: #8FAB3A !important; 
    color: white !important; 
}


/* ========================================================= */
/* PROTECCIÓN MOBILE FIRST: Ocultar submenús flotantes       */
/* ========================================================= */
@media (max-width: 991.98px) {
    ul.dropdown-menu.menuSubcategory {
        display: none !important;
        opacity: 0 !important;
        visibility: hidden !important;
        pointer-events: none !important;
    }
}

/* ========================================================= */
/* ESTÉTICA MOBILE FIRST: Flecha Minimalista de Acordeón     */
/* ========================================================= */

/* 1. Reemplazamos el SVG grueso de Bootstrap por uno de trazo ultra fino */
.accordion-button::after {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%236c757d' stroke-width='1' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='6 9 12 15 18 9'%3E%3C/polyline%3E%3C/svg%3E") !important;
    background-size: 0.8rem !important; /* Controlamos el tamaño para mayor elegancia */
    transition: transform 0.3s ease-in-out;
}

/* 2. Mantenemos el mismo ícono fino pero permitimos que gire al abrir el menú */
.accordion-button:not(.collapsed)::after {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%236c757d' stroke-width='1' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='6 9 12 15 18 9'%3E%3C/polyline%3E%3C/svg%3E") !important;
    transform: rotate(-180deg);
}

/* Opcional: Eliminar el fondo gris o azul que Bootstrap pone al hacer clic */
.accordion-button:focus {
    box-shadow: none !important;
    background-color: transparent !important;
}
.accordion-button:not(.collapsed) {
    background-color: transparent !important;
    color: inherit !important;
    box-shadow: none !important;
}

/* ========================================================= */
/* UI AVANZADA: Línea de anidamiento y Micro-interacciones   */
/* ========================================================= */

/* 1. Línea sutil de jerarquía a la izquierda de las subcategorías */
#menuMovil .accordion-collapse .list-group {
    border-left: 1px solid #e9ecef; /* Gris ultra tenue, casi invisible */
    margin-left: 2.8rem; /* Alineado milimétricamente bajo el ícono principal */
    border-radius: 0;
}

/* 2. Ajuste de espaciado interno para compensar el margen */
#menuMovil .accordion-collapse .list-group-item {
    padding-left: 1.2rem !important;
    transition: transform 0.2s ease-out, background-color 0.2s ease-out;
}

/* 3. Feedback táctil (Micro-interacción) */
/* Al tocar la subcategoría en el móvil, el texto hará un levísimo salto a la derecha */
#menuMovil .accordion-collapse .list-group-item:active {
    background-color: transparent !important;
    transform: translateX(6px); 
    color: #5c7c13 !important; /* Usa el verde de tu marca (BioClyo/Mirkatural) al presionar */
}

.facebook{

    color: white;
    background: #1877F2;
}

.google {
    background: #5F6368;

    color: white;
}

/* ==========================================================================
   Corrección de superposición: Sticky vs Ventanas Modales
   ========================================================================== */
body.modal-open .blockMedia {
    z-index: 1040 !important;
}
