/* Holmo style module: 01-header-gallery.css */
        /* Barra Superior */
        .brand-nav {
            display: flex;
            align-items: center;
            justify-content: space-between;
            padding: 12px 16px;
            background: #ffffff;
            border-bottom: 1px solid var(--border-light);
            position: sticky;
            top: 0;
            z-index: 40;
        }
        .brand-logo {
            font-family: var(--font-body);
            font-size: 21px;
            letter-spacing: 2.5px;
            font-weight: 900;
            text-transform: uppercase;
        }

        /* ----------------------------------
           SLIDER DE PRODUCTO COMPACTO CON MINIATURAS
           ---------------------------------- */
        .product-gallery-section {
            background: #ffffff;
            border-bottom: 1px solid var(--border-light);
            padding: 0 0 12px 0;
            display: flex;
            flex-direction: column;
            align-items: center;
            width: 100%;
        }
        .gallery-main-view {
            width: 100%;
            aspect-ratio: 1 / 1;
            height: auto;
            background: #fbf9f6;
            border: none;
            border-bottom: 1px solid var(--border-light);
            display: flex;
            overflow-x: auto;
            overflow-y: hidden;
            scroll-snap-type: x mandatory;
            scroll-behavior: smooth;
            -webkit-overflow-scrolling: touch;
            scrollbar-width: none;
            touch-action: pan-x pan-y; /* Permite arrastrar libremente con el dedo sin restricciones */
            cursor: grab;
        }
        .gallery-main-view:empty::before {
            content: "";
            display: block;
            flex: 0 0 100%;
            width: 100%;
            height: 100%;
            background: linear-gradient(105deg, #f4f0ea 20%, #fbf9f6 38%, #f4f0ea 56%);
            background-size: 220% 100%;
            animation: gallery-loading 1.2s ease-in-out infinite;
        }
        @keyframes gallery-loading {
            0% { background-position: 100% 0; }
            100% { background-position: -100% 0; }
        }
        .gallery-main-view:active {
            cursor: grabbing;
        }
        .gallery-main-view::-webkit-scrollbar {
            display: none;
        }
        .gallery-slide-item {
            flex: 0 0 100%;
            width: 100%;
            height: 100%;
            scroll-snap-align: center;
            scroll-snap-stop: normal; /* Deslizamiento natural y continuo */
            position: relative;
        }
        .gallery-slide-item img {
            width: 100%;
            height: 100%;
            object-fit: cover;
            display: block;
            user-select: none;
            -webkit-user-drag: none;
            pointer-events: none; /* Evita que el navegador intente arrastrar el archivo de imagen */
        }
        
        .gallery-thumbs-row {
            display: flex;
            gap: 8px;
            margin-top: -6px; /* <-- AJUSTE FINO: Modifica este valor para subir (-45px) o bajar (-20px) */
            position: relative;
            z-index: 10;
            width: 100%;
            overflow-x: auto;
            scrollbar-width: none;
            justify-content: center;
            padding: 0 14px;
        }
        .gallery-thumbs-row::-webkit-scrollbar {
            display: none;
        }
        .gallery-thumb-btn {
            width: 50px;
            height: 50px;
            border: none; /* Sin recuadro ni líneas exteriores */
            background: #ffffff;
            border-radius: 6px;
            padding: 2px;
            cursor: pointer;
            flex-shrink: 0;
            box-shadow: 0 4px 12px rgba(0, 0, 0, 0.18); /* Efecto flotante limpio */
            transition: transform 0.15s ease, box-shadow 0.18s ease;
        }
        .gallery-thumb-btn:active {
            transform: scale(0.93);
        }
        .gallery-thumb-btn.active {
            border: 2px solid var(--border-color); /* Indicador solo en la foto activa */
            transform: scale(1.04);
        }
        .gallery-thumb-btn img {
            width: 100%;
            height: 100%;
            object-fit: cover;
            border-radius: 4px;
            display: block;
        }        /* Botón de Carrito Superior con Contador */        .cart-nav-btn {
            background: #ffffff;
            border: 1px solid var(--border-color);
            padding: 7px 11px;
            border-radius: 999px;
            display: flex;
            align-items: center;
            gap: 7px;
            cursor: pointer;
            position: relative;
            transition: transform 0.18s ease;
        }
        .cart-nav-btn:active {
            transform: scale(0.95);
        }
        .cart-icon-svg {
            width: 17px;
            height: 17px;
            display: block;
        }
        .cart-count-badge {
            background: #000000;
            color: #ffffff;
            font-size: 10px;
            font-weight: 700;
            min-width: 18px;
            height: 18px;
            border-radius: 50%;
            display: flex;
            align-items: center;
            justify-content: center;
            padding: 0 4px;
        }