/* Custom code - Kriss Perfumes 2026 */

#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;
}

#wrapper {
  background-image: url(https://kriss.cat/themes/flatshop/_dev/img/FONDO%20WEB%20KRISS%20PERFUMES%202025.jpg);
}

/* Evitar conflictos con otros bloques de la web */
#category-products,
.product-accessories,
.products_block:not(.featured-list),
.products-block:not(.featured-list) {
  display: flex !important;
  flex-wrap: nowrap !important;
  overflow-x: auto !important;
  gap: 1rem;
  padding-bottom: 10px;
}

#category-products .product-miniature,
.product-accessories .product-miniature,
.products_block:not(.featured-list) .product-miniature {
  flex: 0 0 auto !important;
  width: 200px !important;
}

/* ================================================================ */
/* FIX REAL para mpm_homefeatured + slick (desktop + móvil)          */
/* ================================================================ */

.featured-list.products {
  width: 100%;
}

.featured-list.products .slick-list {
  overflow: hidden !important;
}

.featured-list.products .slick-track {
  display: block !important; /* Slick necesita su propio layout */
}

/* ✅ Slide: NO forzar width 100%, Slick manda con su width inline */
.featured-list.products .slick-slide {
  box-sizing: border-box;
  padding: 0 10px;
  height: auto !important;
}

/* ✅ CLAVE: item-slider-unit NO debe ser 100% (si no, vertical) */
.featured-list.products .item-slider-unit {
  width: auto !important;     /* deja el width inline de slick */
  min-width: 0 !important;
  max-width: none !important;
  /* NO tocar floats del slide */
}

/* El card interno sí puede ocupar el ancho del slide */
.featured-list.products .item-slider-unit .product-miniature {
  width: 100% !important;
  min-width: 0 !important;
  max-width: none !important;
  float: none !important;
}

/* Imágenes responsive */
.featured-list.products .thumbnail.product-thumbnail img {
  width: 100%;
  height: auto;
  display: block;
}

/* Strong normal (por si vuelve a colarse) */
.featured-list.products strong {
  display: block !important;
  font-weight: normal !important;
}

/* Flechas */
.slick-arrow i {
  color: #dbb93f !important;
  font-size: 40px !important;
}

/* Menú */
#topMenuBlock, .topMenuBlock { padding-left: 250px; }
#topMenuBlock, .topMenuBlock .topmenu .item_menu { padding-right: 115px; }

.view-mode,
.display-options,
#grid-list-buttons,
.products-sort-order .view-switcher {
  display: none !important;
}

/* Mobile tweaks */
@media (max-width: 767px) {
  .featured-list.products .slick-slide {
    padding: 0 12px;
  }

  .featured-list.products,
  .featured-list.products .slick-list,
  .featured-list.products .slick-track {
    height: auto !important;
    min-height: 0 !important;
  }
}

/* ==================================================== */
/* Reducir espacio entre bloques en Home */
/* ==================================================== */

/* Reduce margen vertical del bloque featured */
section.block_featured_slider {
  margin: 5px 0 !important;       /* antes 20px */
  padding: 0 !important;          /* elimina relleno innecesario */
}

/* Elimina espacio inferior interno del carrusel */
@media (min-width: 992px) {
    section.block_featured_slider .featured-list {
        margin-bottom: -400px !important;
        padding-bottom: 0 !important;
    }
}

/* Reduce espacio antes del siguiente bloque */
#index .block {
  margin-bottom: 10px !important;
}

/* Ajusta separación visual entre carrusel y bloque inferior */
#index .block_featured_slider + section {
  margin-top: 10px !important;
}



/* --- KRISS FRANCE LUXURY CATEGORY BOX (CENTRADO Y COMPLETO) --- */

.block-category-info {
    margin-bottom: 40px;
    /*display: flex;*/
    justify-content: center; /* Centra el bloque en el contenedor padre */
    width: 100%;
}

.block-category-description {
    /*width: 100% !important; /* Ocupa todo el box disponible */
    max-width: 1250px; /* Límite de elegancia */
    padding: 60px 40px;
    background: #1a1a1a; /* Negro de lujo */
    border-top: 3px solid #dbb93f; /* Línea dorada más pronunciada */
    margin: 0 auto;
    text-align: center; /* Centra todo el texto y botones internamente */
    box-sizing: border-box;
    display: block;
}

.block-category-description .h1 {
    font-family: 'Playfair Display', serif;
    text-transform: uppercase;
    color: #dbb93f;
    font-size: 32px; /* Título más imponente */
    letter-spacing: 5px;
    font-weight: 300;
    margin-bottom: 25px;
    display: block;
    width: 100%;
}

