/*
 * Custom code goes here.
 * A template should always ship with an empty custom.css
 */
#header .logo {
	margin-top: -40px;
	width: 180px;
	margin-left: 40px;
}

#search_widget form {
	display: none; }

#contactFormContent, #form_notice_contact_form {
    background-color: #212224;
    border: 1px solid #dbb93f;
	color: #100000; }

#_wishlist-button-add {
	color: #222222 !important; }

#featured_product_block {
	display: none !important; }

#like_hand_rate {
	display:none; }

#wrapper {
    background-image: url("https://kriss.cat/img/FONDOS/NEW%20FONDO%20WEB%20KRISS%202026%20-2.png") !important;

    background-repeat: no-repeat !important;
    background-position: top center !important;
    background-size: cover !important;

    background-color: #000 !important;
}

.div.col-md-6.wrapper {
	display: none;
}

#wishlist-button-add i {
	color: #000000; 
}

<script>
  document.addEventListener('DOMContentLoaded', function() {
    document.querySelectorAll('.js-thumb').forEach(function(thumb) {
      thumb.addEventListener('click', function() {
        const newSrc = this.getAttribute('data-image-large-src');
        const mainImage = document.querySelector('.js-qv-product-cover');
        if (mainImage && newSrc) {
          mainImage.setAttribute('src', newSrc);
        }

        // Actualizar clase "selected"
        document.querySelectorAll('.thumb-container').forEach(c => c.classList.remove('selected'));
        this.closest('.thumb-container').classList.add('selected');
      });
    });
  });
</script>
/* ==== Corrección de diseño para "otros productos en la misma categoría" ==== */
#category-products, 
.product-accessories, 
.products_block, 
.products-block {
  display: flex !important;
  flex-wrap: nowrap !important;
  overflow-x: auto !important;
  overflow-y: hidden !important;
  scroll-behavior: smooth;
  gap: 1rem; /* espacio entre productos */
  padding-bottom: 10px;
}

#category-products .product-miniature,
.product-accessories .product-miniature,
.products_block .product-miniature,
.products-block .product-miniature {
  flex: 0 0 auto !important;
  width: 200px !important; /* ajusta según tu diseño */
  min-width: 200px;
  max-width: 200px;
  scroll-snap-align: start;
  border: 1px solid rgba(255,255,255,0.1);
  border-radius: 8px;
}

/* Scroll estilizado opcional */
#category-products::-webkit-scrollbar {
  height: 8px;
}
#category-products::-webkit-scrollbar-thumb {
  background-color: rgba(255,255,255,0.3);
  border-radius: 4px;
}

#topMenuBlock,
 .topMenuBlock {
	padding-left: 250px; }

#topMenuBlock,
 .topMenuBlock .topmenu .item_menu {
	padding-right: 115px;}



/* ================================
   LOGO KRISS - CENTRADO + BRILLO
================================ */

/* ==========================================
   KRISS - LOGO CENTRADO + BRILLO DORADO
   PrestaShop 1.7.8 / Flatshop
========================================== */


/* El contenedor solamente sirve de referencia.
   NO usamos flex para no mover carrito, buscador, etc. */
#header .header-top.kriss-header-host {
    position: relative !important;
}


/* ==========================================
   LOGO CENTRADO REAL
========================================== */

#header .header-top.kriss-header-host .logo {position: absolute !important;

    /* Centro EXACTO del header */left: 50% !important;top: 50% !important;transform: translate(-50%, 1%) !important;

    /* Anulamos estilos de Flatshop */float: none !important;margin: 0 !important;display: block !important;max-width: 100%;height: auto;z-index: 20;


    /* ======================================
       BRILLO DORADO
    ====================================== */filter:
        drop-shadow(0 2px 3px rgba(120, 75, 0, 0.25))
        drop-shadow(0 0 5px rgba(255, 200, 70, 0.30));transition:
        filter 0.4s ease,
        transform 0.4s ease;animation: krissLogoBrillo 4s ease-in-out infinite;-webkit-backface-visibility: hidden;backface-visibility: hidden;}


/* ==========================================
   ANIMACIÓN DE BRILLO
========================================== */

