﻿                /* Contenedor para permitir animación */
                .dropdown.position-static .dropdown-menu {
                    position: static !important;
                    width: 100% !important;
                    overflow: hidden;
                    max-height: 0; /* Cerrado */
                    padding: 0 !important; /* Sin espacio vacío */
                    margin: 0;
                    opacity: 0;
                    transition: max-height 0.25s ease, opacity 0.2s ease;
                }

                    /* Cuando está abierto */
                    .dropdown.position-static .dropdown-menu.show {
                        max-height: 400px; /* Ajusta según tus filtros */
                        padding: 8px !important; /* Se restaura cuando se abre */
                        opacity: 1;
                    }

                /* Contenedor general de los filtros */
                .filtros-scroll {
                    max-height: calc(100vh - 180px); /* Altura ajustable */
                    overflow-y: auto;
                    padding-right: 5px;
                }

                /* El título queda fijo */
                .filtros-titulo {
                    font-size: 11px;
                    font-weight: bold;
                    margin-bottom: 8px;
                }

                .pdf-box {
                    padding: 10px;
                    border-radius: 10px;
                    transition: background-color .2s ease, transform .2s ease;
                }

                    .pdf-box:hover {
                        background-color: #f5f5f5;
                        transform: translateY(-3px);
                    }

                .zoom-container {
                    overflow: hidden;
                    cursor: zoom-in;
                }

                .zoom-img {
                    transition: transform 0.1s ease;
                }

                .img-zoom-container {
                    width: 100%;
                    max-width: 300px;
                    aspect-ratio: 1 / 1;
                    margin: 10px auto 0 auto;
                    display: flex;
                    justify-content: center;
                    align-items: center;
                    overflow: hidden;
                }

                .img-zoom {
                    max-width: 100%;
                    max-height: 100%;
                    object-fit: contain;
                    transition: transform 0.35s ease;
                }

                .card-item:hover .img-zoom {
                    transform: scale(2); /* puedes subir a 1.8 si quieres más */
                }



                /* TÍTULO DE LA LÍNEA */
                .catalogo-poppins h4 {
                    font-family: 'Poppins', sans-serif;
                    font-weight: 700; /* Bold */
                    color: #000; /* Negro */
                    background-color: #DDD9D6;
                    padding: 10px 14px;
                    border-radius: 6px;
                    margin-bottom: 6px;
                }


                /* TARJETA COMPLETA */
                .catalogo-poppins .card {
                    background-color: #F9F9F9;
                }

                /* CUERPO DE LA TARJETA */
                .catalogo-poppins .card-body {
                    padding: 12px;
                }

                /* TEXTO DEL DETALLE */
                .catalogo-poppins .card-title {
                    font-family: 'Poppins', sans-serif;
                    font-weight: 500; /* Medium */
                    color: #1a1a1a;
                    margin: 0;
                    line-height: 1.4;
                }
                /* TEXTO DEL DETALLE */
                .catalogo-poppins .card-title_color {
                    font-family: 'Poppins', sans-serif;
                    font-weight: 500; /* Medium */
                    color: #1a1a1a;
                    margin: 0;
                    line-height: 1.4;
                    text-transform: uppercase !important;
                }
                


                #filtrosActivos {
                    font-family: 'Poppins', sans-serif;
                    font-weight: 300; /* Light */
                    font-size: 0.95rem;
                    color: #555;
                }

                    #filtrosActivos nav {
                        font-weight: 400; /* Regular */
                    }

                #listaFiltrosActivos span,
                #listaFiltrosActivos a {
                    font-weight: 300;
                    color: #333;
                    text-decoration: none;
                }

                    #listaFiltrosActivos a:hover {
                        text-decoration: underline;
                    }

                /* BOTÓN CORPORATIVO */
                .btn-corporativo,
                .btn-outline-primary {
                    background-color: #19266B;
                    border-color: #19266B;
                    color: #fff !important;
                    font-family: 'Poppins', sans-serif;
                    font-size: 0.75rem;
                    padding: 6px 10px;
                    border-radius: 6px;
                    transition: all 0.15s ease-in-out;
                }

                    .btn-corporativo:hover,
                    .btn-outline-primary:hover {
                        background-color: #141f55;
                        border-color: #141f55;
                        color: #fff;
                    }

                    .btn-corporativo:active,
                    .btn-outline-primary:active {
                        background-color: #101944;
                        border-color: #101944;
                        transform: scale(0.96);
                        box-shadow: inset 0 3px 6px rgba(0,0,0,0.35);
                    }

                    .btn-corporativo:focus,
                    .btn-outline-primary:focus {
                        outline: none;
                        box-shadow: 0 0 0 0.15rem rgba(25, 38, 107, 0.35);
                    }

                #btnVolverListado:hover {
                    background-color: #7fa0c4;
                    border-color: #7fa0c4;
                    color: #fff;
                }

                #btnVolverListado:active {
                    background-color: #9CB6D2;
                    border-color: #6a8db6;
                    transform: scale(0.96);
                    box-shadow: inset 0 3px 6px rgba(0,0,0,0.35);
                }

                #btnVolverListado:focus {
                    outline: none;
                    box-shadow: 0 0 0 0.15rem rgba(156, 182, 210, 0.45);
                }


                #btnVolverListado {
                    background-color: #9CB6D2;
                    border-color: #9CB6D2;
                    color: #fff;
                    font-family: 'Poppins', sans-serif;
                    font-weight: 400; /* REGULAR */
                    font-size: 0.8rem;
                    padding: 8px 12px;
                    border-radius: 6px;
                    transition: all 0.15s ease-in-out;
                }


                #btnLimpiarFiltros {
                    background-color: #19266B;
                    border-color: #19266B;
                    color: #fff;
                    font-family: 'Poppins', sans-serif;
                    font-size: 0.75rem;
                    padding: 2px 8px;
                    transition: all 0.15s ease-in-out;
                }

                    /* Hover */
                    #btnLimpiarFiltros:hover {
                        background-color: #141f55;
                        border-color: #141f55;
                    }

                    /* Focus */
                    #btnLimpiarFiltros:focus {
                        outline: none;
                        box-shadow: 0 0 0 0.15rem rgba(25, 38, 107, 0.35);
                    }

                    /* EFECTO AL PRESIONAR */
                    #btnLimpiarFiltros:active {
                        background-color: #101944;
                        border-color: #101944;
                        transform: scale(0.96); /* se encoge */
                        box-shadow: inset 0 2px 4px rgba(0,0,0,0.35);
                    }

                .filtros-titulo span {
                    font-family: 'Poppins', sans-serif;
                    font-weight: 300; /* Light */
                    color: #000;
                }

                /* ===============================
           TIPOGRAFÍA SOLO VISTA DETALLE
           =============================== */

                /* Título principal (COD xxxx) */
                #contenedorDetalle h4 {
                    font-family: 'Poppins', sans-serif;
                    font-weight: 500; /* MEDIUM */
                }

                /* Encabezados (Línea, Categoría, etc.) */
                #contenedorDetalle .fw-bold {
                    font-family: 'Poppins', sans-serif;
                    font-weight: 500 !important; /* MEDIUM */
                }

                /* Descripción del artículo */
                #contenedorDetalle p {
                    font-family: 'Poppins', sans-serif;
                    font-weight: 300; /* LIGHT */
                }

                /* Valores (columna derecha) */
                #contenedorDetalle .col-7 {
                    font-family: 'Poppins', sans-serif;
                    font-weight: 300; /* LIGHT */
                }


                /* CONTENEDOR DEL RANGE */
                #sliderPeso {
                    margin: 10px 0;
                }