#block-category-description {
    line-height: 2;
    color: #ffffff;
    font-size: 16px;
    max-width: 850px; /* Limita el ancho del texto para mejor lectura, pero centrado */
    margin: 0 auto;
    text-align: center;
}

/* Ajuste de las subcategorías para que no floten desordenadas */
.subcategories_list {
    display: flex;
    flex-wrap: wrap;
    justify-content: center; /* Centra las cajas de subcategorías */
    gap: 20px;
    width: 100%;
    padding: 0;
}

.subcategories_item {
    float: none !important; /* Eliminamos el float para usar flex */
    display: inline-block;
    padding: 15px;
    transition: transform 0.3s ease;
}

/* Botón de Contacto Estilo Profesional */
.cta-kriss-pro {
    display: inline-block;
    background: #dbb93f;
    color: #000 !important;
    padding: 18px 45px;
    text-transform: uppercase;
    letter-spacing: 3px;
    font-weight: bold;
    margin-top: 35px;
    transition: all 0.4s ease;
    border: 1px solid #dbb93f;
}

.cta-kriss-pro:hover {
    background: transparent;
    color: #dbb93f !important;
    text-decoration: none;
}

/* Responsive: Ajuste para móviles */
@media (max-width: 768px) {
    .block-category-description {
        padding: 30px 20px;
    }
    .block-category-description .h1 {
        font-size: 22px;
        letter-spacing: 2px;
    }
}



document.addEventListener('DOMContentLoaded', function () {

  function forceListView() {
    const products = document.querySelector('#products');

    if (!products) return;

    // Quitar grid
    products.classList.remove('grid');

    // Forzar list
    products.classList.add('list');

    // Guardar en localStorage (Prestashop usa esto)
    if (typeof localStorage !== 'undefined') {
      localStorage.setItem('listing_view', 'list');
    }
  }

  // Ejecutar al cargar
  forceListView();

  // Ejecutar también cuando Prestashop recarga AJAX (filtros, paginación)
  document.addEventListener('updatedProductList', function () {
    forceListView();
  });

});

/* Ocultar botón grid */
#grid,
.view_grid,
.view-mode .grid,
.js-search-link[data-view="grid"] {
  display: none !important;
}
document.addEventListener('click', function (e) {
  const target = e.target.closest('[data-view="grid"]');
  
  if (target) {
    e.preventDefault();
    e.stopPropagation();
    return false;
  }
});