@keyframes krissLogoBrillo {

    0%,
    100% {
        filter:
            brightness(1)
            drop-shadow(0 2px 3px rgba(120, 75, 0, 0.25))
            drop-shadow(0 0 4px rgba(255, 190, 50, 0.20));
    }

    50% {
        filter:
            brightness(1.12)
            drop-shadow(0 2px 4px rgba(120, 75, 0, 0.30))
            drop-shadow(0 0 10px rgba(255, 205, 80, 0.55));
    }
}


/* ==========================================
   HOVER
   IMPORTANTE:
   conservamos translate(-50%, -50%)
   para que no pierda el centrado
========================================== */

#_desktop_logo {
    left: 36% !important;
}

#header .header-top.kriss-header-host .logo:hover {

    transform:
        /*translate(-50%, -50%)*/
        scale(1.025) !important;

    filter:
        brightness(1.18)
        drop-shadow(0 3px 5px rgba(120, 75, 0, 0.30))
        drop-shadow(0 0 12px rgba(255, 210, 90, 0.65));
}


/* ==========================================
   MÓVIL
========================================== */

@media (max-width: 767px) {

    #header .header-top.kriss-header-host .logo {
            left: 50% !important;
            top: 50% !important;
            transform: translate(-50%, -17%) !important;
            float: none !important;
            margin: 0 !important;
            max-width: 65vw !important;
            height: auto !important;
            z-index: 20;
            }

    #header .header-top.kriss-header-host .logo:hover {

        transform:
            translate(-50%, -50%)
            scale(1.025) !important;
    }
}



@media (min-width: 992px) {
  body#cart,
  body#cart main,
  body#cart #page,
  body#cart #wrapper {
    /*background: #000 !important;*/
  }

  body#cart #wrapper {
    min-height: calc(100vh - 490px) !important;
  }

  body#cart footer,
  body#cart #footer {
    margin-bottom: 0 !important;
  }
}


/* =========================================================
   KRISS — MODAL CARRITO CENTRADO Y POR ENCIMA DE TODO
   ========================================================= */

/* El modal ocupa realmente toda la ventana */
#blockcart-modal {
    position: fixed !important;
    top: 0 !important;
    right: 0 !important;
    bottom: 0 !important;
    left: 0 !important;

    width: 100vw !important;
    height: 100vh !important;

    z-index: 2147483646 !important;

    padding: 0 !important;
    margin: 0 !important;

    overflow-x: hidden !important;
    overflow-y: auto !important;
}

/* Caja del carrito perfectamente centrada */
#blockcart-modal .modal-dialog {
    position: absolute !important;

    top: 50% !important;
    left: 50% !important;

    width: calc(100vw - 40px) !important;
    max-width: 1140px !important;

    margin: 0 !important;

    transform: translate(-50%, -50%) !important;

    z-index: 2147483647 !important;
}

/* Contenido por encima de cualquier elemento interno */
#blockcart-modal .modal-content {
    position: relative !important;
    z-index: 2147483647 !important;

    width: 100% !important;

    max-height: calc(100vh - 40px) !important;
    overflow-y: auto !important;

    box-shadow:
        0 30px 80px rgba(0, 0, 0, .65),
        0 0 0 1px rgba(197, 160, 89, .25) !important;
}

/* Fondo oscuro TAMBIÉN por encima del header, menú, carrusel, etc. */
.modal-backdrop,
.modal-backdrop.show,
.modal-backdrop.in {
    /*z-index: 2147483645 !important;*/
}

/* Móvil */
@media (max-width: 767px) {

    #blockcart-modal .modal-dialog {
        width: calc(100vw - 20px) !important;
        max-width: calc(100vw - 20px) !important;
    }

    #blockcart-modal .modal-content {
        max-height: calc(100vh - 20px) !important;
    }

    #blockcart-modal .modal-body {
        padding: 20px !important;
    }
}



/* =========================================================
   KRISS — QUICKVIEW CENTRADO Y POR ENCIMA DE TODO
   ========================================================= */

/* Solo cuando la vista rápida está abierta */
.quickview.modal.in,
.quickview.modal.show,
div[id^="quickview-modal-"].in,
div[id^="quickview-modal-"].show {
    position: fixed !important;

    top: 0 !important;
    right: 0 !important;
    bottom: 0 !important;
    left: 0 !important;

    width: 100vw !important;
    height: 100vh !important;

    padding: 20px !important;
    margin: 0 !important;

    display: flex !important;
    align-items: center !important;
    justify-content: center !important;

    overflow-x: hidden !important;
    overflow-y: auto !important;

    z-index: 2147483646 !important;
}