.modal-bienvenida {
    background-image: url('../Images/Fondo_01.jpg');
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    border-radius: 16px;
    overflow: hidden;
     color: #DDD9D6;
     position: relative; /* referencia */
}

/* Overlay REAL */
.modal-overlay {
    position: absolute;
    inset: 0;
    background: rgba(0,0,0,0.55);
    z-index: 0;
}

/* Contenido arriba */
.modal-body {
    z-index: 1;
}

.modal-landing {
    max-width: 95vw;
    height: 90vh;
}

.modal-landing .modal-content {
    height: 100%;
    border-radius: 24px;
    overflow: hidden;
}

.modal-landing .modal-body {
    height: 100%;
}

.modal-bienvenida h1 {
    color: #F9F9F9;
}


/* Superior izquierda */
.logo-esquina_superiorIzq {
    position: absolute;
    top: 24px;
    left: 24px;
    max-height: 60px;
    z-index: 3;
}

/* Inferior derecha */
.logo-esquina_inferiorDer {
    position: absolute;
    bottom: 24px;
    right: 24px;
    max-height: 30px;
    z-index: 3;
}

/* ===========================
   FORZAR COLOR SLIDERS
   =========================== */

/* SOLO la barra activa */
.noUi-connect {
    background-color: #436188 !important;
}

/* Barra base (opcional, neutra) */
.noUi-target {
    background-color: #e5e7eb;
}

.catalogo-card {
    max-width: 1200px;
    padding: 32px;
    border-radius: 18px;
}

.miniatura {
    width: 64px;
    height: 64px;
    object-fit: cover;
    cursor: pointer;
}

.imagen-principal {
    max-height: 380px;
    object-fit: contain;
}



.link-ficha {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    font-weight: 600;
    color: #19266B;
    text-decoration: none;
}

.link-ficha i {
    color: #d32f2f;
    font-size: 18px;
}

.link-ficha:hover {
    text-decoration: underline;
}

.zoom-container {
    width: 100%;
    max-width: 380px;
    height: 380px;
    overflow: hidden;          /* CLAVE */
    border-radius: 12px;
    position: relative;
    background: #fff;
    cursor: zoom-in;
}

.zoom-img {
    width: 100%;
    height: 100%;
    object-fit: contain;
    transition: transform 0.35s ease;
    transform-origin: center center;
}

