/* ==============================
   Chile Robots HomeCarousels
   v4.4.3 - DOM responsive optimizado
   ============================== */

.chilerobots-homecarousel {
  position: relative !important;
}

/* =========================================================
   Encabezados de carruseles de la página principal
   Estilo 1: réplica del encabezado de Nin-Nin Game
   Estilo 2: línea fina inspirada en AmiAmi
   ========================================================= */

html:not([data-crhc-heading-style="line"])
body#index .featured-products h2.products-section-title {
  display: block !important;
  width: 100% !important;
  min-height: 50px !important;
  box-sizing: border-box !important;

  margin: 30px 0 20px !important;
  padding: 15px 10px !important;

  border: 0 !important;
  border-radius: 2px !important;
  box-shadow: none !important;
  background: var(--crhc-heading-accent, #8bc2d6) !important;

  color: #ffffff !important;
  font-family: "Helvetica Neue", sans-serif !important;
  font-size: 20px !important;
  font-style: normal !important;
  font-weight: 700 !important;
  line-height: 20px !important;
  letter-spacing: normal !important;
  text-align: left !important;
  text-transform: uppercase !important;
}

/*
 * Respaldo del estilo de línea antes de que JavaScript agrupe el título
 * y el enlace. Si JavaScript no se ejecuta, el título sigue conservando
 * la identidad visual seleccionada.
 */
html[data-crhc-heading-style="line"]
body#index .featured-products > h2.products-section-title {
  display: block !important;
  width: 100% !important;
  box-sizing: border-box !important;
  margin: 30px 0 20px !important;
  padding: 0 2px 8px !important;
  border: 0 !important;
  border-bottom: 2px solid var(--crhc-heading-accent, #8bc2d6) !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  background: transparent !important;
  color: #5b5b5b !important;
  font-family: "Helvetica Neue", sans-serif !important;
  font-size: 20px !important;
  font-style: normal !important;
  font-weight: 700 !important;
  line-height: 24px !important;
  letter-spacing: normal !important;
  text-align: left !important;
  text-transform: uppercase !important;
}

html[data-crhc-heading-style="line"]
body#index .featured-products .crhc-heading-row {
  display: flex !important;
  width: 100% !important;
  min-width: 0 !important;
  box-sizing: border-box !important;
  align-items: flex-end !important;
  justify-content: space-between !important;
  gap: 18px !important;
  margin: 30px 0 20px !important;
  padding: 0 2px 8px !important;
  border: 0 !important;
  border-bottom: 2px solid var(--crhc-heading-accent, #8bc2d6) !important;
  background: transparent !important;
}

html[data-crhc-heading-style="line"]
body#index .featured-products .crhc-heading-row h2.products-section-title {
  display: block !important;
  width: auto !important;
  min-width: 0 !important;
  min-height: 0 !important;
  flex: 1 1 auto !important;
  box-sizing: border-box !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  background: transparent !important;
  color: #5b5b5b !important;
  font-family: "Helvetica Neue", sans-serif !important;
  font-size: 20px !important;
  font-style: normal !important;
  font-weight: 700 !important;
  line-height: 24px !important;
  letter-spacing: normal !important;
  text-align: left !important;
  text-transform: uppercase !important;
}

html[data-crhc-heading-style="line"]
body#index .featured-products .crhc-heading-row .all-product-link {
  display: inline-flex !important;
  width: auto !important;
  min-width: 0 !important;
  min-height: 0 !important;
  flex: 0 0 auto !important;
  float: none !important;
  align-items: center !important;
  justify-content: flex-end !important;
  gap: 2px !important;
  box-sizing: border-box !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  background: transparent !important;
  color: #5b5b5b !important;
  font-family: "Helvetica Neue", sans-serif !important;
  font-size: 13px !important;
  font-style: normal !important;
  font-weight: 700 !important;
  line-height: 20px !important;
  letter-spacing: normal !important;
  text-align: right !important;
  text-decoration: none !important;
  text-transform: uppercase !important;
  white-space: nowrap !important;
}