/* CAJA DE LA VISTA RÁPIDA */
.quickview .modal-dialog,
div[id^="quickview-modal-"] .modal-dialog {
    position: relative !important;

    top: auto !important;
    left: auto !important;

    width: calc(100vw - 40px) !important;
    max-width: 1140px !important;

    margin: auto !important;

    transform: none !important;

    z-index: 2147483647 !important;
}


/* CONTENIDO */
.quickview .modal-content,
div[id^="quickview-modal-"] .modal-content {
    position: relative !important;

    width: 100% !important;

    max-height: calc(100vh - 40px) !important;
    overflow-y: auto !important;

    z-index: 2147483647 !important;

    box-shadow:
        0 30px 90px rgba(0, 0, 0, .75),
        0 0 0 1px rgba(197, 160, 89, .25) !important;
}


/* FONDO OSCURO POR ENCIMA DEL HEADER Y MENÚ */
.modal-backdrop,
.modal-backdrop.in,
.modal-backdrop.show {
    /*z-index: 2147483645 !important;*/
}


/* =========================================================
   MÓVIL
   ========================================================= */

@media (max-width: 767px) {

    .quickview.modal.in,
    .quickview.modal.show,
    div[id^="quickview-modal-"].in,
    div[id^="quickview-modal-"].show {
        padding: 10px !important;
    }

    .quickview .modal-dialog,
    div[id^="quickview-modal-"] .modal-dialog {
        width: calc(100vw - 20px) !important;
        max-width: calc(100vw - 20px) !important;

        margin: auto !important;
    }

    .quickview .modal-content,
    div[id^="quickview-modal-"] .modal-content {
        max-height: calc(100vh - 20px) !important;
    }
}



/* =========================================================
   KRISS
   LIST SIEMPRE EN CATEGORÍAS
   + PORTADA SIEMPRE HORIZONTAL
========================================================= */


/* =========================================================
   1. DESACTIVAR GRID - DEJAR SOLO LIST
========================================================= */

.display_list_grid .grid,
.display_list_grid li.grid {
    display: none !important;
}

/* Solo dejamos visible el icono LIST */
.display_list_grid {
    width: 45px !important;
}

.display_list_grid .list {
    display: block !important;
}

/* El botón LIST queda simplemente como indicador */
.display_list_grid .list a {
    pointer-events: none !important;
    cursor: default !important;
    color: #dbb93f !important;
}



/* =========================================================
   2. EN CATEGORÍAS:
      DA IGUAL SI PRESTASHOP PONE .grid O .list
      VISUALMENTE SIEMPRE SERÁ LIST
========================================================= */

#products.grid .products,
#products.list .products,
#products .products {
    display: block !important;

    width: 100% !important;
    max-width: 100% !important;

    overflow: visible !important;
}



/* =========================================================
   3. CADA PRODUCTO = UNA FILA COMPLETA
========================================================= */

#products.grid .product-miniature,
#products.list .product-miniature,
#products .product-miniature {

    display: block !important;

    width: 100% !important;
    min-width: 100% !important;
    max-width: 100% !important;

    flex: none !important;
    flex-basis: auto !important;

    float: none !important;

    padding: 0 !important;
    margin: 0 0 20px 0 !important;

    box-sizing: border-box !important;
}



/* =========================================================
   4. CAJA DEL PRODUCTO - LIST BONITO
========================================================= */

#products.grid .thumbnail-container,
#products.list .thumbnail-container,
#products .thumbnail-container {

    display: flex !important;
    flex-direction: row !important;
    align-items: stretch !important;

    position: relative !important;

    width: 100% !important;
    min-width: 100% !important;
    max-width: 100% !important;

    min-height: 285px !important;

    margin: 0 !important;
    padding: 10px !important;

    border: 1px solid #dbb93f !important;

    background: rgba(15, 10, 5, 0.80) !important;

    box-sizing: border-box !important;

    overflow: hidden !important;
}



/* =========================================================
   5. IMAGEN A LA IZQUIERDA
========================================================= */

#products.grid .product_thumbnail_content,
#products.list .product_thumbnail_content,
#products .product_thumbnail_content {

    width: 285px !important;
    min-width: 285px !important;
    max-width: 285px !important;

    height: 285px !important;

    flex: 0 0 285px !important;

    float: none !important;

    position: relative !important;

    margin: 0 !important;
    padding: 8px !important;

    border: 0 !important;

    box-sizing: border-box !important;

    overflow: hidden !important;
}