.zoom-container:hover .zoom-img {
    transform: scale(1.15);
}

.catalogo-wrapper {
    max-width: 1200px;   /* mismo ancho que la tarjeta */
}


.ficha-tecnica .item span {
    font-size: 13px;
    color: #888;
    text-transform: uppercase;
}

.ficha-tecnica .item strong {
    font-size: 15px;
    color: #111;
}
/* TÍTULO PRINCIPAL */
.titulo-articulo {
    font-family: 'Poppins', sans-serif;
    /*font-weight: 500;*/ /* Medium */
    font-weight: 700; /* Bold */
    font-size: 28px;
    text-transform: uppercase;
    color: #436188;
}

/* SUBTÍTULOS / LABELS */
.subtitulo-articulo {
    font-family: 'Poppins', sans-serif !important;
    /*font-weight: 500;*/ /* Medium */
    font-weight: 700; /* Bold */
    font-size: 15px;
    text-transform: uppercase;
    color: #436188 !important; /* CLAVE */
}

/* DESCRIPCIÓN */
.descripcion-articulo {
    font-family: 'Poppins', sans-serif;
    font-weight: 300; /* Light */
    font-size: 16px;
    color: #555;
}

/* VALORES */
.ficha-tecnica {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 10px 20px; /* menos espacio vertical y horizontal */
}

.ficha-tecnica .item strong {
    font-family: 'Poppins', sans-serif;
    font-weight: 300; /* Light */
    color: #222;
}



/* WRAPPER  GRUPO */
.titulo-linea-wrapper {
    width: 100%;
    padding: 4px 0;
    margin: 0 0 6px 0;
    border-radius: 8px;

    display: flex;              /* 🔑 */
    align-items: center;        /* 🔑 centrado vertical */
}

.titulo-linea-wrapper .container {
    padding-top: 0;
    padding-bottom: 0;
}

/* COLORES POR GRUPO */
    /* DENIM */
    .titulo-linea-bg-denim {
        background: #D2DCE7;
    }
    .titulo-linea-bg-denim .titulo-linea {
        color: #19266B;
    }

    /* DRILL */
    .titulo-linea-bg-drill {
        background: #DDD9D6;
    }
    .titulo-linea-bg-drill .titulo-linea {
        color: #19266B;
    }

    /* NMWORK */
    .titulo-linea-bg-nmwork {
        background: #904B0A;
    }
    .titulo-linea-bg-nmwork .titulo-linea {
        color: #FFFFFF;
    }

    /* DEFAULT */
    .titulo-linea-bg-default {
        background: #F9F9F9;
    }
    .titulo-linea-bg-default .titulo-linea {
        color: #19266B;
    }

/* TEXTO DEL TÍTULO */
.titulo-linea {
    background: transparent !important; /* 🔑 CLAVE */
    margin: 0;                          /* 🔑 CLAVE */
    padding: 0;
    text-align: left;           /* 🔑 */
    line-height: 1.1;
    font-family: 'Poppins', sans-serif;
    font-weight: 500;
    text-transform: uppercase;
    color: #19266B;
}

.link-puro {
    background: transparent !important;
    border: none !important;
    padding: 0 !important;
    box-shadow: none !important;
    text-decoration: none;
    color: #000 !important;
}

.link-puro:hover,
.link-puro:focus,
.link-puro:active {
    background: transparent !important;
    box-shadow: none !important;
    text-decoration: underline; /* opcional */
}

/* SUBTÍTULOS / LABELS */
.texto_referencial {
    font-family: 'Poppins', sans-serif !important;
    /*font-weight: 500;*/ /* Medium */
    font-weight: 300; /* Light */
    font-size: 11px;
    color: #436188 !important; /* CLAVE */
}

/* Evita que el texto del botón se corte */
.dropdown-toggle {
    white-space: normal !important; /* permite salto de línea */
    overflow: visible !important; /* evita que se oculte */
    text-overflow: unset !important; /* quita los "..." */
}

/* Opcional: mejora visual cuando hay varias líneas */
/*.dropdown-toggle {
    line-height: 1.2;
    padding-top: 6px;
    padding-bottom: 6px;
}

.btn.dropdown-toggle {
    display: block;
    width: 100%;
}*/

/* Permitir que las opciones hagan salto de línea */
/*.dropdown-menu .dropdown-item,
.dropdown-menu label,
.dropdown-menu li {
    white-space: normal !important;*/ /* permite múltiples líneas */
    /*word-break: break-word;*/ /* rompe palabras largas */
/*}*/

 /*Asegura que ocupen todo el ancho*/
.dropdown-menu {
    position: static !important; /* 🔥 clave */
    transform: none !important;
    float: none !important;
    width: 100%;
    margin-top: 5px;
}

     .dropdown-menu label {
        display: flex;
        align-items: flex-start;
        gap: 6px;
        white-space: normal !important;
    }

    .dropdown-menu input[type="checkbox"] {
        margin-top: 4px;
        flex-shrink: 0;
    }