html[data-crhc-heading-style="line"]
body#index .featured-products .crhc-heading-row .all-product-link:hover,
html[data-crhc-heading-style="line"]
body#index .featured-products .crhc-heading-row .all-product-link:focus {
  color: #004b7d !important;
  text-decoration: none !important;
}

html[data-crhc-heading-style="line"]
body#index .featured-products .crhc-heading-row .all-product-link .material-icons {
  width: auto !important;
  height: auto !important;
  margin: 0 !important;
  font-size: 18px !important;
  line-height: 20px !important;
}

.crhc-heading-link-compact {
  display: none;
}

/*
 * El primer carrusel necesita más aire respecto del banner secundario.
 * Los encabezados siguientes conservan el espaciado original de 30 px.
 */
html:not([data-crhc-heading-style="line"])
body#index .featured-products.crhc-first-product-section
h2.products-section-title,
html[data-crhc-heading-style="line"]
body#index .featured-products.crhc-first-product-section
> h2.products-section-title,
html[data-crhc-heading-style="line"]
body#index .featured-products.crhc-first-product-section
.crhc-heading-row {
  margin-top: var(--crhc-first-heading-spacing, 90px) !important;
}

.chilerobots-homecarousel .carousel {
  position: relative !important;
  overflow: visible !important;
}

.chilerobots-homecarousel .carousel-inner {
  overflow: hidden !important;
}

/* Motor unificado: iguala la velocidad visual de todos los carruseles */
.chilerobots-homecarousel .carousel-item,
.chilerobots-homecarousel .carousel-item-next,
.chilerobots-homecarousel .carousel-item-prev,
.chilerobots-homecarousel .carousel-item.active,
.chilerobots-homecarousel .carousel-item-left,
.chilerobots-homecarousel .carousel-item-right {
  transition: transform 450ms ease !important;
  transition-duration: 450ms !important;
  transition-timing-function: ease !important;
}


.chilerobots-homecarousel .crhc-carousel-mobile {
  display: none !important;
}

.chilerobots-homecarousel .crhc-carousel-desktop {
  display: block !important;
}

/*
 * v4.4.3 elimina del DOM la variante inactiva. Estas reglas mantienen visible
 * la variante conservada durante los milisegundos previos a una recarga por
 * rotación o cambio de ancho que cruce los 768 px.
 */
html[data-crhc-active-layout="desktop"]
body#index .featured-products .cr-carousel-desktop,
html[data-crhc-active-layout="desktop"]
body#index .chilerobots-homecarousel .crhc-carousel-desktop {
  display: block !important;
}

html[data-crhc-active-layout="mobile"]
body#index .featured-products .cr-carousel-mobile,
html[data-crhc-active-layout="mobile"]
body#index .chilerobots-homecarousel .crhc-carousel-mobile {
  display: block !important;
}

.chilerobots-homecarousel .crhc-carousel-control {
  position: absolute !important;
  z-index: 10 !important;

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

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

  border: 0 !important;
  border-radius: 50% !important;
  background: rgba(0, 0, 0, 0.58) !important;
  opacity: 0.88 !important;

  font-size: 0 !important;
  line-height: 1 !important;
  text-decoration: none !important;
}

.chilerobots-homecarousel .carousel-control-prev.crhc-carousel-control {
  left: -12px !important;
}

.chilerobots-homecarousel .carousel-control-next.crhc-carousel-control {
  right: -12px !important;
}

.chilerobots-homecarousel .crhc-carousel-control .material-icons {
  display: none !important;
}

.chilerobots-homecarousel .crhc-carousel-control::before {
  display: block !important;
  width: 44px !important;
  height: 44px !important;
  font-family: Arial, sans-serif !important;
  font-size: 42px !important;
  font-weight: bold !important;
  line-height: 38px !important;
  color: #ffffff !important;
  text-align: center !important;
}