#products .product_thumbnail_content img {

    width: 100% !important;
    height: 100% !important;

    max-width: none !important;

    object-fit: cover !important;

    display: block !important;
}



/* =========================================================
   6. INFORMACIÓN A LA DERECHA
========================================================= */

#products.grid .highlighted-informations,
#products.list .highlighted-informations,
#products .highlighted-informations {

    flex: 1 1 auto !important;

    width: auto !important;
    max-width: none !important;

    float: none !important;

    padding: 20px 30px !important;

    display: block !important;

    box-sizing: border-box !important;
}



/* =========================================================
   7. MOSTRAR INFORMACIÓN DE LISTA
========================================================= */

#products.grid .description-informations,
#products.list .description-informations,
#products .description-informations {

    display: block !important;
}


#products.grid .product_variants,
#products.list .product_variants,
#products .product_variants {

    display: block !important;

    margin-bottom: 15px !important;

    font-size: 14px !important;
}



/* =========================================================
   8. BANDERAS NUEVO / OFERTA
========================================================= */

#products .product-flags-list {

    top: 10px !important;
    left: 10px !important;

    z-index: 10 !important;
}



/* =========================================================
   9. TÍTULO / PRECIO
========================================================= */

#products .product-title,
#products .product-title a {

    color: #dbb93f !important;

    font-weight: 600 !important;

    text-decoration: none !important;
}


#products .product-price-and-shipping {

    margin-top: 12px !important;

    font-size: 20px !important;
}



/* =========================================================
   10. BOTONES LIST
========================================================= */

#products .button_block_prtoduct_list {

    display: flex !important;

    align-items: center !important;

    width: 100% !important;

    margin-top: 15px !important;
}


#products .button_block_prtoduct_list .product-add-to-cart,
#products .button_block_prtoduct_list .quick-view {

    float: none !important;
}



/* =========================================================
   =========================================================
   PORTADA / PRODUCTOS DESTACADOS / SLICK
   =========================================================
========================================================= */


/* =========================================================
   11. CONTENEDOR PRINCIPAL DEL SLIDER
========================================================= */

.block_featured_slider .products,
.featured-products .products {

    width: 100% !important;
    max-width: 100% !important;

    display: block !important;

    overflow: visible !important;
}



/* =========================================================
   12. SLICK LIST
   QUITAMOS LA ALTURA GIGANTE QUE TE SALE EN LA CAPTURA
========================================================= */

.block_featured_slider .slick-list,
.featured-products .slick-list {

    width: 100% !important;

    height: auto !important;
    min-height: 0 !important;

    /* SIN SCROLLBAR VISIBLE */
    overflow-x: hidden !important;
    overflow-y: hidden !important;

    padding: 0 !important;

    scrollbar-width: none !important;
    -ms-overflow-style: none !important;

    -webkit-overflow-scrolling: touch;
}

/* Chrome / Edge / Safari */
.block_featured_slider .slick-list::-webkit-scrollbar,
.featured-products .slick-list::-webkit-scrollbar {
    display: none !important;
}



/* =========================================================
   13. SLICK TRACK
   OBLIGATORIAMENTE UNA SOLA FILA
========================================================= */

.block_featured_slider .slick-track,
.featured-products .slick-track {

    display: flex !important;

    flex-direction: row !important;
    flex-wrap: nowrap !important;

    align-items: stretch !important;
    justify-content: flex-start !important;

    gap: 18px !important;

    width: max-content !important;

    height: auto !important;

    transform: none !important;
    -webkit-transform: none !important;

    margin: 0 !important;
    padding: 0 !important;
}



/* =========================================================
   14. ELIMINAR ENVOLTORIOS QUE SLICK USA PARA HACER FILAS
========================================================= */

.block_featured_slider .slick-slide,
.featured-products .slick-slide {

    display: contents !important;

    float: none !important;

    width: auto !important;
    height: auto !important;
}


.block_featured_slider .slick-slide > div,
.featured-products .slick-slide > div {

    display: contents !important;
}



/* =========================================================
   15. TARJETAS DE LA PORTADA
========================================================= */

.block_featured_slider .product-miniature,
.featured-products .product-miniature {

    display: block !important;

    width: 285px !important;
    min-width: 285px !important;
    max-width: 285px !important;

    flex: 0 0 285px !important;

    float: none !important;

    margin: 0 !important;
    padding: 0 !important;

    box-sizing: border-box !important;
}



