/**
 * Estilos personalizados para Filtros Woo Personalizados.
 *
 * Este archivo se carga DESPUÉS de bootstrap.min.css, así que cualquier
 * regla que escribas aquí sobrescribe los estilos por defecto de Bootstrap
 * sin necesidad de !important (siempre que el selector tenga igual o mayor
 * especificidad).
 *
 * Estructura del HTML generado, por si sirve de referencia rápida:
 *
 * .mi-filtros-wrap                        -> card contenedora de todo el formulario
 *   #custom-filters                       -> <form>
 *     .accordion#accordion-{taxonomy}     -> uno por cada filtro (marca, talla, color, precio)
 *       .accordion#accordion-product_cat  -> caso especial: contiene un .accordion-item por categoría padre
 *       .accordion-item
 *         .accordion-header > .accordion-button
 *         .accordion-collapse.collapse
 *           .accordion-body
 *             .form-check
 *               .form-check-input (checkbox)
 *               .form-check-label
 *     .btn.btn-primary        -> botón "Filtrar"
 *     .btn.btn-outline-secondary  -> botón limpiar (🗑️)
 */


/* ==========================================================================
   Contenedor general
   ========================================================================== */

.mi-filtros-wrap {
    background-color: #052E3E;
    border-color: #f0f4f6;
}


/* ==========================================================================
   Encabezados de acordeón (marca, talla, color, precio, categorías)
   ========================================================================== */

 .mi-filtros-wrap .accordion-button {
    font-weight: 600;
    color: #f0f4f6 !important;
    background-color: #052E3E;
} 

.mi-filtros-wrap h5 {
    color: #f0f4f6 !important;
}

.mi-filtros-wrap h4 {
    color: #f0f4f6 !important;
}

.mi-filtros-wrap .accordion-button:not(.collapsed) {
    background-color: #e8752a !important;
    box-shadow: none;
}

.mi-filtros-wrap .accordion-button::after {
    filter: brightness(0) saturate(100%) invert(87%) sepia(2%) saturate(563%) hue-rotate(162deg) brightness(113%) contrast(93%);
}

.mi-filtros-wrap .accordion-body {
    background-color: #052E3E;
}

/* ==========================================================================
   Checkboxes de opciones
   ========================================================================== */

/* .mi-filtros-wrap .form-check-input:checked {
    background-color: var(--bs-primary);
    border-color: var(--bs-primary);
} */
.mi-filtros-wrap .form-check-input {
    border-color: #e8752a;
}

.mi-filtros-wrap .form-check-label {
    color: #f0f4f6;
}

/* ==========================================================================
   Botones de acción (Filtrar / Limpiar)
   ========================================================================== */

.mi-filtros-wrap .btn-primary {
    background-color: #e8752a;
}

#clear-filters {
    background-color: red;
    color: #f0f4f6;
    border-color: red;
}


/* ==========================================================================
   Filtros woo modal
   ========================================================================== */

#modal-mostrada .modal-content {
    background-color: #052E3E;
    
} 

#filtros-woo-modal-label {
    color: #f0f4f6;
}

#filtros-woo-modal .btn-close {
    filter: brightness(0) saturate(100%) invert(87%) sepia(2%) saturate(563%) hue-rotate(162deg) brightness(113%) contrast(93%);
}

#modal-mostrada .modal-body .accordion-button:not(.collapsed) {
    background-color: #e8752a;
    box-shadow: none;
    color: #f0f4f6;
}

#modal-mostrada .modal-body .accordion-button {
    background-color: #052E3E;
    box-shadow: none;
    color: #f0f4f6;
}

#modal-mostrada .modal-body .accordion-body {
    background-color: #052E3E;
    color: #f0f4f6;
}

#modal-mostrada .modal-body .form-check-input {
    border-color: #e8752a;
}





/* ==========================================================================
   Filtros woo chips
   ========================================================================== */
.filtros-woo-chip {
    background-color: #e8752a;
    color: #f0f4f6;
    border-color: #f0f4f6;;
}

.filtros-woo-chip:hover {
    color: #e8752a;
    background-color: #f0f4f6;
    border-color: #e8752a;
}