.chilerobots-homecarousel .carousel-control-prev.crhc-carousel-control::before {
  content: "\2039" !important;
  padding-right: 3px !important;
}

.chilerobots-homecarousel .carousel-control-next.crhc-carousel-control::before {
  content: "\203A" !important;
  padding-left: 3px !important;
}

.chilerobots-homecarousel .crhc-carousel-control:hover,
.chilerobots-homecarousel .crhc-carousel-control:focus {
  background: rgba(0, 0, 0, 0.82) !important;
  opacity: 1 !important;
  outline: none !important;
}

.chilerobots-homecarousel .carousel-indicators,
.chilerobots-homecarousel .crhc-carousel-indicators,
.chilerobots-homecarousel .cr-carousel-dots {
  display: flex !important;
  justify-content: center !important;
  align-items: center !important;
  width: 100% !important;
  left: 0 !important;
  right: 0 !important;
  margin-left: auto !important;
  margin-right: auto !important;
  text-align: center !important;
}

.chilerobots-homecarousel .crhc-carousel-indicators {
  position: static !important;
  margin: 18px 0 0 !important;
  gap: 7px !important;
}

.chilerobots-homecarousel .crhc-carousel-indicators li {
  width: 8px !important;
  height: 8px !important;
  border-radius: 50% !important;
  background: #c8c8c8 !important;
  border: 0 !important;
  margin: 0 !important;
  opacity: 1 !important;
  cursor: pointer !important;
}

.chilerobots-homecarousel .crhc-carousel-indicators li.active {
  background: #0074bd !important;
}

@media (max-width: 767px) {

  .chilerobots-homecarousel .crhc-carousel-desktop {
    display: none !important;
  }

  .chilerobots-homecarousel .crhc-carousel-mobile {
    display: block !important;
  }

  .chilerobots-homecarousel .crhc-carousel-mobile .products.row {
    margin-left: 0 !important;
    margin-right: 0 !important;
  }

  .chilerobots-homecarousel .crhc-carousel-mobile .product-miniature-wrapper {
    padding-left: 15px !important;
    padding-right: 15px !important;
  }
  .chilerobots-homecarousel .crhc-carousel-control {
    width: 38px !important;
    height: 38px !important;
    min-width: 38px !important;
    min-height: 38px !important;
  }

  .chilerobots-homecarousel .carousel-control-prev.crhc-carousel-control {
    left: 18px !important;
  }

  .chilerobots-homecarousel .carousel-control-next.crhc-carousel-control {
    right: 18px !important;
  }

  .chilerobots-homecarousel .crhc-carousel-control::before {
    width: 38px !important;
    height: 38px !important;
    font-size: 36px !important;
    line-height: 33px !important;
  }

  html[data-crhc-heading-style="line"]
  body#index .featured-products .crhc-heading-row {
    gap: 10px !important;
    padding-right: 1px !important;
    padding-left: 1px !important;
  }

  html[data-crhc-heading-style="line"]
  body#index .featured-products .crhc-heading-row h2.products-section-title {
    overflow: hidden !important;
    font-size: 17px !important;
    line-height: 21px !important;
    text-overflow: ellipsis !important;
    white-space: nowrap !important;
  }

  html[data-crhc-heading-style="line"]
  body#index .featured-products .crhc-heading-row .all-product-link {
    font-size: 12px !important;
    line-height: 19px !important;
  }

  html[data-crhc-heading-style="line"]
  body#index .featured-products .crhc-heading-row .crhc-heading-link-full {
    display: none !important;
  }

  html[data-crhc-heading-style="line"]
  body#index .featured-products .crhc-heading-row .crhc-heading-link-compact {
    display: inline !important;
  }
}

/* =========================================================
   Motor táctil nativo
   - La diapositiva acompaña directamente el dedo
   - Scroll-snap horizontal con desplazamiento vertical libre
   ========================================================= */