/* =========================================================
   16. CAJA DE CADA PRODUCTO DE PORTADA
========================================================= */

.block_featured_slider .thumbnail-container,
.featured-products .thumbnail-container {

    position: relative !important;

    width: 285px !important;
    min-width: 285px !important;
    max-width: 285px !important;

    height: auto !important;

    margin: 0 !important;
    padding: 8px !important;

    border: 1px solid #dbb93f !important;

    background: rgba(15, 10, 5, 0.75) !important;

    box-sizing: border-box !important;
}



/* =========================================================
   17. IMAGEN PORTADA
========================================================= */

.block_featured_slider .product_thumbnail_content,
.featured-products .product_thumbnail_content {

    width: 100% !important;

    height: auto !important;

    margin: 0 0 15px 0 !important;

    padding: 0 !important;

    float: none !important;

    overflow: hidden !important;
}



/* =========================================================
   18. NO MOSTRAR CLONES DE SLICK
   AL DESACTIVAR SU TRANSFORM
========================================================= */

.block_featured_slider .slick-cloned,
.featured-products .slick-cloned {

    display: none !important;
}



/* =========================================================
   19. QUITAR FLECHAS Y PUNTOS DEL SLIDER
   YA NO HACEN FALTA: ES UNA FILA HORIZONTAL
========================================================= */

.block_featured_slider .slick-arrow,
.featured-products .slick-arrow,
.block_featured_slider .slick-dots,
.featured-products .slick-dots {

    display: none !important;
}



/* =========================================================
   20. SCROLL HORIZONTAL DISCRETO EN PORTADA
========================================================= */


/* =========================================================
   21. MÓVIL - LISTA DE CATEGORÍA
========================================================= */

@media (max-width: 767px) {

    #products.grid .thumbnail-container,
    #products.list .thumbnail-container,
    #products .thumbnail-container {

        flex-direction: column !important;

        width: 100% !important;
        min-width: 100% !important;

        height: auto !important;
    }


    #products.grid .product_thumbnail_content,
    #products.list .product_thumbnail_content,
    #products .product_thumbnail_content {

        width: 100% !important;
        min-width: 100% !important;
        max-width: 100% !important;

        height: auto !important;

        flex: none !important;
    }


    #products .product_thumbnail_content img {

        width: 100% !important;
        height: auto !important;

        object-fit: contain !important;
    }


    #products .highlighted-informations {

        width: 100% !important;

        padding: 15px !important;
    }
}


/* =========================================================
   KRISS - PARCHE SLICK
   SOLO borde uniforme + wishlist bien colocado
   NO TOCA slick-track NI slick-slide
========================================================= */


/* ---------------------------------------------------------
   TARJETA REAL DEL PRODUCTO
   El borde se pone aquí para que salga en TODOS
--------------------------------------------------------- */

.block_featured_slider .product-miniature,
.featured-products .product-miniature {

    position: relative !important;

    box-sizing: border-box !important;

    border: 1px solid #dbb93f !important;

    background: rgba(15, 10, 5, 0.75) !important;

    padding: 8px !important;
}


/* ---------------------------------------------------------
   QUITAMOS EL BORDE INTERIOR
   Así no hay doble borde en los productos 3 y 4
--------------------------------------------------------- */

.block_featured_slider .product-miniature .thumbnail-container,
.featured-products .product-miniature .thumbnail-container {

    position: relative !important;

    width: 100% !important;
    min-width: 0 !important;
    max-width: 100% !important;

    margin: 0 !important;
    padding: 0 !important;

    border: 0 !important;

    background: transparent !important;

    box-sizing: border-box !important;
}


/* ---------------------------------------------------------
   IMAGEN
--------------------------------------------------------- */

.block_featured_slider .product_thumbnail_content,
.featured-products .product_thumbnail_content {

    position: relative !important;

    width: 100% !important;

    margin: 0 0 15px 0 !important;

    overflow: hidden !important;
}


/* ---------------------------------------------------------
   WISHLIST
   SIEMPRE DENTRO DE SU PROPIO PRODUCTO
--------------------------------------------------------- */