/* Solo escritorio: ocultar botón grid */
@media (min-width: 769px) {
  #grid,
  .view_grid,
  .view-mode .grid,
  .js-search-link[data-view="grid"] {
    display: none !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 SOLO BANDERAS
   KRISS FRANCE
================================ */

.language-selector.dropdown.js-dropdown {
  position: relative;
  display: inline-flex;
  align-items: center;
}

/* Bandera visible actual */
.language-selector > span.expand-more[data-toggle="dropdown"] {
  font-size: 0 !important;
  width: 34px;
  height: 24px;
  display: inline-block !important;
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
  border-radius: 5px;
  cursor: pointer;
  box-shadow: 0 2px 6px rgba(0,0,0,0.18);
  transition: transform 0.2s ease, box-shadow 0.2s ease, opacity 0.2s ease;
}

.language-selector > span.expand-more[data-toggle="dropdown"]:hover {
  transform: translateY(-1px);
  opacity: 0.85;
  box-shadow: 0 4px 10px rgba(0,0,0,0.22);
}

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

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

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

/* Dropdown bonito */
.language-selector .dropdown-menu {
  min-width: auto !important;
  width: auto !important;
  padding: 7px !important;
  margin-top: 8px !important;
  background: #ffffff !important;
  border: 1px solid rgba(0,0,0,0.08) !important;
  border-radius: 8px !important;
  box-shadow: 0 6px 18px rgba(0,0,0,0.18) !important;
  position: absolute !important;
  left: 50% !important;
  transform: translateX(-50%);
  z-index: 9999 !important;
}

/* Cada bandera dentro del desplegable */
.language-selector .dropdown-menu li {
  display: block !important;
  width: 34px !important;
  height: 24px !important;
  margin: 0 !important;
}

/* Enlaces convertidos en bandera */
.language-selector .dropdown-menu .dropdown-item {
  font-size: 0 !important;
  width: 34px !important;
  height: 24px !important;
  display: block !important;
  padding: 0 !important;
  margin: 0 !important;
  background-size: cover !important;
  background-position: center !important;
  background-repeat: no-repeat !important;
  border-radius: 5px !important;
  box-shadow: 0 2px 6px rgba(0,0,0,0.16);
  transition: transform 0.2s ease, opacity 0.2s ease;
}

/* Hover de la bandera desplegada */
.language-selector .dropdown-menu .dropdown-item:hover {
  transform: scale(1.06);
  opacity: 0.85;
  background-color: transparent !important;
}

/* Bandera España */
.language-selector .dropdown-menu a[href*="/es/"] {
  background-image: url("/themes/classic/assets/img/flags/es.png");
}

/* Bandera Francia */
.language-selector .dropdown-menu a[href*="/fr/"] {
  background-image: url("/themes/classic/assets/img/flags/fr.png");
}

/* MUY IMPORTANTE:
   Oculta el idioma actual dentro del desplegable */
html[lang^="es"] .language-selector .dropdown-menu a[href*="/es/"] {
  display: none !important;
}

html[lang^="fr"] .language-selector .dropdown-menu a[href*="/fr/"] {
  display: none !important;
}

/* Oculta también el li actual de PrestaShop por seguridad */
.language-selector .dropdown-menu li.current {
  display: none !important;
}

/* Oculta selector móvil nativo */
.language-selector select.link.hidden-md-up {
  display: none !important;
}

/* ================================
   FIX MÓVIL - BANDERAS IDIOMAS
   KRISS FRANCE
================================ */

@media (max-width: 767px) {

  /* Fuerza que el bloque exista en móvil */
  #_desktop_language_selector {
    display: block !important;
  }

  #_desktop_language_selector .language-selector-wrapper {
    display: inline-flex !important;
    align-items: center !important;
    position: relative !important;
  }

  /* Oculta el texto "Language:" */
  #_desktop_language_selector .language-selector-wrapper > span.hidden-md-up {
    display: none !important;
  }

  /* Oculta el select móvil nativo */
  #_desktop_language_selector .language-selector select.link,
  #_desktop_language_selector .language-selector select.hidden-md-up {
    display: none !important;
  }

  /* Fuerza el selector bonito en móvil */
  #_desktop_language_selector .language-selector.dropdown.js-dropdown {
    display: inline-flex !important;
    align-items: center !important;
    position: relative !important;
  }

  /* Fuerza que la bandera actual se vea */
  #_desktop_language_selector .language-selector > span.expand-more.hidden-sm-down {
    display: inline-block !important;
    font-size: 0 !important;
    width: 34px !important;
    height: 24px !important;
    background-size: cover !important;
    background-position: center !important;
    background-repeat: no-repeat !important;
    border-radius: 5px !important;
    cursor: pointer !important;
    box-shadow: 0 2px 6px rgba(0,0,0,0.18) !important;
  }

  /* Sigue ocultando la flecha */
  #_desktop_language_selector .language-selector > a.hidden-sm-down {
    display: none !important;
  }

  /* Dropdown cerrado */
  #_desktop_language_selector .language-selector > ul.dropdown-menu.hidden-sm-down {
    display: none !important;
    position: absolute !important;
    top: 100% !important;
    left: 50% !important;
    transform: translateX(-50%) !important;
    min-width: auto !important;
    width: auto !important;
    padding: 7px !important;
    margin-top: 8px !important;
    background: #ffffff !important;
    border: 1px solid rgba(0,0,0,0.08) !important;
    border-radius: 8px !important;
    box-shadow: 0 6px 18px rgba(0,0,0,0.18) !important;
    z-index: 999999 !important;
  }

  /* Dropdown 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: block !important;
  }

  /* Bandera dentro del desplegable */
  #_desktop_language_selector .language-selector .dropdown-menu li {
    display: block !important;
    width: 34px !important;
    height: 24px !important;
    margin: 0 !important;
  }

  #_desktop_language_selector .language-selector .dropdown-menu .dropdown-item {
    display: block !important;
    width: 34px !important;
    height: 24px !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: 5px !important;
    box-shadow: 0 2px 6px rgba(0,0,0,0.16) !important;
  }

  /* Oculta idioma actual en móvil */
  html[lang^="es"] #_desktop_language_selector .language-selector .dropdown-menu a[href*="/es/"] {
    display: none !important;
  }

  html[lang^="fr"] #_desktop_language_selector .language-selector .dropdown-menu a[href*="/fr/"] {
    display: none !important;
  }

  #_desktop_language_selector .language-selector .dropdown-menu li.current {
    display: none !important;
  }
}