.crhc-native-scroll-surface {
  overflow-x: auto !important;
  overflow-y: hidden !important;

  scroll-snap-type: x mandatory !important;
  scroll-behavior: auto;
  overscroll-behavior-x: contain !important;
  scrollbar-width: none !important;

  touch-action: pan-x pan-y pinch-zoom !important;
  -webkit-overflow-scrolling: touch !important;
  -webkit-user-select: none !important;
  user-select: none !important;
}

/*
 * Sobrescribe con mayor especificidad los overflow:hidden originales.
 * Sin esta regla el motor se inicia, pero el navegador no puede arrastrar.
 */
.crhc-native-legacy-carousel
.cr-carousel-viewport.crhc-native-scroll-surface,
.chilerobots-homecarousel
.carousel-inner.crhc-native-scroll-surface {
  overflow-x: auto !important;
  overflow-y: hidden !important;
  touch-action: pan-x pan-y pinch-zoom !important;
}

.crhc-native-scroll-surface::-webkit-scrollbar {
  display: none !important;
}

.crhc-native-scroll-surface img {
  -webkit-user-drag: none !important;
  user-drag: none !important;
}

/* Productos Destacados y Novedades */
.crhc-native-legacy-carousel .cr-carousel-viewport {
  width: 100% !important;
}

.crhc-native-legacy-carousel .cr-carousel-track {
  display: flex !important;
  width: auto !important;
  transform: none !important;
  transition: none !important;
  will-change: auto !important;
}

.crhc-native-legacy-carousel .cr-carousel-slide {
  flex: 0 0 100% !important;
  width: 100% !important;
  max-width: 100% !important;
  scroll-snap-align: start !important;
  scroll-snap-stop: always !important;
}

/* Carruseles de categorías creados por el módulo */
.chilerobots-homecarousel
.crhc-native-module-carousel
.carousel-inner {
  position: relative !important;
  display: flex !important;
}

.chilerobots-homecarousel
.crhc-native-module-carousel
.carousel-item,
.chilerobots-homecarousel
.crhc-native-module-carousel
.carousel-item.active {
  position: relative !important;
  display: block !important;

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

  float: none !important;
  margin-right: 0 !important;
  transform: none !important;
  transition: none !important;

  scroll-snap-align: start !important;
  scroll-snap-stop: always !important;
}

.crhc-scroll-clone {
  pointer-events: none !important;
}

.crhc-native-jumping {
  scroll-snap-type: none !important;
}

/* Indicadores móviles: más de 10 posiciones en filas de hasta 10 */
@media (max-width: 767px) {
  .cr-carousel-mobile
  .cr-carousel-dots.crhc-legacy-indicators-two-rows {
    display: grid !important;
    grid-template-columns: repeat(10, 10px) !important;
    grid-auto-rows: 10px !important;
    justify-content: center !important;
    align-items: center !important;

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

    gap: 8px 9px !important;
    margin: 15px auto 6px !important;
    padding: 0 !important;
  }

  .chilerobots-homecarousel
  .crhc-carousel-mobile
  .crhc-carousel-indicators.crhc-indicators-two-rows {
    position: static !important;

    display: grid !important;
    grid-template-columns: repeat(10, 8px) !important;
    grid-auto-rows: 8px !important;
    justify-content: center !important;
    align-items: center !important;

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

    gap: 8px 7px !important;
    margin: 18px auto 0 !important;
    padding: 0 !important;

    left: auto !important;
    right: auto !important;
    transform: none !important;
  }

  .chilerobots-homecarousel
  .crhc-carousel-mobile
  .crhc-carousel-indicators.crhc-indicators-two-rows
  > li {
    width: 8px !important;
    height: 8px !important;
    min-width: 8px !important;
    min-height: 8px !important;
    margin: 0 !important;
    padding: 0 !important;
  }
}