.block_featured_slider .product-miniature .wishlist-button-add,
.featured-products .product-miniature .wishlist-button-add {

    position: absolute !important;

    top: 10px !important;
    right: 10px !important;

    left: auto !important;
    bottom: auto !important;

    margin: 0 !important;

    z-index: 30 !important;

    transform: none !important;
    -webkit-transform: none !important;

    float: none !important;
}


/* ---------------------------------------------------------
   SI SLICK HA GENERADO CLONES, QUE SUS CORAZONES
   NO APAREZCAN SUELTOS
--------------------------------------------------------- */

.block_featured_slider .slick-cloned .wishlist-button-add,
.featured-products .slick-cloned .wishlist-button-add {

    display: none !important;
}



/* =========================================================
   KRISS - ARRASTRAR PRODUCTOS DESTACADOS
   MÓVIL: DEDO
   ESCRITORIO: RATÓN
   ========================================================= */

.block_featured_slider .slick-list,
.featured-products .slick-list {
    overflow-x: auto !important;
    overflow-y: hidden !important;

    scroll-behavior: smooth;
    -webkit-overflow-scrolling: touch;

    /* Mantiene oculta la barra */
    scrollbar-width: none !important;
    -ms-overflow-style: none !important;
}

.block_featured_slider .slick-list::-webkit-scrollbar,
.featured-products .slick-list::-webkit-scrollbar {
    display: none !important;
}

/* Escritorio */
@media (hover: hover) and (pointer: fine) {

    .block_featured_slider .slick-list,
    .featured-products .slick-list {
        cursor: grab !important;
        user-select: none !important;
    }

    .block_featured_slider .slick-list.kriss-dragging,
    .featured-products .slick-list.kriss-dragging {
        cursor: grabbing !important;
        scroll-behavior: auto !important;
    }
}



/* ==================================================== */
/* TRADUCCION */
/* ==================================================== */

.has-discount .discount {
	display: none;
}


/* Mantener siempre visible el bloque de código promocional en la cesta */
#promo-code,
#promo-code.collapse,
#promo-code.collapse:not(.show) {
    display: block !important;
    height: auto !important;
    visibility: visible !important;
    opacity: 1 !important;
}

/* Evitar que parezca cerrado */
.promo-code-button,
.promo-code-button.collapsed {
    display: block !important;
}

/* Opcional: si no quieres que el botón cierre/abra nada visualmente */
.promo-code-button::after {
    display: none !important;
}


/* =========================================================
   SELECTOR DE IDIOMAS - BANDERAS PNG
   ESPAÑOL / FRANCÉS / INGLÉS
   DESPLEGABLE HORIZONTAL HACIA LA DERECHA
   ========================================================= */


/* CONTENEDOR PRINCIPAL */
.language-selector.dropdown.js-dropdown {
    position: relative !important;
    display: inline-flex !important;
    align-items: center !important;
    overflow: visible !important;
}


/* =========================================================
   BANDERA DEL IDIOMA ACTUAL
   ========================================================= */

.language-selector > span.expand-more[data-toggle="dropdown"] {
    display: inline-block !important;
    width: 35px !important;
    height: 25px !important;
    padding: 0 !important;
    margin: 0 !important;
    font-size: 0 !important;
    background-size: cover !important;
    background-position: center !important;
    background-repeat: no-repeat !important;
    border-radius: 7px !important;
    cursor: pointer !important;
    box-shadow: 0 3px 9px rgba(0, 0, 0, 0.22) !important;
    transition:
        transform .2s ease,
        box-shadow .2s ease,
        opacity .2s ease !important;
}

.language-selector > span.expand-more[data-toggle="dropdown"]:hover {
    transform: translateY(-1px);
    opacity: .9;

    box-shadow: 0 5px 13px rgba(0, 0, 0, .28) !important;
}


/* ESPAÑA */
html[lang^="es"]
.language-selector > span.expand-more[data-toggle="dropdown"] {
    background-image:
        url("/themes/classic/assets/img/flags/es.png") !important;
}


/* FRANCIA */
html[lang^="fr"]
.language-selector > span.expand-more[data-toggle="dropdown"] {
    background-image:
        url("/themes/classic/assets/img/flags/fr.png") !important;
}


/* INGLÉS */
html[lang^="en"]
.language-selector > span.expand-more[data-toggle="dropdown"] {
    background-image:
        url("/themes/classic/assets/img/flags/en.png") !important;
}


/* Ocultar la flecha nativa de PrestaShop */
.language-selector > a[data-toggle="dropdown"] {
    display: none !important;
}


/* =========================================================
   DROPDOWN HORIZONTAL
   SALE HACIA LA DERECHA
   ========================================================= */

.language-selector .dropdown-menu {position: absolute !important;

    /* A LA DERECHA DE LA BANDERA PRINCIPAL */top: 20% !important;left: calc(100% + 10px) !important;transform: translateY(-50%) !important;

    /* IMPORTANTE: HORIZONTAL */display: none;flex-direction: row !important;align-items: center !important;gap: 8px !important;width: auto !important;min-width: max-content !important;height: auto !important;min-height: 0 !important;padding: 7px !important;margin: 0 !important;background: #ffffff !important;border: 1px solid rgba(0, 0, 0, .10) !important;border-radius: 10px !important;box-shadow: 0 6px 20px rgba(0, 0, 0, .20) !important;overflow: visible !important;z-index: 9999999 !important;/* width: 20% !important; *//* height: 30px !important; */}


/* =========================================================
   DROPDOWN ABIERTO
   PRESTASHOP ANTIGUO + NUEVO
   ========================================================= */

.language-selector.open > .dropdown-menu,
.language-selector.show > .dropdown-menu,
.language-selector > .dropdown-menu.show {
    display: flex !important;
}


/* Por si Bootstrap mete style="display:block" */
.language-selector.open > .dropdown-menu[style],
.language-selector.show > .dropdown-menu[style] {
    display: flex !important;
}


/* =========================================================
   CADA IDIOMA
   ========================================================= */

.language-selector .dropdown-menu li,
.language-selector .dropdown-menu li.current {display: block !important;float: none !important;width: 52px !important;min-width: 52px !important;height: 34px !important;padding: 0 !important;margin: 0 !important;border: 0 !important;}


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

.language-selector .dropdown-menu .dropdown-item {

    display: block !important;

    width: 52px !important;
    min-width: 52px !important;

    height: 34px !important;

    padding: 0 !important;
    margin: 0 !important;

    font-size: 0 !important;
    line-height: 0 !important;

    background-color: transparent !important;

    background-size: cover !important;
    background-position: center !important;
    background-repeat: no-repeat !important;

    border: 0 !important;
    border-radius: 7px !important;

    box-shadow: 0 2px 6px rgba(0, 0, 0, .18) !important;

    transition:
        transform .18s ease,
        opacity .18s ease,
        box-shadow .18s ease !important;
}


.language-selector .dropdown-menu .dropdown-item:hover {

    transform: scale(1.07) !important;

    opacity: .88 !important;

    box-shadow: 0 4px 10px rgba(0, 0, 0, .25) !important;

    background-color: transparent !important;
}


/* =========================================================
   ESPAÑOL
   ========================================================= */

.language-selector .dropdown-menu a[href*="/es/"],
.language-selector .dropdown-menu a[hreflang="es"],
.language-selector .dropdown-menu a[hreflang^="es-"] {

    display: block !important;

    background-image:
        url("/themes/classic/assets/img/flags/es.png") !important;
}


/* =========================================================
   FRANCÉS
   ========================================================= */

.language-selector .dropdown-menu a[href*="/fr/"],
.language-selector .dropdown-menu a[hreflang="fr"],
.language-selector .dropdown-menu a[hreflang^="fr-"] {

    display: block !important;

    background-image:
        url("/themes/classic/assets/img/flags/fr.png") !important;
}


/* =========================================================
   INGLÉS
   ========================================================= */

.language-selector .dropdown-menu a[href*="/en/"],
.language-selector .dropdown-menu a[hreflang="en"],
.language-selector .dropdown-menu a[hreflang^="en-"] {

    display: block !important;

    background-image:
        url("/themes/classic/assets/img/flags/en.png") !important;
}


/* =========================================================
   IMPORTANTE:
   NO OCULTAR EL IDIOMA ACTUAL
   QUEREMOS VER LOS TRES
   ========================================================= */

.language-selector .dropdown-menu li.current {
    display: block !important;
}


/* =========================================================
   SELECTOR NATIVO MÓVIL FUERA
   ========================================================= */

.language-selector select.link.hidden-md-up {
    display: none !important;
}


/* =========================================================
   MÓVIL
   ========================================================= */

@media (max-width: 767px) {

    #_desktop_language_selector {
        display: block !important;
        overflow: visible !important;
    }


    #_desktop_language_selector .language-selector-wrapper {

        display: inline-flex !important;

        align-items: center !important;

        position: relative !important;

        overflow: visible !important;
    }


    /* Oculta "Language:", "Idioma:", "Langue:" */
    #_desktop_language_selector
    .language-selector-wrapper > span.hidden-md-up {

        display: none !important;
    }


    /* Oculta select móvil nativo */
    #_desktop_language_selector .language-selector select.link,
    #_desktop_language_selector .language-selector select.hidden-md-up {

        display: none !important;
    }


    /* Mantener nuestro selector */
    #_desktop_language_selector
    .language-selector.dropdown.js-dropdown {

        display: inline-flex !important;

        align-items: center !important;

        position: relative !important;

        overflow: visible !important;
    }


    /* Bandera principal */
    #_desktop_language_selector
    .language-selector
    > span.expand-more.hidden-sm-down {

        display: inline-block !important;

        width: 44px !important;
        height: 29px !important;

        font-size: 0 !important;

        background-size: cover !important;
        background-position: center !important;
        background-repeat: no-repeat !important;

        border-radius: 6px !important;

        cursor: pointer !important;
    }


    /* =====================================================
       BANDERA ACTUAL MÓVIL
       ===================================================== */

    html[lang^="es"]
    #_desktop_language_selector
    .language-selector
    > span.expand-more.hidden-sm-down {

        background-image:
            url("/themes/classic/assets/img/flags/es.png") !important;
    }


    html[lang^="fr"]
    #_desktop_language_selector
    .language-selector
    > span.expand-more.hidden-sm-down {

        background-image:
            url("/themes/classic/assets/img/flags/fr.png") !important;
    }


    html[lang^="en"]
    #_desktop_language_selector
    .language-selector
    > span.expand-more.hidden-sm-down {

        background-image:
            url("/themes/classic/assets/img/flags/en.png") !important;
    }


    /* Flecha fuera */
    #_desktop_language_selector
    .language-selector
    > a.hidden-sm-down {

        display: none !important;
    }


    /* =====================================================
       DROPDOWN MÓVIL TAMBIÉN HORIZONTAL
       ===================================================== */

    #_desktop_language_selector
    .language-selector
    > ul.dropdown-menu.hidden-sm-down {

        display: none !important;

        position: absolute !important;

        top: 50% !important;

        left: calc(100% + 8px) !important;

        transform: translateY(-50%) !important;

        flex-direction: row !important;

        align-items: center !important;

        gap: 6px !important;

        width: auto !important;

        min-width: max-content !important;

        height: auto !important;

        padding: 6px !important;

        margin: 0 !important;

        background: #fff !important;

        border: 1px solid rgba(0,0,0,.10) !important;

        border-radius: 9px !important;

        box-shadow:
            0 6px 18px rgba(0,0,0,.20) !important;

        overflow: visible !important;

        z-index: 99999999 !important;
    }


    /* Abierto */
    #_desktop_language_selector
    .language-selector.open
    > ul.dropdown-menu.hidden-sm-down,

    #_desktop_language_selector
    .language-selector.show
    > ul.dropdown-menu.hidden-sm-down,

    #_desktop_language_selector
    .language-selector
    > ul.dropdown-menu.show {

        display: flex !important;
    }


    /* Los tres LI */
    #_desktop_language_selector
    .language-selector
    .dropdown-menu li,

    #_desktop_language_selector
    .language-selector
    .dropdown-menu li.current {

        display: block !important;

        float: none !important;

        width: 44px !important;
        min-width: 44px !important;

        height: 29px !important;

        padding: 0 !important;
        margin: 0 !important;
    }


    /* Las tres banderas */
    #_desktop_language_selector
    .language-selector
    .dropdown-menu
    .dropdown-item {

        display: block !important;

        width: 44px !important;
        min-width: 44px !important;

        height: 29px !important;

        padding: 0 !important;
        margin: 0 !important;

        font-size: 0 !important;

        background-size: cover !important;
        background-position: center !important;
        background-repeat: no-repeat !important;

        border-radius: 6px !important;
    }
}




@media (max-width: 767px) {
    #_desktop_cart {
        position: absolute !important;
        right: 30px !important;
        top: 800% !important;
        transform: translateY(-50%) !important;
        z-index: 20 !important;
        float: none !important;
		width: 40px;
        height: 40px;
    }
}