/** Shopify CDN: Minification failed

Line 422:20 Unexpected "{"
Line 422:29 Expected ":"
Line 467:20 Unexpected "{"
Line 467:29 Expected ":"
Line 484:20 Unexpected "{"
Line 484:29 Expected ":"
Line 2339:3 Unexpected "{"
Line 4129:20 Expected identifier but found whitespace
Line 4129:28 Unexpected "!"
Line 4220:20 Expected identifier but found whitespace
... and 2 more hidden warnings

**/
/* ======================================
   ICONOS HEADER — FORZAR TEXTO DEBAJO
   ====================================== */

.header-item--icons .site-nav__icons {
    display: flex !important;
    justify-content: flex-start !important; /* ?? ICONOS A LA IZQUIERDA */
    align-items: center !important;
    gap: 45px !important;
}

.header-item--icons .site-nav__icons a,
.header-item--icons .site-nav__icons button,
.header-item--icons .site-nav__icons .cart-link {
    display: flex !important;
    flex-direction: column !important; /* icono arriba / texto abajo */
    align-items: center !important;
    justify-content: center !important;
    text-align: center !important;
}

.header-item--icons .site-nav__icons svg {
    width: 28px !important;
    height: 28px !important;
    display: block !important;
}

.header-item--icons .site-nav__icons .icon__fallback-text {
    display: block !important;
    margin-top: 6px !important;
    font-size: 12px !important;
    line-height: 1 !important;
    opacity: 1 !important;
    visibility: visible !important;
}

.js-drawer-open-nav {
    display: none !important; /* ocultar hamburguesa desktop */
}
/* ===========================================
   ICONOS — ALINEAR TODOS A LA IZQUIERDA
   =========================================== */

.header-item--icons {
    justify-content: flex-start !important;
}

.header-item--icons .site-nav__icons {
    justify-content: flex-start !important;
    gap: 35px !important;
}

.header-item--icons a,
.header-item--icons button,
.header-item--icons .site-nav__link {
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    text-align: center !important;
}

.header-item--icons svg {
    width: 26px !important;
    height: 26px !important;
}

.header-item--icons .icon__fallback-text {
    margin-top: 4px !important;
    font-size: 12px !important;
    display: block !important;
}

/* Ocultar hamburguesa en desktop */
@media (min-width: 769px) {
    .js-drawer-open-nav {
        display: none !important;
    }
}
/* ===========================================
   ICONOS — PEGADOS A LA DERECHA Y MÁS JUNTOS
   =========================================== */

/* Contenedor de iconos alineado completamente a la derecha */
.header-item--icons {
    justify-content: flex-end !important;
    margin-left: auto !important;
}

/* Agrupación de iconos: juntos y alineados a la derecha */
.header-item--icons .site-nav__icons {
    display: flex !important;
    justify-content: flex-end !important;
    align-items: center !important;
    gap: 0px !important; /* ? distancia entre iconos (AJUSTABLE) */
}

/* Estructura icono + texto */
.header-item--icons a,
.header-item--icons button,
.header-item--icons .site-nav__link {
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    text-align: center !important;
}

/* Tamaño del ícono */
.header-item--icons svg {
    width: 24px !important;
    height: 24px !important;
}

/* Texto debajo del icono */
.header-item--icons .icon__fallback-text {
    margin-top: 4px !important;
    font-size: 11px !important;
    display: block !important;
}

/* Ocultar la hamburguesa en desktop */
@media (min-width: 769px) {
    .js-drawer-open-nav {
        display: none !important;
    }
}
/* TITULOS DEL MEGA MENÚ */
.site-nav__dropdown .site-nav__dropdown-link--top-level {
    font-size: 16px !important; /* AUMENTA EL TAMAÑO DE LOS TITULOS */
    font-weight: 600 !important;
    letter-spacing: 1px;
}

/* OPCIONES DEL MEGA MENÚ */
.site-nav__dropdown .site-nav__dropdown-link {
    font-size: 13px !important; /* DISMINUYE EL TAMAÑO DE LAS OPCIONES */
    font-weight: 400 !important;
}

/* QUITAR HOVER DE FONDO */
.site-nav__dropdown-link:hover,
.site-nav__dropdown-link--top-level:hover {
    background: transparent !important;
}
/* ACHICAR OPCIONES DEL MEGA MENÚ */
.site-nav__dropdown .site-nav__dropdown-link {
    font-size: 12px !important;   /* antes 13px */
    font-weight: 400 !important;
}
/* ACHICAR SOLO LAS OPCIONES (NO LOS TÍTULOS) */
.site-nav__dropdown .site-nav__dropdown-link:not(.site-nav__dropdown-link--top-level) {
    font-size: 10.5px !important;   /* Opciones más chicas */
    font-weight: 400 !important;
}
/* ELIMINAR HOVER DEL MENÚ PRINCIPAL */
.site-nav__link:hover,
.site-nav__link--top-level:hover,
.site-nav__link--underline:hover {
    color: inherit !important;
    text-decoration: none !important;
    border-bottom: none !important;
    background: none !important;
    opacity: 1 !important;
}

.site-nav__link--underline {
    border-bottom: none !important;
}
/* ZOOM EN IMÁGENES SECUNDARIAS (Aromas, Colecciones, etc.) */
.grid-product__image img {
    transition: transform .35s ease !important;
}

.grid-product__image img:hover {
    transform: scale(1.12) !important;
}
/* QUITAR HOVER SOLO DEL MENÚ SUPERIOR */
.site-nav__link--top-level:hover,
.site-nav__link--underline:hover {
    color: inherit !important;
    text-decoration: none !important;
    border-bottom: none !important;
    background: none !important;
    opacity: 1 !important;
}

/* Asegura que no aparezca la línea inferior */
.site-nav__link--underline {
    border-bottom: none !important;
}

/* Quitar la animación del subrayado del tema Impulse */
.site-nav__link--top-level::after,
.site-nav__link--top-level:hover::after {
    width: 0 !important;
    opacity: 0 !important;
}
/* ZOOM PARA IMÁGENES GRANDES DE FRAGANCIAS */
.template-collection .image-element__wrap img,
.template-collection img {
    transition: transform 0.6s ease !important;
}

.template-collection .image-element__wrap:hover img,
.template-collection img:hover {
    transform: scale(1.08) !important;
}
/* ----- MOSTRAR EL MENÚ MÓVIL (HAMBURGUESA) PARA ENOVA AGENCY ----- */

@media (max-width: 768px) {

  /* Mostrar el botón de menú móvil */
  .js-drawer-open-nav,
  button.js-drawer-open-nav,
  .site-nav__link--icon.js-drawer-open-nav {
      display: flex !important;
      visibility: visible !important;
      opacity: 1 !important;
  }

  /* Forzar a mostrar el contenedor del menú */
  .site-nav.medium-up--hide {
      display: flex !important;
      visibility: visible !important;
      opacity: 1 !important;
  }

  /* Evitar que el header lo tape o lo empuje */
  .header-item--left,
  .header-item--navigation,
  .header-item--icons {
      display: flex !important;
      align-items: center !important;
  }
}
/* ===== CENTRAR MENÚ ENTRE LOGO E ÍCONOS (DESKTOP) ===== */
@media (min-width: 769px) {

  /* 3 columnas: LOGO | MENÚ | ICONOS */
  .header-layout.header-layout--left-center {
    display: grid;
    grid-template-columns: auto 1fr auto;
    align-items: center;
    width: 100%;
  }

  /* Logo a la izquierda */
  .header-layout.header-layout--left-center .header-item--logo {
    grid-column: 1;
    justify-self: start;
  }

  /* MENÚ centrado */
  .header-layout.header-layout--left-center .header-item--navigation.small--hide {
    grid-column: 2;
    justify-self: center;
  }

  /* Íconos a la derecha */
  .header-layout.header-layout--left-center .header-item--icons {
    grid-column: 3;
    justify-self: end;
  }
}
/* AJUSTE FINO PARA CENTRAR VISUALMENTE EL MENÚ */
@media (min-width: 769px) {
  .header-layout.header-layout--left-center {
    grid-template-columns: 1fr auto 1fr !important;
  }
}
/* ===== FIX BOTÓN HAMBURGUESA EN MÓVIL ===== */
@media (max-width: 768px) {

  /* Asegura que la hamburguesa SIEMPRE se vea */
  .header-item--mobile-nav {
    display: block !important;
    opacity: 1 !important;
    visibility: visible !important;
  }

  /* Si quedó oculta detrás del menú de escritorio */
  .header-item--navigation.small--hide {
    display: none !important;
  }

  /* Si el icono es blanco y no se ve */
  .site-nav__link--icon svg {
    stroke: #000 !important;
  }
}
/* ===== FIX COMPLETO DEL HEADER EN MÓVIL ===== */
@media (max-width: 768px) {

  

  /* Mostrar sólo la hamburguesa */
  .header-item--mobile-nav {
    display: block !important;
  }

  /* Asegurar que el icono hamburguesa sea visible y negro */
  .header-item--mobile-nav .site-nav__link--icon svg {
    stroke: #000 !important;
  }

  /* Ocultar menú de escritorio si se coló */
  .header-item--navigation.small--hide {
    display: none !important;
  }

  /* Logo correctamente alineado en móvil */
  .header-item--logo {
    justify-self: start !important;
  }

  /* Forzar espacio para que no se amontone todo */
  .header-layout {
    grid-template-columns: auto 1fr auto !important;
    align-items: center !important;
  }
}
/* ===== FIX DEFINITIVO PARA HEADER EN MÓVIL ===== */
@media (max-width: 768px) {

  /* OCULTAR íconos de escritorio sí o sí */
/*
.header-item--icons,
.header-item--icons * {
    display: none !important;
    visibility: hidden !important;
    opacity: 0 !important;
}
*/

  /* Mostrar SOLO la hamburguesa */
  .header-item--mobile-nav {
    display: block !important;
    visibility: visible !important;
    opacity: 1 !important;
  }

  /* Forzar estilo del icono hamburguesa */
  .header-item--mobile-nav svg {
    stroke: #000 !important;
  }

  /* Ocultar menú de escritorio */
  /*
  .header-item--navigation.small--hide {
    display: none !important;
  }*/

  /* Forzar el layout móvil a 2 columnas: logo + hamburguesa */
  .header-layout {
    display: grid !important;
    grid-template-columns: auto 1fr auto !important;
    align-items: center !important;
  }

  /* Alinear logo */
  .header-item--logo {
    grid-column: 1 !important;
    justify-self: start !important;
  }

  /* Alinear hamburguesa a la derecha TOTAL */
  .header-item--mobile-nav {
    grid-column: 3 !important;
    justify-self: end !important;
  }
}
/* FIX: Drawer (menú hamburguesa) no visible en móvil */
#NavDrawer,
.drawer,
.drawer--right,
.drawer--left {
  z-index: 999999 !important;
  position: fixed !important;
}

.header-sticky-wrapper,
.header-wrapper,
.site-header,
#HeaderWrapper {
  z-index: 1000 !important;
}
/* BLOQUEAR SCROLL DEL BODY CUANDO EL MENÚ MÓVIL ESTÁ ABIERTO */
body.drawer-open {
    overflow: hidden !important;
    height: 100vh !important;
}

/* Asegurar que el drawer haga scroll interno */
#NavDrawer,
.drawer {
    overflow-y: auto !important;
    -webkit-overflow-scrolling: touch !important;
}
/* ========== TITULO DE "COLECCIÓN DESTACADA" — ESTILO TCS ARGENTINA ========== */
#CollectionSection-collection-template .section-header__title,
.index-section .section-header__title {
    text-align: left !important;     /* A la izquierda */
    font-weight: 300 !important;     /* Letra más delgada */
    letter-spacing: 0.03em !important; /* Más elegante */
    margin-bottom: 10px !important;
}
/* TITULO DE COLECCIÓN DESTACADA – ESTILO TCS ARGENTINA */
#CollectionSection-{{ section.id }} .section-header__title {
    font-size: 22px !important;        /* Tamaño más pequeño */
    font-weight: 300 !important;       /* Más delgado */
    text-align: left !important;       /* A la izquierda */
    letter-spacing: 0.03em !important; /* Ajuste sutil */
    margin-top: 10px !important;       /* Más pegado al banner */
    margin-bottom: 20px !important;
}

/* Ajustar contenedor del título para que quede alineado */
.page-width .section-header {
    text-align: left !important;
}
/* TÍTULO DE COLECCIÓN DESTACADA — LOOK ARGENTINA */
.section-header__title {
  font-size: 24px !important;
  font-weight: 300 !important;
  text-align: left !important;
  margin-top: 10px !important;
  margin-bottom: 15px !important;
  letter-spacing: 0.03em !important;
}

/* Contenedor alineado a la izquierda */
.section-header {
  justify-content: flex-start !important;
  text-align: left !important;
}
/* --- AJUSTE REAL DEL TÍTULO DE COLECCIÓN DESTACADA --- */
#CollectionSection-.section-header__title,
.section-header__title.h2 {
  font-size: 22px !important;      /* Más pequeño */
  font-weight: 300 !important;     /* Más delgado */
  letter-spacing: 0.03em !important;
  text-align: left !important;     /* A la izquierda */
  margin-top: 5px !important;      /* Pegado al banner */
  margin-bottom: 15px !important;
}

/* Contenedor alineado a la izquierda */
.page-width .section-header {
  text-align: left !important;
  justify-content: flex-start !important;
}
/* ---- TITULO COLECCIÓN DESTACADA – ESTILO ARGENTINA ---- */
#CollectionSection-{{ section.id }} .section-header__title,
.section-header .section-header__title {
    font-size: 22px !important;
    font-weight: 300 !important;
    letter-spacing: 0.02em !important;
    text-align: left !important;
    margin-top: 10px !important;
    margin-bottom: 5px !important;
}

/* ---- CONTENEDOR DEL TITULO ---- */
.section-header {
    justify-content: flex-start !important;
    text-align: left !important;
}
/* ===== ESTILO TÍTULO COLECCIÓN — CLON TCS ARGENTINA ===== */

#CollectionSection-{{ section.id }} .section-header__title,
.index-section .section-header__title,
.section-header__title {
    font-size: 22px !important;        /* Más pequeño */
    font-weight: 300 !important;       /* Más delgado */
    text-align: left !important;       /* A la izquierda */
    letter-spacing: 0.03em !important; /* Espaciado elegante */
    margin-top: 5px !important;        /* Más pegado al banner */
    margin-bottom: 15px !important;
}

/* Contenedor del título alineado a la izquierda */
.index-section .section-header,
.section-header {
    justify-content: flex-start !important;
    text-align: left !important;
}
/* =========================================== */
/*       FORZAR ESTILO DE TÍTULO ARGENTINA     */
/* =========================================== */

/* Apunta ESPECÍFICAMENTE al título dentro de la Colección destacada */
#CollectionSection-18567596703905 .section-header__title,
.shopify-section--featured-collection .section-header__title {
    font-size: 22px !important;      /* Más pequeño */
    font-weight: 300 !important;     /* Letra más fina */
    text-align: left !important;     /* A la izquierda */
    letter-spacing: 0.02em !important;
    margin-top: 5px !important;      /* Más pegado al banner */
    margin-bottom: 10px !important;
    text-transform: none !important; /* Quitar MAYÚSCULAS forzadas */
}
/* ======== TÍTULO DE COLECCIÓN — ESTILO TCS ARGENTINA ======== */

/* Estilo general del título en la sección de colección destacada */
.template-index .featured-collection .section-header__title,
.index-section .section-header__title {
    font-size: 22px !important;        /* Tamaño más pequeño */
    font-weight: 300 !important;       /* Más delgado */
    text-align: left !important;       /* A la izquierda */
    letter-spacing: 0.02em !important; /* Espaciado sutil */
    margin-top: 10px !important;       /* Pegado al banner */
    margin-bottom: 10px !important;
    text-transform: none !important;   /* Evita uppercase */
}

/* Contenedor alineado a la izquierda */
.template-index .featured-collection .section-header,
.index-section .section-header {
    text-align: left !important;
    justify-content: flex-start !important;
}
/* AJUSTES REALES PARA TITULO DE COLECCIÓN DESTACADA */
#index-section main #CollectionSection-185675967903905 .section-header__title,
#CollectionSection-185675967903905 .section-header__title {
    font-size: 22px !important;      /* Tamaño más pequeño */
    font-weight: 300 !important;     /* Más delgado */
    text-align: left !important;     /* A la izquierda */
    letter-spacing: 0.02em !important;
    margin-top: 10px !important;     /* Más cerca del banner */
    margin-bottom: 10px !important;
}
/* COLOR DEL MENÚ DESKTOP */
.header-item--navigation .site-nav__link,
.header-item--navigation .site-nav__link span {
  color: #ffffff !important;
}

/* COLOR DE LOS LINKS EXPANDIDOS */
li.site-nav__item a.site-nav__link,
li.site-nav__item a.site-nav__link--underline {
  color: #ffffff !important;
}

/* ÍCONOS DEL HEADER (buscar, cuenta, carrito, etc.) */
.header__icon svg,
.header__icon {
  fill: #ffffff !important;
  stroke: #ffffff !important;
}

/* ÍCONOS COMO IMG */
.header__icon img {
  filter: brightness(0) invert(1) !important;
}
/* -----------------------------
   COLOR MENU PRINCIPAL (ya funciona)
------------------------------ */
.header-item--navigation .site-nav__link,
.header-item--navigation .site-nav__link span {
  color: #ffffff !important;
}

/* -----------------------------
   FLECHITAS DEL MENÚ (chevron ▼)
------------------------------ */
.site-nav__link .icon-chevron-down,
.site-nav__link .icon-caret,
.site-nav__link svg.icon {
  stroke: #ffffff !important;
  fill: #ffffff !important;
}

/* -----------------------------
   ÍCONOS SUPERIORES (Usuario, Buscar, Tiendas, Carrito)
------------------------------ */
.header__icon svg {
  stroke: #ffffff !important;
  fill: #ffffff !important;
}

/* Íconos que usan IMG */
.header__icon img {
  filter: brightness(0) invert(1) !important;
}

/* -----------------------------
   TEXTO DE ICONOS (INGRESAR, BUSCAR, TIENDAS, CARRITO)
------------------------------ */
.header__icon-wrapper,
.header__icon-wrapper span,
.header__icon-label,
.header__icon-label span {
  color: #ffffff !important;
}
/* ===========================================
   ICONOS SVG (usuario / buscar / tiendas / carrito)
=========================================== */
.site-nav__icons a svg,
.site-nav__link--icon svg,
.site-nav__icons svg {
  fill: #ffffff !important;
  stroke: #ffffff !important;
}

/* ===========================================
   TEXTO DE ICONOS (INGRESAR / BUSCAR / TIENDAS / CARRITO)
=========================================== */
.site-nav__icons a span,
.icon__fallback-text,
.icon__fallback-text span,
.cart-link,
.cart-link span {
  color: #ffffff !important;
}

/* ===========================================
   FLECHITAS ▼ DEL MENÚ
=========================================== */
.site-nav__link svg.icon-caret,
.site-nav__link .icon-caret,
.site-nav__link svg {
  fill: #ffffff !important;
  stroke: #ffffff !important;
}

/* ===========================================
   ÍCONOS COMO IMÁGENES (por si alguno lo es)
=========================================== */
.site-nav__icons img,
.site-nav__link--icon img {
  filter: brightness(0) invert(1) !important;
}
/* ===============================
   ICONOS (usuario, buscar, tiendas, carrito)
   Forzar stroke y fill de todos los SVG dentro del header
=============================== */
header.site-header svg {
  stroke: #ffffff !important;
  fill: #ffffff !important;
}

/* Si algún SVG usa elementos internos */
header.site-header svg path,
header.site-header svg circle,
header.site-header svg line,
header.site-header svg polyline,
header.site-header svg polygon {
  stroke: #ffffff !important;
  fill: #ffffff !important;
}

/* ===============================
   FLECHITAS ▼ del menú (los chevrons)
=============================== */
.site-nav__link svg.icon-caret,
.site-nav__link svg.icon-chevron-down,
.site-nav__link svg {
  stroke: #ffffff !important;
  fill: #ffffff !important;
}

/* ===============================
   ÍCONOS QUE SON <use> (algunos temas los usan)
=============================== */
header.site-header svg use {
  stroke: #ffffff !important;
  fill: #ffffff !important;
}
/* Íconos SOLO delineados (sin relleno) */
header.site-header svg,
header.site-header svg path,
header.site-header svg line,
header.site-header svg polyline,
header.site-header svg polygon {
  fill: none !important;      /* <- sin relleno */
  stroke: #ffffff !important; /* <- borde blanco */
}

/* Iconos del menú — COLOR DINÁMICO SEGÚN LA PÁGINA */

/* HOME (blanco) */
.template-index .site-nav__link svg,
.template-index .site-nav__link svg path {
    stroke: #ffffff !important;
    fill: #ffffff !important;
}

/* RESTO DE PÁGINAS (negro) */
body:not(.template-index) .site-nav__link svg,
body:not(.template-index) .site-nav__link svg path {
    stroke: #000000 !important;
    fill: #000000 !important;
}

/* ======== COLOR DEL TEXTO DEL MENÚ ======== */

/* HOME (blanco) */
.template-index .site-nav__link,
.template-index .site-nav__link * {
    color: #ffffff !important;
}

/* OTRAS PÁGINAS (negro) */
body:not(.template-index) .site-nav__link,
body:not(.template-index) .site-nav__link * {
    color: #000000 !important;
}
/* ============================
   TEXTO DEL MENÚ - COLOR DINÁMICO
   ============================ */

/* HOME (blanco) */
.template-index .site-nav__link,
.template-index .site-nav__link *,
.template-index .site-nav__item .site-nav__link--underline {
    color: #ffffff !important;
}

/* RESTO DE PÁGINAS (negro) */
body:not(.template-index) .site-nav__link,
body:not(.template-index) .site-nav__link *,
body:not(.template-index) .site-nav__item .site-nav__link--underline {
    color: #000000 !important;
}

/* ============================
   ÍCONOS DELINEADOS SIN RELLENO
   ============================ */

.site-nav__link svg,
.site-nav__link svg path {
    fill: none !important;
}

/* HOME – íconos y flechas blancas */
.template-index .site-nav__link svg,
.template-index .site-nav__link svg path {
    stroke: #ffffff !important;
    color: #ffffff !important;
}

/* RESTO – íconos y flechas negras */
body:not(.template-index) .site-nav__link svg,
body:not(.template-index) .site-nav__link svg path {
    stroke: #000000 !important;
    color: #000000 !important;
}
/* =======================================
   ICONOS DELINEADOS – SIN RELLENO (fill)
   ======================================= */

/* Quitar relleno en todos los íconos */
.site-nav__link svg,
.site-nav__link svg path,
header svg,
header svg path,
.header__icon svg,
.header__icon svg path {
    fill: none !important;
}

/* HOME (blanco delineado) */
.template-index .site-nav__link svg,
.template-index .site-nav__link svg path,
.template-index header svg,
.template-index header svg path {
    stroke: #ffffff !important;   /* borde blanco */
    fill: none !important;         /* sin relleno */
}

/* OTRAS PÁGINAS (negro delineado) */
body:not(.template-index) .site-nav__link svg,
body:not(.template-index) .site-nav__link svg path,
body:not(.template-index) header svg,
body:not(.template-index) header svg path {
    stroke: #000000 !important;   /* borde negro */
    fill: none !important;         /* sin relleno */
}
/* ===================================
   AJUSTE FINAL TÍTULO BAJO EL BANNER
   =================================== */

/* TÍTULO MÁS CHICO Y A LA IZQUIERDA */
.section-header__title {
    font-size: 18px !important;
    letter-spacing: 1px !important;
    text-align: left !important;
    margin: 0 !important;
    padding: 0 !important;
}

/* QUITAR ESPACIO SUPERIOR ENTRE BANNER Y TÍTULO */
.shopify-section .section-header,
.section-header {
    margin-top: 0 !important;
    padding-top: 0 !important;
}

/* ELIMINAR EL ESPACIO GIGANTE QUE CREA EL CONTENEDOR */
.page-width {
    padding-top: 0 !important;
    margin-top: 0 !important;
}

/* GARANTIZAR QUE EL TÍTULO QUEDE PEGADO AL BANNER */
main .shopify-section:first-of-type + .shopify-section .section-header {
    margin-top: 5px !important;
    padding-top: 0 !important;
}

/* MOVER EL TEXTO HACIA LA IZQUIERDA */
.section-header__title {
    padding-left: 10px !important;
}
/* =======================================
   AJUSTE FINAL DEL TÍTULO BAJO EL BANNER
   ======================================= */

/* HACER EL TÍTULO MÁS CHICO */
.section-header__title {
    font-size: 18px !important;      /* MÁS CHICO */
    text-align: left !important;     /* A LA IZQUIERDA */
    margin: 0 !important;
    padding: 0 !important;
    line-height: 1.2 !important;
}

/* PEGARLO AL BANNER (ELIMINAR MARGEN SUPERIOR) */
.index-section:first-of-type .page-width,
.index-section:first-of-type .section-header {
    margin-top: 0 !important;
    padding-top: 0 !important;
}

/* AÚN MÁS PEGADO (BORRAR EL ESPACIO INTERNO DE LA SECCIÓN) */
.index-section:first-of-type {
    margin-top: 0 !important;
    padding-top: 0 !important;
}

/* MOVERLO UN POCO A LA IZQUIERDA */
.index-section:first-of-type .section-header__title {
    padding-left: 16px !important;
}
/* =====================================
   OVERRIDE FINAL PARA EL TÍTULO
   ===================================== */

/* HACEMOS EL SELECTOR MÁS ESPECÍFICO QUE EL ORIGINAL */
.template-index .featured-collection .section-header__title,
.section-header__title.section-header__title {
    font-size: 15px !important;    /* MÁS CHICO */
    margin-top: 0px !important;    /* PEGADO ARRIBA */
    margin-bottom: 5px !important;
    padding-top: 0 !important;
    padding-left: 10px !important; /* A LA IZQUIERDA */
    line-height: 1.1 !important;
}

/* ELIMINAMOS ESPACIOS DE LOS CONTENEDORES PADRE */
.template-index .featured-collection .page-width,
.template-index .featured-collection .section-header {
    margin-top: 0 !important;
    padding-top: 0 !important;
}
/* =======================================
   PEGAR TÍTULO AL BANNER Y A LA IZQUIERDA
   ======================================= */

/* Quitar espacio que el tema agrega arriba */
.template-index .shopify-section:first-of-type + .shopify-section.index-section,
.template-index .index-section:first-of-type,
.template-index .index-section .page-width,
.template-index .index-section .section-header {
    padding-top: 0 !important;
    margin-top: 0 !important;
}

/* Alinear completamente a la izquierda */
.template-index .index-section .section-header__title {
    padding-left: 0 !important;
    margin-left: 0 !important;
    text-align: left !important;
}

/* Ajuste adicional para empujar más arriba */
#CollectionSection-18567596703905 {
    margin-top: 0 !important;
    padding-top: 0 !important;
}
/* =======================================
   APLICAR ESTILO GLOBAL A TODOS LOS BANNERS
   ======================================= */

/* Títulos más chicos y alineados a la izquierda */
.section-header__title {
    font-size: 16px !important;
    line-height: 1.2 !important;
    text-align: left !important;
    margin: 0 !important;
    padding: 0 !important;
    padding-left: 0 !important;
}

/* Eliminar espacios gigantes de TODAS las secciones tipo índice */
.index-section,
.index-section .page-width,
.index-section .section-header {
    margin-top: 0 !important;
    padding-top: 0 !important;
}

/* Quitar espacio entre banner e h2 de TODAS las featured-collection */
.shopify-section.featured-collection,
.shopify-section[class*="featured-collection"],
.shopify-section .featured-collection,
.shopify-section .section-header {
    margin-top: 0 !important;
    padding-top: 0 !important;
}
.aroma-selector {
  margin-bottom: 25px !important;
}
.product-single__sticky {
    margin-top: -160px !important;
}
/* Oculta la lupa/zoom debajo de la imagen en móviles */
@media (max-width: 749px) {
    .product-single__media .zoom, 
    .zoom, 
    .product__media-icon {
        display: none !important;
    }
}
/* Ajuste SOLO para móvil: deja la imagen en su posición normal */
@media (max-width: 749px) {
    .product-single__sticky {
        margin-top: 0 !important;
    }
}
/* Oculta la lupa / zoom en móviles */
@media (max-width: 749px) {
    .product__media-icon,
    .zoom,
    .product-single__media .zoom {
        display: none !important;
    }
}
/* Ocultar icono de zoom debajo de la imagen */
.product__photo-zoom,
button.js-photoswipe__zoom,
.btn.btn--circle.js-photoswipe__zoom {
    display: none !important;
    visibility: hidden !important;
    opacity: 0 !important;
    pointer-events: none !important;
}
/* FORZAR LOGO SIEMPRE — FIX DEFINITIVO */
.site-header__logo img,
.site-header__logo picture img {
    content: url("/cdn/shop/files/logo_white_png.png?v=1764260488") !important;
    width: 180px !important;
    height: auto !important;
    display: block !important;
}
/* LOGO NEGRO FUERA DE HOME */
body:not(.template-index) .site-header__logo img,
body:not(.template-index) .site-header__logo picture img {
    content: url("/cdn/shop/files/logo_black.png?v=1764260471") !important;
}
/* ===================================
   FIX DEFINITIVO PARA EL LOGO
   =================================== */

/* Mostrar siempre el logo */
.site-header__logo img {
    display: block !important;
    opacity: 1 !important;
    visibility: visible !important;
    width: auto !important;
    height: auto !important;
}

/* Logo blanco solo en HOME */
.template-index .site-header__logo img {
  content: url("/cdn/shop/files/logo_white_png.png?v=1764260488") !important;
}

/* Logo negro en todas las demás páginas */
body:not(.template-index) .site-header__logo img {
  content: url("/cdn/shop/files/logo_black.png?v=1764260471") !important;
}

/* IMPORTANTE: permitir clic en el logo */
.site-header__logo a {
    pointer-events: auto !important;
}
/* Mover logo real a la izquierda */
.header-item--logo .site-header__logo {
  margin-left: -40px !important;
}
/* Ajuste preciso del logo a la izquierda */
.header-item--logo {
  margin-left: -60px !important;
}
/* 🔥 Fix real para mover el logo SOLO en móvil */
@media screen and (max-width: 749px) {
  .site-header__logo,
  .site-header__logo-link,
  .header-item--logo {
    transform: translateX(10px) !important;
  }
}
/* Carrito interior (rueditas) en negro en todas las páginas excepto Home */
body:not(.template-index) svg.icon-cart * {
  stroke: #000 !important;
  fill: #000 !important;
}
/* TIENDAS: fuerza el círculo interior a negro fuera del Home */
body:not(.template-index) svg.icon-stores circle {
  stroke: #000 !important;
  fill: #000 !important;
}

/* QUITAR CAJA NEGRA E ÍCONOS DEL TEMA IMPULSE */
.pagination .prev,
.pagination .next {
  background: transparent !important;
  border: none !important;
  box-shadow: none !important;
}

.pagination .prev a,
.pagination .next a {
  background: transparent !important;
  border: none !important;
}

/* BLOQUEAR ICONOS AUTOMÁTICOS DEL TEMA */
.pagination .prev a svg,
.pagination .next a svg,
.pagination .prev a .icon,
.pagination .next a .icon {
  display: none !important;
}

/* BLOQUEAR PSEUDO-ELEMENTOS DEL TEMA */
.pagination .prev::before,
.pagination .prev::after,
.pagination .next::before,
.pagination .next::after,
.pagination .prev a::before,
.pagination .prev a::after,
.pagination .next a::before,
.pagination .next a::after {
  display: none !important;
  content: "" !important;
}

/* Hacer texto visible y limpio */
.pagination .prev a,
.pagination .next a {
  color: #000 !important;
  font-size: 16px !important;
}
/* AJUSTE FINAL DE PAGINACIÓN */
.pagination .prev a,
.pagination .next a {
  font-size: 14px !important;
  font-weight: 400 !important;
  letter-spacing: 0.3px !important;
  display: inline-flex !important;
  align-items: center !important;
  gap: 4px !important;
}

/* Ajustar flecha izquierda */
.pagination .prev a {
  padding-right: 4px !important;
}

/* Ajustar flecha derecha */
.pagination .next a {
  padding-left: 4px !important;
}

/* Alinear todo ordenado */
.pagination {
  display: flex !important;
  justify-content: center !important;
  align-items: center !important;
  gap: 16px !important;
}
/* Alinear flecha y texto en la misma línea */
.pagination .prev a,
.pagination .next a {
    display: inline-flex !important;
    align-items: center !important;
}
/* Forzar flecha + texto en la misma línea */
.pagination .prev a,
.pagination .next a {
    white-space: nowrap !important;
}

/* Ajustar separación */
.pagination .prev a {
    gap: 6px !important;
}

.pagination .next a {
    gap: 6px !important;
}

/* Forzar flecha a alinearse centrada */
.pagination .prev a::before,
.pagination .next a::after {
    vertical-align: middle !important;
    line-height: 1 !important;
}
/* ==========================================
   AJUSTE FINAL: alineación + simetría exacta
   ========================================== */

/* Alineación vertical idéntica */
.pagination .prev a::before,
.pagination .next a::after {
    vertical-align: middle !important;
    line-height: 1 !important;
    position: relative !important;
    top: 2px !important;    /* antes 1px → ahora 2px */
}


/* Mantener todo en una sola línea */
.pagination .prev a,
.pagination .next a {
    white-space: nowrap !important;
}
/* ==========================================
   SIMETRÍA PERFECTA — AJUSTE FINAL
   ========================================== */

/* Alineación vertical perfecta */
.pagination .prev a::before,
.pagination .next a::after {
    vertical-align: middle !important;
    line-height: 1 !important;
    position: relative !important;
    top: 2px !important;
}

/* Distancias simétricas */

.pagination .next {
    margin-left: 18px !important;
}

/* Evitar saltos */
.pagination .prev a,
.pagination .next a {
    white-space: nowrap !important;
}
/* Separación final exacta */
.pagination .prev {
    margin-right: 26px !important;   /* antes 22px → +4px */
}
/* Eliminar espacios invisibles entre elementos de paginación */
.pagination {
    display: flex !important;
    align-items: center !important;
    gap: 18px !important;   /* antes 14px → ahora más separación */
}

/* Ahora ajustamos distancias reales (simétricas) */
.pagination .prev {
    order: 1;
}

.pagination .page {
    order: 2;
}

.pagination .next {
    order: 3;
}
/* Compensación óptica final para simetría perfecta */
.pagination .prev {
    margin-right: 4px !important;   /* empuja 1 un poquito hacia la derecha */
}

.pagination .next {
    margin-left: 4px !important;    /* empuja Siguiente un poquito hacia la izquierda */
}
/* Corrección fina final — evitar que se pegue demasiado */
.pagination .prev {
    margin-right: 12px !important;
}

.pagination .next {
    margin-left: 12px !important;
}
/* Ajuste ultra fino del lado izquierdo */
.pagination .prev {
    margin-right: 10px !important; /* antes 12px */
}
/* Ajuste fino del espacio entre números y Anterior */
.pagination .page:not(.current) {
    margin: 0 6px !important; /* estaba más grande, ahora más parejo */
}

/* Ajuste exacto solo para el número 1 */
.pagination .page:nth-of-type(2) {
    margin-left: 4px !important;
}
/* Ajuste perfecto del espacio solo para el número 1 */
.pagination span.page:first-of-type {
    margin-left: 14px !important;  /* mueve el 1 a la derecha */
    margin-right: 14px !important; /* balancea hacia ambos lados */
}
/* Fuerza máxima para mover solo el número 1 */
#CollectionAjaxContent .pagination > span.page:nth-of-type(1) {
    margin-left: 30px !important;
    margin-right: 10px !important;
    display: inline-block !important;
}
/* ===============================
   FIX FINAL — PAGINACIÓN SIMÉTRICA
   =============================== */

/* Centrar y espaciar elementos */
.pagination {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 40px !important;  /* espacio uniforme */
}
/* Ajuste fino de simetría */
/* Ajuste ultra-fino de simetría */
.pagination .prev {
    margin-right: 38px !important;  /* mueve más el 1 a la derecha */
}
.pagination .next {
    margin-left: 42px !important;
}

/* Alinear verticalmente ambos */
.pagination .prev a,
.pagination .next a {
    display: inline-flex !important;
    align-items: center !important;
}
/* Ajusta la alineación del número en el selector de cantidad */
input[type="number"] {
  padding-top: 12px !important;
  padding-bottom: 12px !important;
  height: 48px !important;
  line-height: 48px !important;
}
/* Baja los botones + y - para alinearlos con el número */
.js-qty__adjust {
  margin-top: 10px !important;
}
/* Ocultar módulo de recogida disponible */
.store-availability,
.store-availability-container,
product-store-availability,
.product__pickup-availabilities {
    display: none !important;
}
/* ===== HEADER TRANSPARENTE SOLO EN HOME ===== */
.template-index .site-header,
.template-index #SiteHeader,
.template-index .header-sticky-wrapper {
    background: transparent !important;
    box-shadow: none !important;
}

/* Quitar overlay gris que Impulse agrega en HOME */
.template-index .site-header::before,
.template-index #SiteHeader::before,
.template-index .header-sticky-wrapper::before {
    background: transparent !important;
    opacity: 0 !important;
    box-shadow: none !important;
}

/* ===== EVITAR QUE LAS PÁGINAS INTERNAS TENGAN ESPACIO EXTRA ===== */
.page-container,
#PageContainer,
.transition-body {
    margin-top: 0 !important;
    padding-top: 0 !important;
}

/* ===== EVITAR QUE EL HEADER TAPE CONTENIDO EN PRODUCTO ===== */
.template-product .product-section {
    scroll-margin-top: 120px;
}
/* Ajustar separación vertical entre items */
.site-nav__dropdown .grid__item {
  margin-bottom: 8px !important;   /* Antes estaba en ~20px */
}

/* Ajustar separación entre columnas */
.site-nav__dropdown .grid {
  row-gap: 15px !important;        /* Reduce altura entre filas */
}

/* Alinear mejor los bloques dentro del megamenú */
.site-nav__dropdown-megamenu .grid {
  align-items: start !important; 
}
.site-nav__dropdown-link--top-level
/* Oscurecer títulos de categorías del megamenu */
.site-nav__dropdown-link--top-level {
  color: #222 !important;     /* más oscuro */
  font-weight: 600 !important; /* un poquito más fuerte */
}
/* === VOLVER A COMO ESTABA + TÍTULOS MÁS OSCUROS === */

/* Títulos del megamenú (categorías principales) */
.site-nav__dropdown.megamenu .h5,
.site-nav__dropdown.megamenu .h5 a {
  color: #222222 !important;   /* más oscuro */
  font-weight: 600 !important;
  letter-spacing: 0.5px !important;
  text-transform: uppercase !important;
}

/* Submenús con color suave (NO cambiar esto) */
.site-nav__dropdown.megamenu .site-nav__dropdown-link {
  color: #777777 !important; 
  font-weight: 400 !important;
}

/* Hover de subcategorías */
.site-nav__dropdown.megamenu .site-nav__dropdown-link:hover {
  color: #333333 !important;
}
/* ===== UNIFICAR TODAS LAS PÁGINAS AL DISEÑO TIPO "B" ===== */

/* Asegurar espaciado uniforme bajo el header */
.template-collection .main-content,
.template-collection .content,
.main-content {
  padding-top: 40px !important;
}

/* Grid uniforme (todas las colecciones iguales) */
.grid--uniform .grid__item,
.collection-grid .grid__item {
  margin-bottom: 40px !important;
  padding: 0 15px !important;
}

/* Asegurar columnas iguales en TODAS las colecciones */
@media (min-width: 750px) {
  .grid--uniform .grid__item,
  .collection-grid .grid__item {
    width: 25% !important; /* 4 productos por fila */
  }
}

/* Alineación interna de productos (títulos, precios, imágenes) */
.product-card,
.grid-product,
.product-item {
  text-align: center !important;
}

/* Imágenes siempre alineadas */
.product-card__image,
.grid-product__image,
.product-item__image {
  margin: 0 auto !important;
}

/* Títulos y precios consistentes */
.grid-product__title,
.product-card__title,
.product-item__title {
  font-size: 14px !important;
  font-weight: 500 !important;
  letter-spacing: 0.3px !important;
}

.grid-product__price,
.product-card__price,
.product-item__price {
  margin-top: 6px !important;
}

/* Igualar el ancho visual de las rejillas entre colecciones */
.collection-grid {
  max-width: 1400px !important;
  margin: 0 auto !important;
}
/* Empujar hacia abajo el grid SI SE PEGA AL HEADER */
.template-collection .main-content {
    padding-top: 40px !important;
}

/* Ajuste extra para colecciones sin banner */
.template-collection .collection-grid,
.template-collection .collection-products {
    margin-top: 40px !important;
}
/* FIX GLOBAL — BAJAR TODAS LAS COLECCIONES QUE SUBEN EL GRID */
body.template-collection .collection-content {
    padding-top: 40px !important;
    margin-top: 0 !important;
}

/* FIX EXTRA — PARA CASOS QUE USAN GRID WRAPPER */
.template-collection #CollectionAjaxContent .page-width {
    margin-top: 40px !important;
    padding-top: 0 !important;
}
/* FIX GLOBAL PARA TODAS LAS COLECCIONES */
body.template-collection .shopify-section--main-collection,
body.template-collection .collection-content,
body.template-collection #MainContent,
body.template-collection #CollectionAjaxContent,
body.template-collection #CollectionAjaxContent .page-width,
body.template-collection .page-width,
body.template-collection .grid {
    padding-top: 0 !important;
    margin-top: 0 !important;
}
/* AJUSTE ESPECIAL — Estas 4 colecciones deben bajar un poco */
body.template-collection[data-collection-handle="grey-collection"] .collection-content,
body.template-collection[data-collection-handle="vela-moonlight"] .collection-content,
body.template-collection[data-collection-handle="vela-tin-1"] .collection-content,
body.template-collection[data-collection-handle="the-menu-collection---edicion-limitada"] .collection-content {
    padding-top: 140px !important;
}
/* FIX para Grey: este contenedor sí responde al padding */
body.template-collection[data-collection-handle="grey-collection"] .shopify-section--main-collection {
    padding-top: 140px !important;
}
body.template-collection[data-collection-handle="grey-collection"] #MainContent {
    padding-top: 140px !important;
}
/* FIX DEFINITIVO — BAJAR EL GRID DE TODAS LAS COLECCIONES DE IMPULSE */
body.template-collection .collection-content {
    padding-top: 140px !important;
    margin-top: 0 !important;
}

body.template-collection #MainContent {
    padding-top: 140px !important;
    margin-top: 0 !important;
}

body.template-collection #CollectionAjaxContent .page-width {
    padding-top: 0 !important;
    margin-top: 0 !important;
}
/* TODAS LAS COLECCIONES – sin padding */
body.template--collection .collection-content,
body.template--collection #MainContent,
body.template--collection #CollectionAjaxContent .page-width,
body.template--collection .page-width,
body.template--collection .grid {
    padding-top: 0 !important;
    margin-top: 0 !important;
}
/* ESTAS 4 COLECCIONES SE MANTIENEN PERFECTAS */
body.template--collection[data-collection-handle="grey-collection"] .collection-content,
body.template--collection[data-collection-handle="vela-moonlight"] .collection-content,
body.template--collection[data-collection-handle="vela-tin-1"] .collection-content,
body.template--collection[data-collection-handle="the-menu-collection---edicion-limitada"] .collection-content {
    padding-top: 80px !important;
}
/* Forzar iconos visibles en móvil */
@media screen and (max-width: 749px) {
  .header__icons,
  .header__icon,
  .header__icon--cart {
    display: flex !important;
    opacity: 1 !important;
    visibility: visible !important;
  }

  /* Asegurar espacio para que aparezcan */
  .site-header__icons {
    display: flex !important;
    justify-content: flex-end !important;
    align-items: center !important;
  }
}  /* ← Cierre correcto del @media */

/* FIX layout móvil */
@media (max-width: 768px) {
  .header-layout {
    display: flex !important;
    justify-content: space-between !important;
    align-items: center !important;
  }
}

/* FIX: Forzar color negro en los iconos del header SOLO en móvil */
@media (max-width: 768px) {
  .header-item--icons svg,
  .site-nav__icons svg {
    fill: #000 !important;
    stroke: #000 !important;
  }
/* 🔥 FIX DEFINITIVO — MOSTRAR ICONOS EN MÓVIL */
@media (max-width: 768px) {

  /* Mostrar el contenedor completo */
  .mobile-icons-only {
    display: flex !important;
    visibility: visible !important;
    opacity: 1 !important;
  }

  /* Mostrar los íconos dentro */
  .mobile-icons-only .site-nav__icons,
  .mobile-icons-only a,
  .mobile-icons-only button,
  .mobile-icons-only svg {
    display: flex !important;
    visibility: visible !important;
    opacity: 1 !important;
  }
/* 🔥 FIX CRÍTICO — FORZAR VISIBILIDAD DE ÍCONOS EN MÓVIL */
@media (max-width: 768px) {

  /* Mostrar el contenedor correcto */
  .header-item--icons.mobile-icons-only,
  .mobile-icons-only,
  .site-nav__icons {
      display: flex !important;
      visibility: visible !important;
      opacity: 1 !important;
  }

  /* Evitar que Impulse los oculte */
  .medium-up--hide {
      display: flex !important;
      visibility: visible !important;
      opacity: 1 !important;
  }

  /* No permitir que el menú móvil tape los íconos */
  .header-item--mobile-nav {
      z-index: 99999 !important;
  }
@media (max-width: 768px) {
  .header-item--icons,
  .header-item--icons * {
    display: flex !important;
    visibility: visible !important;
    opacity: 1 !important;
  }
}
/* ------------------------------
   HEADER MÓVIL PERSONALIZADO
   THECANDLESHOP - IMPULSE THEME
--------------------------------*/
@media (max-width: 767px) {

  /* Contenedor del header */
  .header__wrapper {
      display: flex !important;
      align-items: center !important;
      justify-content: space-between !important;
      padding: 10px 18px !important;
  }

  /* Menú hamburguesa izquierda */
  .header__wrapper .mobile-nav-trigger {
      order: 1 !important;
      margin-right: 14px;
  }
  .mobile-nav-trigger svg {
      width: 26px !important;
      height: 26px !important;
  }

  /* Logo centrado pero desplazado ligeramente */
  .header__logo {
      order: 2 !important;
      flex-grow: 1;
      display: flex;
      justify-content: flex-start;
  }
  .header__logo img {
      max-height: 42px !important;
      margin-top: 6px;  /* Baja un poco el logo */
  }

  /* Iconos alineados a la derecha */
  .header__icons {
      order: 3 !important;
      display: flex !important;
      align-items: center !important;
      gap: 14px !important;
  }

  .header__icons svg {
      width: 24px !important;
      height: 24px !important;
  }

  /* Quitar espacios extra automáticos */
  .header-item,
  .header__item {
      margin: 0 !important;
      padding: 0 !important;
  }

  /* Asegura que no quede texto debajo (texto INGRESAR, BUSCAR, TIENDAS, CARRITO) */
  .header__inline-menu {
      display: none !important;
  }
}
/* ----------------------------------------------------
   HEADER MÓVIL — REPARACIÓN COMPLETA PARA IMPULSE
   thecandleshop.com.pe
----------------------------------------------------*/
@media (max-width: 768px) {

  /* OCULTAR TOTALMENTE EL MENÚ DE ESCRITORIO */
  .header__link,
  .header__item--text,
  .header-inline,
  .header__inline-menu,
  .header__desktop {
    display: none !important;
  }

  /* MOSTRAR MENÚ MÓVIL Y ESTRUCTURA */
  .mobile-nav-wrapper,
  .mobile-nav-trigger {
    display: flex !important;
  }

  /* CONTENEDOR PRINCIPAL DEL HEADER */
  .header__wrapper {
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    padding: 14px 18px !important;
  }

  /* HAMBURGUESA IZQUIERDA */
  .mobile-nav-trigger {
    order: 1;
    margin-right: 14px;
  }
  .mobile-nav-trigger svg {
    width: 26px !important;
    height: 26px !important;
  }

  /* LOGO CENTRADO Y MÁS PEQUEÑO */
  .header__logo {
    order: 2;
    flex-grow: 1;
    display: flex;
    justify-content: flex-start;
  }
  .header__logo img {
    max-height: 38px !important;
    width: auto !important;
    margin-top: 4px;
  }

  /* ICONOS A LA DERECHA */
  .header__icons {
    order: 3;
    display: flex !important;
    align-items: center !important;
    gap: 14px !important;
  }
  .header__icons svg {
    width: 24px !important;
    height: 24px !important;
  }

  /* QUITAR ESPACIADOS VIEJOS */
  .header-item,
  .header__item {
    margin: 0 !important;
    padding: 0 !important;
  }
}
/* ===============================================
   FIX HEADER MÓVIL — THE CANDLE SHOP — IMPULSE
   (Soluciona menú de escritorio apareciendo en móvil)
================================================ */
@media (max-width: 768px) {

  /* OCULTAR TODO EL HEADER DE ESCRITORIO */
  .header__desktop,
  .header__item--desktop,
  .header__link-text,
  .header__inline-menu {
    display: none !important;
  }

  /* MOSTRAR EL HEADER MÓVIL DEL TEMA */
  .header__mobile,
  .mobile-nav-trigger {
    display: flex !important;
  }

  /* CONTENEDOR PRINCIPAL DEL HEADER */
  .header__wrapper {
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    padding: 14px 18px !important;
    position: relative;
    z-index: 9999;
  }

  /* HAMBURGUESA – IZQUIERDA */
  .mobile-nav-trigger {
    order: 1 !important;
    margin-right: 12px;
  }
  .mobile-nav-trigger svg {
    width: 28px !important;
    height: 28px !important;
    stroke-width: 1.8;
  }

  /* LOGO – CENTRADO BAJITO */
  .header__logo {
    order: 2 !important;
    flex-grow: 1;
    display: flex;
    justify-content: flex-start;
  }

  .header__logo img {
    max-height: 42px !important;
    width: auto !important;
    margin-top: 6px; /* Lo baja un poco */
  }

  /* ICONOS A LA DERECHA */
  .header__icons,
  .header__item--icons {
    order: 3 !important;
    display: flex !important;
    align-items: center !important;
    gap: 14px !important;
  }

  .header__icons svg {
    width: 24px !important;
    height: 24px !important;
  }

  /* QUITAR ESPACIADOS ANTIGUOS */
  .header__item {
    margin: 0 !important;
    padding: 0 !important;
  }
}
/* ===============================================
   AJUSTES FINOS DEL HEADER MÓVIL
   (Hamburguesa izquierda, iconos más pequeños,
    bajar header)
================================================ */
@media (max-width: 768px) {

  /* Bajar ligeramente el header entero */
  .header__wrapper {
      padding-top: 18px !important;
      padding-bottom: 12px !important;
  }

  /* HAMBURGUESA más pegada a la izquierda */
  .mobile-nav-trigger {
      margin-left: -8px !important; /* La pega más al borde */
  }
  .mobile-nav-trigger svg {
      width: 22px !important;
      height: 22px !important;
  }

  /* LOGO un poquito más abajo */
  .header__logo img {
      margin-top: 10px !important;
      max-height: 36px !important; /* tamaño perfecto para móvil */
  }

  /* ICONOS más pequeños */
  .header__icons svg {
      width: 20px !important;
      height: 20px !important;
  }

  /* Acerca más los iconos entre sí pero sin aplastar */
  .header__icons {
      gap: 12px !important;
  }

}
/* ===============================================
   OCULTAR LOS TEXTOS DE LOS ICONOS EN MÓVIL
   (Ingresar, Buscar, Tiendas, Carrito)
================================================ */
@media (max-width: 768px) {

  /* Quitar textos debajo de los iconos */
  .header__item--text,
  .header__link-text,
  .header__item .label,
  .header__item span,
  .header__item small {
      display: none !important;
  }

  /* También oculta el contenedor extra del menú desktop */
  .header__inline-menu {
      display: none !important;
  }

}
/* ===============================================
   FIX DEFINITIVO – THECANDLESHOP (IMPULSE)
   Quitar textos, pegar hamburguesa, alinear header
================================================ */
@media (max-width: 768px) {

  /* Quitar completamente los textos "Ingresar / Buscar / Tiendas / Carrito" */
  .header__item-label,
  .header__item .label,
  .header__item span,
  .header__item small,
  .header__item-text,
  .header__item--text {
      display: none !important;
  }

  /* Quitar grupo de menú de escritorio (el causante del desorden) */
  .header__inline,
  .header__inline-menu,
  .header__desktop,
  .header__item--desktop {
      display: none !important;
  }

  /* FORZAR header móvil */
  .header__mobile {
      display: flex !important;
      width: 100% !important;
  }

  /* Ajustes del contenedor del header */
  .header__wrapper {
      display: flex !important;
      align-items: center !important;
      justify-content: space-between !important;
      padding: 18px 16px !important; /* baja un poco todo */
  }

  /* PEGAR hamburguesa a la izquierda */
  button.mobile-nav-toggle {
      margin-left: -10px !important;
      padding-left: 0 !important;
  }
  button.mobile-nav-toggle svg {
      width: 22px !important;
      height: 22px !important;
  }

  /* LOGO más abajo y tamaño correcto */
  .header__logo img {
      max-height: 34px !important;
      margin-top: 8px !important;
  }

  /* ICONOS más pequeños */
  .header__icons svg {
      width: 20px !important;
      height: 20px !important;
  }

  /* Separación entre íconos */
  .header__icons {
      gap: 10px !important;
  }
}
/* ===============================================
   FIX REAL Y DEFINITIVO PARA THE CANDLE SHOP (IMPULSE)
   Basado en DOM real: .header-item--mobile-nav
================================================ */
@media (max-width: 768px) {

  /* OCULTAR TEXTOS: Ingresar / Buscar / Tiendas / Carrito */
  .header-item .header-item__text,
  .header-item .header__item-label,
  .header-item small,
  .header-item span {
    display: none !important;
  }

  /* OCULTAR menú de escritorio entero */
  .header-item--navigation,
  .medium-up--show,
  .header-layout__desktop,
  .header__inline-menu {
    display: none !important;
  }

  /* MOSTRAR SOLO CONTENEDOR MOBILE */
  .header-layout,
  .header-item--mobile-nav {
    display: flex !important;
  }

  /* === MENU HAMBURGUESA === */
  .header-item--mobile-nav {
    order: 1 !important;
    margin-left: -12px !important; /* PEGA A LA IZQUIERDA */
  }
  .header-item--mobile-nav button svg {
    width: 22px !important;
    height: 22px !important;
  }

  /* === LOGO === */
  .header-item--logo {
    order: 2 !important;
    flex-grow: 1;
  }
  .header-item--logo img {
    max-height: 36px !important;
    margin-top: 8px !important; /* baja logo */
  }

  /* === ICONOS === */
  .header-item--icons {
    order: 3 !important;
    display: flex !important;
    gap: 10px !important;
  }
  .header-item--icons svg {
    width: 20px !important;
    height: 20px !important;
  }

  /* BAJAR TODO EL HEADER LIGERAMENTE */
  .header-layout {
    padding-top: 20px !important;
    padding-bottom: 8px !important;
  }
}
/* ===============================================
   FIX FINAL – THECANDLESHOP (IMPULSE)
   Ocultar textos, afinar iconos, grosor elegante
================================================ */
@media (max-width: 768px) {

  /* 1. OCULTAR TEXTOS DE LOS ICONOS (INGRESAR / BUSCAR / TIENDAS / CARRITO) */
  .site-nav__label,
  .header-item--icons span,
  .header-item--icons .label,
  .header-item--icons small {
      display: none !important;
  }

  /* 2. AJUSTAR TAMAÑO DE ICONOS (un poco más pequeño) */
  .header-item--icons svg,
  .header-item--mobile-nav svg {
      width: 21px !important;
      height: 21px !important;
  }

  /* 3. AUMENTAR GROSOR DE LÍNEA (stroke) SIN PERDER ELEGANCIA */
  .header-item--icons svg *,
  .header-item--mobile-nav svg * {
      stroke-width: 1.7 !important; /* elegante, no tosco */
  }

  /* 4. PEGAR UN POCO MÁS A LA IZQUIERDA LA HAMBURGUESA */
  .header-item--mobile-nav {
      margin-left: -14px !important;
  }

  /* 5. Ajustar grosor de la hamburguesa */
  .header-item--mobile-nav svg * {
      stroke-width: 2 !important;
  }

  /* 6. Ajustar separación general */
  .header-item--icons {
      gap: 12px !important;
  }

  /* 7. Bajar ligeramente el logo */
  .header-item--logo img {
      margin-top: 6px !important;
      max-height: 34px !important;
  }
}
/* ===============================================
   FIX DEFINITIVO DE HEADER MÓVIL – THE CANDLE SHOP
   Basado en DOM real del tema Impulse
================================================ */
@media (max-width: 768px) {

  /* 1. OCULTAR TEXTO DE LOS ICONOS (Carrito, Tiendas, Buscar, Ingresar) */
  span.icon__fallback-text {
      display: none !important;
      opacity: 0 !important;
      visibility: hidden !important;
      height: 0 !important;
      width: 0 !important;
      padding: 0 !important;
      margin: 0 !important;
  }

  /* 2. PEGAR EL LOGO A LA IZQUIERDA (QUITAR EL AUTO-MARGIN) */
  .header-item--logo {
      margin: 0 !important;        /* elimina el centrado */
      justify-content: flex-start !important;
  }

  .header-item--logo img {
      max-height: 32px !important; /* más limpio */
      margin-top: 6px !important;
  }

  /* 3. ACHICAR ICONOS (elegantes y coherentes) */
  .header-item--icons svg,
  .header-item--mobile-nav svg {
      width: 20px !important;
      height: 20px !important;
  }

  /* 4. HACER LOS ICONOS UN POCO MÁS GRUESOS PERO FINOS */
  .header-item--icons svg *,
  .header-item--mobile-nav svg * {
      stroke-width: 1.8 !important;
  }

  /* 5. PEGAR MÁS LA HAMBURGUESA A LA IZQUIERDA */
  .header-item--mobile-nav {
      margin-left: -14px !important;
  }

  /* 6. ACOMODAR TODO EL HEADER */
  .header-layout {
      padding-top: 18px !important;
      padding-bottom: 12px !important;
  }

  .header-item--icons {
      gap: 10px !important;
  }
}
/* ===============================================
   FIX DEFINITIVO – ELIMINAR TEXTO DE ICONOS
   FUNCIONA PARA DOM REAL CON .icon__fallback-text
================================================ */
@media (max-width: 768px) {

  /* 1. Eliminar textos (INGRESAR / BUSCAR / TIENDAS / CARRITO) */
  .icon__fallback-text {
      display: none !important;
      opacity: 0 !important;
      visibility: hidden !important;
      height: 0 !important;
      width: 0 !important;
      overflow: hidden !important;
      position: absolute !important;
      z-index: -1 !important;
  }

  /* 2. Reacomodar contenedor de iconos */
  .header-item--icons {
      display: flex !important;
      align-items: center !important;
      gap: 10px !important;
  }

  /* 3. Achicar iconos ligeramente */
  .header-item--icons svg,
  .header-item--mobile-nav svg {
      width: 20px !important;
      height: 20px !important;
  }

  /* 4. Grosor elegante de iconos */
  .header-item--icons svg * ,
  .header-item--mobile-nav svg * {
      stroke-width: 1.8 !important;
  }

  /* 5. Pegamos el logo a la izquierda */
  .header-item--logo {
      margin-left: 0 !important;
      margin-right: auto !important;
      justify-content: flex-start !important;
  }

  .header-item--logo img {
      max-height: 34px !important;
      margin-top: 6px !important;
  }

  /* 6. Pegamos aún más la hamburguesa al borde */
  .header-item--mobile-nav {
      margin-left: -14px !important;
  }

  /* 7. Ajustamos altura del header */
  .header-layout {
      padding-top: 16px !important;
      padding-bottom: 12px !important;
  }
}
/* ===============================================
   FIX DEFINITIVO — QUITAR TEXTO + AJUSTAR ICONOS
   para THECANDLESHOP (Impulse)
================================================ */
@media (max-width: 768px) {

  /* 1. Eliminar texto debajo de los iconos */
  .site-nav__label {
      display: none !important;
      opacity: 0 !important;
      visibility: hidden !important;
      height: 0 !important;
      width: 0 !important;
      margin: 0 !important;
      padding: 0 !important;
      line-height: 0 !important;
  }

  /* 2. Achicar iconos */
  .site-nav__icons svg,
  .header-item--icons svg {
      width: 20px !important;
      height: 20px !important;
  }

  /* 3. Grosor elegante */
  .site-nav__icons svg *,
  .header-item--mobile-nav svg * {
      stroke-width: 1.8 !important;
  }

  /* 4. Logo pegado totalmente a la izquierda */
  .header-item--logo {
      margin-left: 0 !important;
      justify-content: flex-start !important;
  }

  .header-item--logo img {
      max-height: 32px !important;
      margin-top: 5px !important;
  }

  /* 5. Hamburguesa más pegada a la izquierda */
  .header-item--mobile-nav {
      margin-left: -14px !important;
  }

  .header-item--mobile-nav svg {
      width: 22px !important;
      height: 22px !important;
  }

  /* 6. Alinear correctamente la sección de iconos a la derecha */
  .header-item--icons .site-nav__icons {
      display: flex !important;
      justify-content: flex-end !important;
      align-items: center !important;
      gap: 10px !important;
  }
}
/* =======================================================
   FIX REAL DEFINITIVO — ALINEAR LOGO E ICONOS EN MÓVIL
   thecandleshop.com.pe — Tema Impulse
========================================================= */
@media (max-width: 768px) {

  /* --- 1. REORGANIZAR TODO EL HEADER MÓVIL --- */

  /* Convertimos el contenedor principal en un flex normal */
  .header-layout,
  .header-layout__left-center {
      display: flex !important;
      align-items: center !important;
      justify-content: space-between !important;
      width: 100% !important;
  }

  /* Quitamos centrado forzado */
  .header-layout--left-center {
      justify-content: flex-start !important;
  }

  /* --- 2. HAMBURGUESA PEGADA A LA IZQUIERDA --- */
  .header-item--mobile-nav {
      order: 1 !important;
      margin-left: -10px !important;
      margin-right: 8px !important;
  }

  /* --- 3. LOGO REALMENTE PEGADO A LA IZQUIERDA --- */
  .header-item--logo {
      order: 2 !important;
      margin: 0 !important;
      padding: 0 !important;
      display: flex !important;
      justify-content: flex-start !important;
      flex-grow: 1 !important; /* esto lo empuja hacia la izquierda */
  }

  .header-item--logo img {
      max-height: 32px !important;
      margin-left: 0 !important;
  }

  /* --- 4. ÍCONOS A LA DERECHA, MÁS JUNTITOS --- */
  .header-item--icons {
      order: 3 !important;
      display: flex !important;
      align-items: center !important;
      gap: 10px !important; /* reduce distancia entre iconos */
      margin-right: 8px !important;
  }

  .header-item--icons svg {
      width: 18px !important;
      height: 18px !important;
  }

  .header-item--icons svg * {
      stroke-width: 1.8 !important;
  }

  /* --- 5. ELIMINAR CUALQUIER TEXTO POR SI ACASO --- */
  .site-nav__label,
  .icon__fallback-text {
      display: none !important;
      visibility: hidden !important;
      opacity: 0 !important;
  }
}
/* ===============================================================
   FIX DEFINITIVO – HEADER MÓVIL THECANDLESHOP (IMPULSE)
   Basado en DOM real de tu captura
================================================================ */
@media (max-width: 768px) {

  /* 1) RECONFIGURAR CONTENEDOR PRINCIPAL DEL HEADER */
  .header-layout,
  .header-layout--left-center {
      display: flex !important;
      flex-direction: row !important;
      align-items: center !important;
      justify-content: space-between !important; /* rompe el centrado */
      width: 100% !important;
  }

  /* 2) MENU HAMBURGUESA PEGADO A LA IZQUIERDA */
  .header-item--mobile-nav {
      order: 1 !important;
      margin-left: -12px !important;
      margin-right: 8px !important;
  }

  .header-item--mobile-nav svg {
      width: 22px !important;
      height: 22px !important;
      stroke-width: 1.8 !important;
  }

  /* 3) LOGO REALMENTE A LA IZQUIERDA */
  .header-item--logo {
      order: 2 !important;
      margin: 0 !important;
      padding: 0 !important;
      display: flex !important;
      justify-content: flex-start !important;
      flex-grow: 1 !important;  /* IMPULSA EL LOGO A LA IZQUIERDA */
  }

  .header-item--logo img {
      max-height: 32px !important;
      margin-left: 0 !important;
  }

  /* 4) ICONOS A LA DERECHA PERO MÁS CERCA ENTRE SÍ */
  .header-item--icons {
      order: 3 !important;
      display: flex !important;
      align-items: center !important;
      justify-content: flex-end !important;
  }

  /* Sobrescribir el gap de 35px del tema */
  .header-item--icons .site-nav__icons {
      display: flex !important;
      gap: 10px !important;     /* ANTES: 35px */
      margin-right: 8px !important;
  }

  /* 5) ICONOS MÁS PEQUEÑOS Y MÁS ELEGANTES */
  .header-item--icons svg {
      width: 18px !important;
      height: 18px !important;
  }

  .header-item--icons svg * {
      stroke-width: 1.8 !important;
  }

  /* 6) OCULTAR CUALQUIER TEXTO SOBRANTE */
  .site-nav__label,
  .icon__fallback-text,
   {
      display: none !important;
      opacity: 0 !important;
      visibility: hidden !important;
      height: 0 !important;
      width: 0 !important;
  }
}
/* ================================================================
   FIX DEFINITIVO — THE CANDLE SHOP — Impulse Theme
   (Mover logo a la izquierda + iconos más hacia la izquierda)
================================================================ */
@media (max-width: 768px) {

  /* 1 — ELIMINAR el ancho fijo y centrado del LOGO */
  .header-layout--left-center .header-item--logo {
      flex: initial !important;     /* elimina flex: 0 0 200px */
      max-width: none !important;   /* elimina max-width: 50% */
      width: auto !important;
      margin-left: 0 !important;
      margin-right: auto !important; /* ESTO lo empuja a la izquierda */
  }

  /* asegurar posicionamiento interno */
  .header-item--logo {
      display: flex !important;
      justify-content: flex-start !important;
      padding-left: 0 !important;
  }

  .header-item--logo img {
      margin-left: 0 !important;
      transform: translateX(-10px); /* opcional: lo pega más al borde */
  }

  /* 2 — ICONOS A LA IZQUIERDA y más juntitos */
  .header-item--icons .site-nav__icons {
      justify-content: flex-start !important;  /* ANTES: flex-end */
      gap: 10px !important;                    /* ANTES: 35px */
      margin-left: 10px !important;
  }

  /* iconos más pequeños */
  .header-item--icons svg {
      width: 18px !important;
      height: 18px !important;
  }

  /* 3 — HAMBURGUESA PEGADA A LA IZQUIERDA */
  .header-item--mobile-nav {
      margin-left: -10px !important;
  }

  /* 4 — ELIMINAR CUALQUIER TEXTO */
  .site-nav__label,
  .icon__fallback-text {
      display: none !important;
      visibility: hidden !important;
      opacity: 0 !important;
      height: 0 !important;
      width: 0 !important;
  }
}
/* ==========================================================
   FIX ULTRA-ESPECÍFICO — IMPULSE MOBILE HEADER
========================================================== */
@media (max-width: 768px) {

  /* 1) LOGO TAMAÑO NORMAL + A LA IZQUIERDA */
  #HeaderWrapper .header-layout--left-center .header-item--logo {
      flex: unset !important;
      max-width: unset !important;
      width: auto !important;
      margin-left: 0 !important;
      margin-right: auto !important;
      transform: none !important;
  }

  #HeaderWrapper .header-item--logo img {
      max-height: 45px !important;
      width: auto !important;
  }


  /* 2) ICONOS MÁS A LA IZQUIERDA + JUNTOS */
  #HeaderWrapper .header-item--icons .site-nav__icons {
      display: flex !important;
      justify-content: flex-start !important; /* ANTES: flex-end */
      gap: 10px !important;                    /* ANTES: 35px */
      margin-left: 10px !important;
  }

  /* Tamaño iconos */
  #HeaderWrapper .header-item--icons svg {
      width: 22px !important;
      height: 22px !important;
  }

  /* 3) HAMBURGUESA PEGADA A LA IZQUIERDA */
  #HeaderWrapper .header-item--mobile-nav {
      margin-left: -10px !important;
  }

  /* 4) QUITAR TEXTOS */
  #HeaderWrapper .site-nav__label,
  #HeaderWrapper .icon__fallback-text {
      display: none !important;
  }
}
/* =====================================================
   FIX FINAL — Impulse Mobile Header
   Logo normal + iconos visibles + carrito restaurado
===================================================== */
@media (max-width: 768px) {

  /* 1) Restaurar tamaño del logo */
  #HeaderWrapper .header-item--logo img {
      max-height: 50px !important;   /* tamaño correcto */
      width: auto !important;
  }

  /* Eliminar el ancho fijo del contenedor del logo */
  #HeaderWrapper .header-layout--left-center .header-item--logo {
      flex: none !important;
      max-width: none !important;
      width: auto !important;
  }

  /* 2) Restaurar el contenedor de iconos (está cortado) */
  #HeaderWrapper .site-nav.header-icons-mobile {
      width: auto !important;
      min-width: fit-content !important;
      overflow: visible !important;
      display: flex !important;
      align-items: center !important;
      justify-content: flex-end !important;
  }

  /* 3) Restaurar el icono del carrito */
  #HeaderWrapper .header-item--icons .site-nav__icons a {
      display: flex !important;
      visibility: visible !important;
      opacity: 1 !important;
  }

  #HeaderWrapper .header-item--icons svg {
      width: 22px !important;
      height: 22px !important;
      stroke-width: 1.8 !important;
  }

  /* 4) Separación correcta entre iconos */
  #HeaderWrapper .header-item--icons .site-nav__icons {
      gap: 12px !important;
      margin-right: 10px !important;
  }

  /* 5) Quitar textos debajo de los iconos */
  #HeaderWrapper .site-nav__label,
  #HeaderWrapper .icon__fallback-text {
      display: none !important;
  }
}
/* ==========================================================
   FIX FINAL — Logo más grande + carrito visible
========================================================== */
@media (max-width: 768px) {

  /* 1) LOGO NORMAL (romper altura forzada del tema) */
  #HeaderWrapper .header-item--logo img {
      max-height: 55px !important;   /* ajusta aquí el tamaño que quieras */
      height: auto !important;
      width: auto !important;
  }

  /* eliminar restricciones internas del contenedor */
  #HeaderWrapper .header-layout--left-center .header-item--logo {
      flex: unset !important;
      width: auto !important;
      max-width: none !important;
  }


  /* 2) RESTAURAR ICONO DEL CARRITO */
  #HeaderWrapper .header-item--icons {
      margin-right: 0 !important;
  }

  #HeaderWrapper .header-item--icons .site-nav {
      margin-right: 0 !important;   /* elimina los márgenes negativos que lo sacan de la vista */
  }

  #HeaderWrapper .site-nav.header-icons-mobile {
      width: auto !important;
      overflow: visible !important;
      display: flex !important;
      align-items: center !important;
      justify-content: flex-end !important;
  }

  /* Asegurar que cada icono sea visible */
  #HeaderWrapper .site-nav__icons a {
      display: flex !important;
      visibility: visible !important;
      opacity: 1 !important;
  }
}
/* FORZAR que el ícono del carrito y su enlace sean visibles */
@media (max-width: 768px) {

  /* Mostrar cualquier ícono de carrito oculto */
  a[href="/cart"],
  .site-nav__icons a[href="/cart"],
  .js-drawer-open-cart,
  .icon-cart-link,
  .cart-link {
      display: flex !important;
      opacity: 1 !important;
      visibility: visible !important;
      width: auto !important;
      height: auto !important;
  }

  /* Mostrar el SVG del carrito */
  .icon-cart,
  svg.icon-cart,
  .cart-link svg {
      display: block !important;
      width: 22px !important;
      height: 22px !important;
  }

  /* Asegurar que el contenedor lo incluya */
  .site-nav__icons {
      overflow: visible !important;
      display: flex !important;
  }
}
@media (max-width: 768px) {
    .header-item__logo {
        max-width: unset !important;
        flex: 0 0 auto !important;
    }

    .site-header__logo img {
        width: 110px !important; /* Ajusta si quieres más grande */
        height: auto !important;
    }
}
@media (max-width: 768px) {
    .site-nav__icons a {
        display: flex !important;
        align-items: center !important;
        justify-content: center !important;
        margin: 0 6px !important; /* junta los iconos */
    }
}
@media (max-width: 768px) {
    .site-nav__icons {
        justify-content: flex-end !important;   /* a la DERECHA */
        gap: 8px !important;                    /* separación entre iconos */
        margin-left: 0 !important;
        margin-right: 10px !important;          /* pegaditos a la derecha */
    }
}

    

/* ======================================= */
/*  FIX HEADER MOBILE TCS                  */
/* ======================================= */

@media (max-width: 768px) {

    /* --- LOGO más grande --- */
    .site-header__logo img {
        width: 125px !important;
        height: auto !important;
    }

    /* --- Asegurar que el contenedor del logo NO se limite --- */
    .header-item--logo {
        max-width: none !important;
        flex: 0 0 auto !important;
    }

/* --- Contenedor de iconos visible y alineado a la DERECHA --- */
@media (max-width: 768px) {
    .site-nav__icons {
        display: flex !important;
        align-items: center !important;
        justify-content: flex-end !important;   /* derecha */
        gap: 10px !important;
        margin-left: 0 !important;
        margin-right: 10px !important;
    }
}


    /* --- Tamaño y alineación de cada ícono --- */
    .site-nav__icons a,
    .site-nav__link--icon {
        display: flex !important;
        align-items: center !important;
        justify-content: center !important;
        font-size: 22px !important;
        padding: 0 !important;
        margin: 0 4px !important;
    }

    /* --- FORZAR QUE EL CARRITO APAREZCA EN MOBILE --- */
    a.js-drawer-open-cart {
        display: flex !important;
        visibility: visible !important;
        opacity: 1 !important;
    }

    /* --- Insertar carrito dentro del contenedor si está vacío --- */
    .site-nav__icons:empty::after {
        content: attr(data-cart-html);
    }
}
/* === FIX DEFINITIVO: FORZAR VISIBILIDAD DEL CARRITO === */
.site-nav__link--icon,
.site-nav__icons .site-nav__link--icon,
.site-nav__icons a.site-nav__link--icon,
.site-nav__icons .cart-link,
.cart-link,
.cart-link span {
    display: flex !important;
    opacity: 1 !important;
    visibility: visible !important;
}

/* Forzar que el ícono SVG del carrito se vea */
.site-nav__link--icon svg,
.site-nav__icons svg,
.cart-link svg {
    opacity: 1 !important;
    visibility: visible !important;
    display: block !important;
}
/* === CARRITO: FORZAR QUE TODO EL SVG SEA VISIBLE === */
.site-nav__link--icon.cart-link svg,
.site-nav__icons .js-drawer-open-cart-link svg,
.js-drawer-open-cart-link svg,
.cart-link svg,
.cart-link svg * {
    stroke: #ffffff !important;
    fill: #ffffff !important;
    opacity: 1 !important;
    visibility: visible !important;
    display: block !important;
}
/* AJUSTAR TAMAÑO DEL CÍRCULO ROJO DEL CARRITO */
.cart-count-bubble,
.cart-link__bubble {
    transform: scale(0.45) !important; /* Ajusta el tamaño */
    top: -6px !important;              /* Ajusta posición vertical */
    right: -6px !important;            /* Ajusta posición horizontal */
}

/* Ajustar el tamaño del número dentro */
.cart-count-bubble span,
.cart-link__bubble span {
    font-size: 10px !important;
    line-height: 1 !important;
}
/* ALINEAR LOGO PEGADO A LA HAMBURGUESA - MÓVIL */
@media (max-width: 768px) {

  /* Volver a 2 columnas: hamburguesa + logo + iconos */
  .header-layout {
    display: grid !important;
    grid-template-columns: auto auto 1fr !important;
    align-items: center !important;
  }

  /* Hamburguesa a la izquierda */
  .header-item--mobile-nav {
    grid-column: 1 !important;
    justify-self: start !important;
    margin-right: 5px !important;
  }

  /* LOGO junto a la hamburguesa */
  .header-item--logo {
    grid-column: 2 !important;
    justify-self: start !important;
    margin-left: 0 !important;
  }
}
/* ===== HEADER PERFECTO EN MÓVIL ===== */
@media (max-width: 768px) {

  /* Estructura del header: hamburguesa + logo + iconos */
  .header-layout {
      display: grid !important;
      grid-template-columns: auto auto 1fr auto !important;
      align-items: center !important;
      width: 100% !important;
  }

  /* Hamburguesa a la izquierda */
  .header-item--mobile-nav {
      grid-column: 1 !important;
      justify-self: start !important;
      margin-right: 6px !important;
  }

  /* Logo pegado a la hamburguesa */
  .header-item--logo {
      grid-column: 2 !important;
      justify-self: start !important;
      margin-left: 0 !important;
  }

  /* Navegación escondida en móvil */
  .header-item--navigation {
      display: none !important;
  }

  /* Íconos juntos y alineados a la derecha */
  .header-item--icons {
      grid-column: 4 !important;
      justify-self: end !important;
      display: flex !important;
      gap: 12px !important; /* AJUSTA AQUÍ LOS ESPACIOS ENTRE ICONOS */
      margin-right: 10px !important;
  }

  .site-nav__icons {
      display: flex !important;
      gap: 12px !important; /* Puedes bajarlo a 10 si quieres más juntos */
  }
}
/* ===== HEADER PERFECTO EN MÓVIL — CONFIGURACIÓN ESPECÍFICA PARA TU TEMA ===== */
@media (max-width: 768px) {

  /* Forzar layout a 3 columnas: hamburguesa, logo, iconos */
  .header-layout {
    display: grid !important;
    grid-template-columns: auto auto 1fr auto !important;
    align-items: center !important;
    width: 100% !important;
  }

  /* Hamburguesa */
  .header-item--mobile-nav {
    grid-column: 1 !important;
    justify-self: start !important;
    margin-right: 6px !important;
  }

  /* Logo: pegado a la hamburguesa */
  .header-item--logo {
    grid-column: 2 !important;
    justify-self: start !important;
    margin-left: 0 !important;
  }

  /* Ocultar menú desktop en móvil */
  .header-item--navigation.small--hide {
    display: none !important;
  }

  /* Íconos: contenedor principal */
  .header-item--icons {
    grid-column: 4 !important;
    justify-self: end !important;
    display: flex !important;
  }

  /* Íconos internos — TU CAPTURA MUESTRA ESTAS CLASES */
  .site-nav.header-icons-mobile,
  .site-nav__icons {
    display: flex !important;
    justify-content: flex-end !important;
    align-items: center !important;
    gap: 12px !important; /* AJUSTABLE: prueba 10 si quieres más juntos */
  }
}
/* ===== FIX REAL PARA MOVER ÍCONOS A LA DERECHA ===== */
@media (max-width: 768px) {
  #HeaderWrapper .header-item--icons .site-nav__icons {
      display: flex !important;
      justify-content: flex-end !important;  /* mover a la DERECHA */
      align-items: center !important;
      gap: 10px !important;                 /* espacio entre iconos */
      margin-left: 0 !important;            /* cancelar empuje a la izquierda */
      margin-right: 10px !important;        /* pegarlos al borde derecho */
  }
}
/* ===== LOGO PEGADO A LA HAMBURGUESA ===== */
@media (max-width: 768px) {

  #HeaderWrapper .header-item--mobile-nav {
      margin-right: 6px !important;
      justify-self: start !important;
  }

  #HeaderWrapper .header-item--logo {
      justify-self: start !important;
      margin-left: 0 !important;
  }

  /* Reorganizamos el grid SOLO a móvil */
  #HeaderWrapper .header-layout {
      display: grid !important;
      grid-template-columns: auto auto 1fr auto !important;
      align-items: center !important;
      width: 100% !important;
  }
}
/* ===== ÍCONOS TOTALMENTE A LA DERECHA ===== */
@media (max-width: 768px) {

  /* contenedor principal de los iconos en móvil */
  #HeaderWrapper .site-nav.header-icons-mobile {
      display: flex !important;
      justify-content: flex-end !important; /* derecha */
      width: 100% !important; /* ocupar espacio */
  }

  /* el grupo de iconos */
  #HeaderWrapper .site-nav__icons {
      display: flex !important;
      justify-content: flex-end !important; /* derecha */
      margin-left: 0 !important;
      margin-right: 12px !important;
      gap: 12px !important; /* ajustar separación */
      width: auto !important;
  }
}
/* ===== FIX DEFINITIVO: FORZAR ICONOS A LA DERECHA ===== */
@media (max-width: 768px) {

  /* Contenedor principal real */
  .header-item--icons .header-icons-mobile {
      display: flex !important;
      justify-content: flex-end !important;
      width: 100% !important;
  }

  /* Contenedor donde están los iconos */
  .header-icons-mobile .site-nav__icons {
      display: flex !important;
      justify-content: flex-end !important;
      margin-left: 0 !important;
      margin-right: 15px !important;
      gap: 10px !important;
  }
}
.header-icons-mobile .site-nav__icons:not([style]) {
     justify-content: flex-end !important;
}
/* ===== FIX DEFINITIVO ICONOS HEADER ===== */
@media (max-width: 768px) {

  /* contenedor que agrupa los iconos en móvil */
  .header-item--icons .header-icons-mobile {
      display: flex !important;
      justify-content: flex-end !important;
      width: 100% !important;
  }

  /* bloque real donde están los iconos */
  .header-icons-mobile .site-nav__icons {
      display: flex !important;
      justify-content: flex-end !important;
      margin-left: 0 !important;
      margin-right: 15px !important;
      gap: 10px !important;
  }
}
/* ===== FIX FINAL PARA MOVER LOS ICONOS A LA DERECHA ===== */
@media (max-width: 768px) {

  /* Contenedor principal */
  .header-item--icons .header-icons-mobile {
      display: flex !important;
      justify-content: flex-end !important;
      width: 100% !important;
  }

  /* Contenedor donde están los iconos */
  .header-icons-mobile .site-nav__icons {
      display: flex !important;
      justify-content: flex-end !important;
      margin-left: 0 !important;
      margin-right: 15px !important;
      gap: 10px !important;
  }
}
/* ===== FIX DEFINITIVO PARA MOVER LOS ICONOS A LA DERECHA ===== */
@media (max-width: 768px) {

  /* 1. Reorganizar estructura del header */
  .header-layout--left-center {
      display: grid !important;
      grid-template-columns: auto 1fr auto !important;
      align-items: center !important;
      width: 100% !important;
  }

  /* 2. Hamburguesa */
  .header-layout--left-center .header-item--mobile-nav {
      grid-column: 1 !important;
      justify-self: start !important;
  }

  /* 3. Logo */
  .header-layout--left-center .header-item--logo {
      grid-column: 2 !important;
      justify-self: start !important;
  }

  /* 4. Íconos (ESTE es el contenedor REAL que manda) */
  .header-layout--left-center .header-item--icons {
      grid-column: 3 !important;
      justify-self: end !important;
      display: flex !important;
      width: auto !important;
  }

  /* 5. Asegurar que los iconos estén alineados */
  .header-layout--left-center .header-icons-mobile,
  .header-layout--left-center .site-nav__icons {
      display: flex !important;
      justify-content: flex-end !important;
      gap: 10px !important;
      margin-right: 10px !important;
  }
}
@media (max-width: 768px) {
  .header-item--icons .site-nav__icons {
    display: flex !important;
    justify-content: flex-end !important;
    gap: 8px !important; /* junta los iconos */
    width: 100% !important;
  }
}
@media (max-width: 768px) {

    /* Ajustar contenedor de iconos móviles */
    .site-nav.header-icons-mobile {
        display: flex !important;
        justify-content: flex-end !important;
        align-items: center !important;
        width: 100% !important;
    }

    /* Alinear los iconos entre ellos */
    .site-nav__icons {
        display: flex !important;
        flex-direction: row !important;
        gap: 10px !important;   /* ajusta a 8px o 6px si quieres menos */
        margin-right: 10px !important;
    }

    /* Mover el logo más cerca del menú */
    .header-item--logo {
        margin-left: -10px !important; /* puedes ajustar a -15 si necesitas más */
    }
}
@media (max-width: 768px) {
  .site-nav.header-icons-mobile {
    display: flex !important;
    justify-content: flex-end !important;
    align-items: center !important;
    width: 100% !important;
  }

  .site-nav__icons {
    display: flex !important;
    justify-content: flex-end !important;
    align-items: center !important;
    gap: 10px !important; /* espacio entre iconos */
    width: fit-content !important;
    margin-left: auto !important;
    margin-right: 0 !important;
  }

  .header-item--logo {
    margin-left: 0 !important; /* pegado al menú */
    padding-left: 0 !important;
  }
}
.header__heading {
    margin-left: 0 !important;
    padding-left: 0 !important;
}

.header__icon-wrapper--menu {
    margin-right: 8px !important;
}
.header__icons {
    margin-left: auto !important;
    display: flex !important;
    justify-content: flex-end !important;
    gap: 15px !important;
}
.site-header {
    padding-left: 10px !important;
    padding-right: 10px !important;
}
/* --- FIX HEADER IMPULSE - THECANDLESHOP --- */

/* Contenedor principal del header: mantenerlo alineado y empujar íconos a la derecha */
.header__inner {
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    gap: 0 !important;
}

/* Logo alineado totalmente a la izquierda */
.header__heading-link {
    margin-left: 0 !important;
    padding-left: 0 !important;
    display: flex;
    align-items: center;
}

/* Menú hamburguesa pegado al logo */
.header__icon-item--menu {
    margin-right: 8px !important;
}

/* Íconos alineados a la derecha 100% */
.header__icons {
    margin-left: auto !important;
    display: flex !important;
    justify-content: flex-end !important;
    gap: 18px !important;
}

/* Evitar espacios invisibles del tema */
.header__secondary-nav,
.header__action-list {
    margin-left: auto !important;
    padding-left: 0 !important;
}

/* Ajuste para mobile */
@media (max-width: 768px) {
    .header__icons {
        gap: 14px !important;
    }
    .header__heading {
        margin-left: 0 !important;
    }
}
/* ===== FIX PARA EL HEADER TRANSPARENTE DE IMPULSE ===== */

/* Contenedor general del header */
.header-layout {
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    width: 100% !important;
}

/* Columna izquierda: hamburguesa + logo */
.header-layout__left {
    display: flex !important;
    align-items: center !important;
    gap: 10px !important;
}

/* Logo completamente a la izquierda */
.header-logo {
    margin-left: 0 !important;
    padding-left: 0 !important;
}

/* Mover íconos a la derecha */
.header-layout__right,
.header-actions {
    margin-left: auto !important;
    display: flex !important;
    justify-content: flex-end !important;
    gap: 18px !important;
}

/* Asegura que nada empuje los íconos */
.header-actions__item {
    margin: 0 !important;
    padding: 0 !important;
}

/* Mobile */
@media (max-width: 768px) {
    .header-layout {
        padding: 0 10px !important;
    }
    .header-layout__right {
        gap: 14px !important;
    }
}
/* ============================
   SEPARACIÓN REAL DEL HEADER IMPULSE
   ============================ */

/* 1. Forzar el header a tener 3 columnas reales */
.header-layout {
    display: grid !important;
    grid-template-columns: auto 1fr auto !important;
    align-items: center !important;
    width: 100% !important;
}

/* 2. Columna izquierda: hamburguesa + logo */
.header-layout__left {
    display: flex !important;
    align-items: center !important;
    gap: 10px !important; /* separa hamburguesa y logo */
}

/* 3. Columna derecha: íconos independientes */
.header-layout__right,
.header-actions {
    display: flex !important;
    justify-content: flex-end !important;
    align-items: center !important;
    gap: 18px !important; /* separa cada icono */
    margin-left: 0 !important;
}

/* 4. Evitar que el tema meta márgenes automáticos */
.header-actions__item,
.header__item,
.header__icon-wrapper {
    margin: 0 !important;
}

/* 5. Asegurar que nada comprima o empuje */
.header-logo {
    margin: 0 !important;
    padding: 0 !important;
}

/* 6. Mobile */
@media (max-width: 768px) {
    .header-layout {
        grid-template-columns: auto 1fr auto !important;
        padding: 0 12px !important;
    }
}
/* ============================
   FIX DEFINITIVO HEADER IMPULSE (OVERLAY)
   Agrupar logo + menú hamburguesa a la izquierda
   y enviar íconos a la derecha
   ============================ */

/* Forzar estructura de grilla */
.header__wrapper {
    display: grid !important;
    grid-template-columns: auto 1fr auto !important;
    align-items: center !important;
    width: 100% !important;
}

/* Columna izquierda: hamburguesa + logo */
.header__left {
    display: flex !important;
    gap: 12px !important;
    align-items: center !important;
}

/* Mover hamburguesa a la izquierda y unirla al logo */
.header__icon--menu {
    order: -1 !important;
    margin-left: 0 !important;
}

/* Logo pegado al menú */
.header__logo {
    margin: 0 !important;
    padding: 0 !important;
}

/* Columna derecha: íconos */
.header__right,
.header__icon-list {
    display: flex !important;
    justify-content: flex-end !important;
    align-items: center !important;
    gap: 15px !important;
}

/* Evitar que nada empuje la columna derecha */
.header__icon,
.header__icon-item {
    margin: 0 !important;
    padding: 0 !important;
}

/* Mobile */
@media (max-width: 768px) {
    .header__wrapper {
        grid-template-columns: auto 1fr auto !important;
        padding: 0 12px !important;
    }
}
/* =========================================================
   FIX DEFINITIVO PARA IMPULSE (THECANDLESHOP.COM.PE)
   Agrupa menú + logo a la izquierda, íconos a la derecha
   ========================================================= */

/* Forzar 3 columnas reales en el header */
.header-layout--left-center {
    display: grid !important;
    grid-template-columns: auto 1fr auto !important;
    align-items: center !important;
    width: 100% !important;
}

/* Columna izquierda: menú + logo */
.header-item.header-item--logo {
    display: flex !important;
    align-items: center !important;
    gap: 12px !important; 
}

/* Poner el menú hamburguesa ANTES del logo */
.icon-hamburger {
    order: -1 !important;
}

/* Ajuste de logo */
.header-item--logo img,
.header-item--logo svg {
    margin: 0 !important;
    padding: 0 !important;
}

/* Columna derecha: íconos */
.site-nav.header-icons-mobile {
    display: flex !important;
    justify-content: flex-end !important;
    align-items: center !important;
    gap: 16px !important;
    margin: 0 !important;
    padding: 0 !important;
}

/* Evitar márgenes automáticos entre íconos */
.site-nav__icons,
.site-nav__link,
.header-item--icons,
.header-icon-item {
    margin: 0 !important;
    padding: 0 !important;
}

/* MOBILE */
@media (max-width: 768px) {
    .header-layout--left-center {
        grid-template-columns: auto 1fr auto !important;
        padding: 0 12px !important;
    }
}
/* ===============================
   FIX FINAL HEADER IMPULSE
   The Candle Shop - with overlay
   =============================== */

/* Convertimos el header entero en 3 columnas reales */
.header-layout--left-center {
    display: grid !important;
    grid-template-columns: auto 1fr auto !important;
    align-items: center !important;
    width: 100% !important;
    padding: 0 12px !important;
}

/* COLUMNA IZQUIERDA: hamburguesa + logo */
.header-item--navigation,
.header-item--logo {
    display: flex !important;
    align-items: center !important;
}

/* Ordenamos: primero el menú, luego el logo */
.header-item--navigation {
    order: 1 !important;
}
.header-item--logo {
    order: 2 !important;
    margin-left: 10px !important;
}

/* COLUMNA DERECHA: íconos */
.header-item--icons,
.header-icons-mobile {
    display: flex !important;
    justify-content: flex-end !important;
    align-items: center !important;
    gap: 16px !important;
    margin: 0 !important;
    padding: 0 !important;
}

/* Evitar márgenes que mete Impulse */
.header-icons-mobile a,
.header-icons-mobile .site-nav__icons,
.header-item--icons a {
    margin: 0 !important;
    padding: 0 !important;
}

/* MOBILE */
@media (max-width: 768px) {
    .header-layout--left-center {
        grid-template-columns: auto 1fr auto !important;
        padding: 0 10px !important;
    }
}
/* ============================================================
   FIX FINAL PARA HEADER IMPULSE - THE CANDLE SHOP
   Ordenar: [hamburguesa + logo] ------ [iconos]
   ============================================================ */

/* 1. Forzar layout con flex para poder reordenar */
.header-layout--left-center {
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    width: 100% !important;
    padding: 0 12px !important;
}

/* 2. ORDEN CORRECTO DE LOS ELEMENTOS */
.header-item--navigation { order: 1 !important; }   /* Hamburguesa */
.header-item--logo { order: 2 !important; }         /* Logo */
.header-item--icons { order: 3 !important; }        /* Íconos */

/* 3. Agrupar menú + logo a la izquierda */
.header-item--navigation,
.header-item--logo {
    display: flex !important;
    align-items: center !important;
}

.header-item--navigation {
    margin-right: 10px !important; /* separación entre menú y logo */
}

/* 4. Alinear íconos a la derecha */
.header-item--icons,
.header-icons-mobile {
    display: flex !important;
    justify-content: flex-end !important;
    align-items: center !important;
    gap: 16px !important;
    margin: 0 !important;
    padding: 0 !important;
}

/* 5. Ajuste móvil */
@media (max-width: 768px) {
    .header-layout--left-center {
        padding: 0 10px !important;
    }
}
@media (max-width: 768px) {

  /* Agrupar hamburguesa + logo hacia la izquierda */
  .header-layout.header-layout--left {
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    width: 100% !important;
  }

  .header-item--mobile-nav,
  .header-item--logo {
    display: flex !important;
    align-items: center !important;
  }

  .header-item--mobile-nav {
    margin-right: 12px !important;
  }

  /* Mover íconos completamente a la derecha */
  .header-item--icons {
    margin-left: auto !important;
    display: flex !important;
    justify-content: flex-end !important;
    align-items: center !important;
  }

  .header-icons-mobile {
    display: flex !important;
    gap: 14px !important;
    align-items: center !important;
  }
}
@media (max-width: 768px) {

  /* Fuerza al header móvil a comportarse como flex y respetar nuestro orden */
  .header-layout.header-layout--left-center {
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    width: 100% !important;
  }

  /* Botón hamburguesa a la izquierda SIEMPRE */
  .header-item--mobile-nav {
    order: 1 !important;
    margin-right: 8px !important;
  }

  /* Logo inmediatamente después */
  .header-item--logo {
    order: 2 !important;
    display: flex !important;
    margin-left: 0 !important;
    padding-left: 0 !important;
  }

  /* Iconos al lado derecho */
  .header-item--icons {
    order: 3 !important;
    margin-left: auto !important;
    display: flex !important;
    justify-content: flex-end !important;
    align-items: center !important;
    gap: 12px !important;
  }

  /* Evita que Impulse los apile */
  .site-nav__icons {
    display: flex !important;
    gap: 12px !important;
  }
}
@media (max-width: 768px) {

  /* Fuerza al header móvil a comportarse como flex */
  .header-layout.header-layout--left-center {
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    width: 100% !important;
  }

  /* Botón hamburguesa a la izquierda */
  .header-item--mobile-nav {
    order: 1 !important;
    margin-right: 8px !important;
  }

  /* Logo al lado del menú */
  .header-item--logo {
    order: 2 !important;
    display: flex !important;
    margin-left: 0 !important;
    padding-left: 0 !important;
    align-items: center !important;
  }

  /* Iconos a la derecha */
  .header-item--icons {
    order: 3 !important;
    margin-left: auto !important;
    display: flex !important;
    justify-content: flex-end !important;
    align-items: center !important;
    gap: 12px !important;
  }

  /* Contenedor interno de iconos */
  .site-nav__icons {
    display: flex !important;
    align-items: center !important;
    gap: 12px !important;
  }
}
@media (max-width: 768px) {

  /* Forzar el contenedor del header a organizarse bien */
  .header-wrapper .header-layout {
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    width: 100% !important;
  }

  /* Botón menú móvil SIEMPRE a la izquierda */
  .header-item--mobile-nav {
    order: 1 !important;
    margin-right: 8px !important;
  }

  /* Logo inmediatamente después del menú */
  .header-item--logo {
    order: 2 !important;
    margin-left: 0 !important;
    padding-left: 0 !important;
    display: flex !important;
    align-items: center !important;
  }

  /* Iconos a la derecha */
  .header-item--icons,
  .site-nav__icons {
    order: 3 !important;
    margin-left: auto !important;
    display: flex !important;
    align-items: center !important;
    justify-content: flex-end !important;
    gap: 12px !important;
  }

}
/* FIX: mover logo a la izquierda en móvil */
@media (max-width: 768px) {
  #HeaderWrapper .header-item--logo {
    order: 0 !important;
    justify-self: flex-start !important;
    margin-left: 0 !important;
    margin-right: auto !important;
  }

  #HeaderWrapper .header-item--icons {
    order: 2 !important;
    margin-left: auto !important;
  }

  #HeaderWrapper .header-item--mobile-nav {
    order: 1 !important;
    margin-right: 10px !important;
  }
}
@media (max-width: 768px) {
  .header-item--logo {
    order: 0 !important;
    margin-left: 0 !important;
    margin-right: auto !important;
    transform: none !important;
  }

  .site-header__logo-link {
    transform: none !important;
  }
}
@media (max-width: 768px) {

  /* LOGO A LA IZQUIERDA EN LA MISMA FILA */
  .header-layout--left-center .header-item--logo {
    grid-column: 1 !important;   /* columna izquierda */
    grid-row: 1 !important;       /* misma fila que el menú */
    justify-self: start !important;
    margin-left: 0 !important;
    margin-right: auto !important;
    transform: none !important;
  }

  /* Asegurar que los íconos sigan en la derecha */
  .header-item--icons {
    grid-column: 3 !important;
    grid-row: 1 !important;
    justify-self: end !important;
  }

  /* Evitar que el tema mueva el logo 10px a la derecha */
  .site-header__logo-link {
    transform: none !important;
  }
}
@media (max-width: 768px) {
  .header-layout--left-center .header-item--logo {
    margin-top: 18px !important;
  }
}
@media screen and (max-width: 749px) {
  .site-header__logo, 
  .site-header__logo-link, 
  .header-item--logo {
    transform: translate(10px, 18px) !important;
  }
}
@media screen and (max-width: 749px) {
  .site-header__logo, 
  .site-header__logo-link, 
  .header-item--logo {
    transform: translate(10px, 28px) !important;
  }
}
@media screen and (max-width: 749px) {
  .header-item--icons {
    transform: translateY(25px) !important;
    margin-right: 8px !important; 
  }

  .site-header__logo,
  .header-item--logo {
    transform: none !important;
  }

  .site-header__mobile-nav,
  .header-item--mobile {
    transform: none !important;
  }
}
@media screen and (max-width: 749px) {
  /* Baja solo el logo */
  .header-item--logo {
    transform: translateY(12px) !important;
  }

  /* Baja los íconos de la derecha */
  .header-item--icons {
    transform: translateY(12px) !important;
  }

  /* Mantiene el menú en su sitio */
  .header-item--mobile {
    transform: none !important;
  }
}
@media screen and (max-width: 749px) {

  /* BAJAR LOGO */
  .site-header__logo,
  .header-item--logo {
    margin-top: 12px !important;
  }

  /* BAJAR ÍCONOS DE LA DERECHA */
  .header-item--icons {
    margin-top: 12px !important;
  }

  /* NO mover menú */
  .header-item--mobile {
    margin-top: 0 !important;
  }
}
@media screen and (max-width: 749px) {

  /* Baja logo */
  .header-layout--left-center .header-item--logo {
    margin-top: 18px !important;
  }

  /* Baja los iconos */
  .header-layout--left-center .header-item--icons {
    margin-top: 18px !important;
  }

  /* Menú intacto */
  .header-item--mobile {
    margin-top: 0 !important;
  }
}
@media screen and (max-width: 749px){
  /* Baja logo */
  .header-item--logo {
    position: relative !important;
    top: 18px !important;
  }

  /* Baja iconos a la misma altura */
  .header-item--icons {
    position: relative !important;
    top: 18px !important;
  }
}
@media screen and (max-width: 749px){

  /* SUBE TODO EL HEADER COMPLETO */
  #SiteHeader {
    position: relative !important;
    top: -12px !important;
  }

  /* Ajusta el logo para que no suba demasiado */
  .header-item--logo {
    position: relative !important;
    top: 6px !important;
  }

  /* Ajusta iconos para que queden alineados */
  .header-item--icons {
    position: relative !important;
    top: 6px !important;
  }
}
@media screen and (max-width: 749px){

  /* SUBIR SOLO EL MENÚ (icono hamburguesa) */
  .header-item--mobile-nav {
    position: relative !important;
    top: -4px !important;   /* súbelo un pelín */
  }

  /* SUBIR UN POQUITO MÁS EL LOGO */
  .header-item--logo {
    position: relative !important;
    top: -3px !important;  /* subir 3px */
  }

  /* ICONOS (user, search, location, carrito) – mantener alineados */
  .header-item--icons {
    position: relative !important;
    top: 6px !important;
  }
}
@media screen and (max-width: 749px){

  /* Subir solo el menú (hamburguesa) */
  .header-item--mobile-nav {
    position: relative !important;
    top: -10px !important;   /* súbelo más */
  }

}
@media screen and (max-width: 749px){

  /* Subir solo el menú (hamburguesa) */
  .header-item--mobile-nav {
    position: relative !important;
    top: -22px !important;   /* súbelo bastante más */
  }

}
@media screen and (max-width: 749px){

  .header-item--mobile-nav {
    position: relative !important;
    top: -28px !important;   /* antes -22px — ahora un poco más arriba */
  }

}
@media screen and (max-width: 749px){

  .header-item--mobile-nav {
    position: relative !important;
    top: -31px !important;   /* antes -28px — ahora sube 2px */
  }

}
@media screen and (max-width: 749px){

  .header-item--icons {
    position: relative !important;
    left: 6px !important;   /* mueve los iconos a la derecha */
  }

}
@media screen and (max-width: 749px){

  .header-item--icons {
    position: relative !important;
    left: 24px !important;   /* ahora se mueven un poquito más */
  }

}
/* Ajuste fino de altura del header en desktop */
@media screen and (min-width: 1025px) {
  .header {
    padding-top: 4px !important;
  }
  .header__left,
  .header__logo,
  .header__menu {
    margin-top: 4px !important;
  }
}
/* Ajuste SOLO para desktop — baja logo y menú sin mover los iconos */
@media screen and (min-width: 1025px) {
  .header__left,
  .header__logo,
  .header__menu {
    margin-top: 10px !important; /* ajusta este número si quieres más o menos */
  }
}
/* BAJAR SOLO LOGO + MENÚ EN DESKTOP */
@media screen and (min-width: 1025px) {

  /* Baja todo el bloque izquierdo (logo + menú hamburguesa si existe) */
  .header__left,
  .header__brand,
  .header__logo {
    padding-top: 12px !important;
  }

  /* Baja el menú principal (Packs – Fragancias – etc.) */
  .header__menu,
  .header__inline-menu,
  nav.header__inline-menu {
    padding-top: 12px !important;
  }
}
/* BAJAR SOLO LOGO Y MENÚ EN DESKTOP - AJUSTE FINO */
@media screen and (min-width: 1025px) {

  /* Baja todo el header ligeramente */
  .header-wrapper {
    padding-top: 10px !important;
  }

  /* Baja el bloque contenedor del logo */
  .header-layout--left-center .header-item--logo {
    transform: translateY(10px) !important;
  }

  /* Baja el menú (Packs, Fragancias, etc.) */
  .header-item--navigation {
    transform: translateY(10px) !important;
  }
}
/* ↓ Solo desktop (desde 768px) */
@media screen and (min-width: 768px) {
  .site-header.site-header--heading-style {
    padding-top: 12px !important;   /* Ajusta: 10–18px según se necesite */
  }
}
/* SOLO mover el LOGO en desktop */
@media screen and (min-width: 768px) {
  .header-item--logo img {
    transform: translateY(10px) !important;
    display: block;
  }
}
/* MOVER SOLO EL CONTENEDOR DEL LOGO - DESKTOP */
@media screen and (min-width: 768px) {
  .header-item--logo {
    transform: translateY(12px) !important;
    position: relative !important;
    z-index: 500 !important;
  }
}
/* MOVER EL HEADER COMPLETO SOLO EN DESKTOP */
@media screen and (min-width: 768px) {
  #HeaderWrapper.header-wrapper.header-wrapper--sticky.is-light {
    transform: translateY(12px) !important;
    position: relative !important;
    z-index: 9999 !important;
  }
}
@media (min-width: 1024px) {
  .header-layout.header-layout--left-center {
    align-items: flex-start !important;
    padding-top: 8px !important; /* Ajusta 0–15px según prefieras */
  }
}
@media (min-width: 1024px) {
  .header-layout.header-layout--left-center {
    align-items: flex-start !important;
    padding-top: 8px !important;
  }
}
@media (min-width: 1024px) {
  #HeaderWrapper.header-wrapper {
    padding-top: 10px !important;
    height: auto !important; /* libera la altura fija */
  }
}
@media (min-width: 1024px) {
  header#siteHeader div.header-layout.header-layout--left-center {
    margin-top: 12px !important;
  }
}
@media (min-width: 1024px) {
  .site-header__logo {
    margin-top: 10px !important;
    display: block !important;
  }
}
@media (min-width: 1024px) {
  #HeaderWrapper.header-wrapper {
    padding-top: 10px !important;
  }
}
@media (min-width: 1024px) {
  #HeaderWrapper.header-wrapper.header-wrapper--sticky.is-light {
    padding-top: 10px !important;
  }
}
@media (min-width: 1024px) {
  #HeaderWrapper {
    transform: translateY(10px) !important;
  }
}
@media (min-width: 769px) {
  .header-wrapper.header-wrapper--sticky.is-light {
    height: 115px !important; /* sube o baja todo el bloque */
  }

  /* Corrige la alineación: baja solo logo y menú, NO los íconos */
  .header-layout--left-center .header-item--logo,
  .header-layout--left-center .header-item--navigation {
    margin-top: 10px !important; /* Puedes ajustar 5px o 15px */
  }
}
@media (min-width: 769px) {

  /* Forzamos al header a permitir altura extra */
  #siteHeader .header-layout--left-center {
    align-items: flex-end !important;
    padding-top: 10px !important; /* mueve TODO hacia abajo */
  }

  /* Y ahora movemos SOLO logo y menú */
  #siteHeader .header-item--logo,
  #siteHeader .header-item--navigation {
    transform: translateY(6px) !important; /* AJUSTE FINO */
  }

  /* No tocar íconos */
  #siteHeader .header-item--icons {
    transform: none !important;
  }
}
@media (min-width: 769px) {
    header#SiteHeader.site-header--heading-style {
        padding-top: 12px !important;
        padding-bottom: 12px !important;
        min-height: 130px !important;  /* Puedes ajustar 130 → 135 o lo que necesites */
    }
}
@media (min-width: 1025px) {
  #SiteHeader.site-header--heading-style {
    padding-bottom: 10px !important; /* bájalo a tu gusto */
    padding-top: 5px !important; /* opcional si quieres ajustar arriba también */
  }
}
@media (min-width: 1025px) {
  #SiteHeader.site-header--heading-style {
    transform: translateY(-10px);
  }
}
@media (min-width: 1025px) {
  #SiteHeader.site-header--heading-style {
    position: relative !important;
    top: -10px !important;  /* súbelo */
  }
}
@media (min-width: 1025px) {
  #headerWrapper.header-wrapper--sticky.is-light {
    position: relative !important;
    top: -10px !important;
  }
}
@media (min-width: 1025px) {
  .header-sticky-wrapper {
    position: relative !important;
    top: -20px !important;
  }
}
@media (min-width: 1025px) {
  #SiteHeader.site-header--heading-style {
    transform: translateY(10px) !important; /* baja */
  }
}
/* BAJAR SOLO EL HEADER PRINCIPAL - DESKTOP */
@media (min-width: 769px) {
  header#SiteHeader {
    position: relative !important;
    top: 10px !important;  /* ← Ajusta aquí: sube o baja */
  }
}
@media (min-width: 1025px) {
  header#SiteHeader .page-width {
    position: relative !important;
    top: 12px !important;  /* baja todo */
  }
}
@media (min-width: 1025px) {
  #shopify-section-header {
    position: relative !important;
    top:  12px !important;  /* mueve TODO el header */
  }
}
/* SOLO DESKTOP */
@media screen and (min-width: 1025px) {

    /* Ajusta la posición del logo */
    .site-header__logo,
    .header__logo {
        margin-top: 12px !important;   /* Ajusta este valor según necesites */
    }

    /* Ajusta la posición del menú */
    .site-nav,
    .header__inline-menu {
        margin-top: 12px !important;   /* Usa el mismo valor que el logo */
    }

    /* Alineación vertical general del header */
    .header-layout,
    .site-header__wrapper {
        align-items: center !important;
    }
}
/* SOLO DESKTOP */
@media screen and (min-width: 1025px) {

    /* Fuerza la alineación vertical del grid principal del header */
    .header-layout.header-layout--left-center {
        align-items: center !important;
    }

    /* Baja el logo */
    .header-item.header-item--logo {
        margin-top: 12px !important;  /* AJUSTA ESTE VALOR */
    }

    /* Baja el menú */
    .header__menu,
    .header-item--nav {
        margin-top: 12px !important;  /* MISMO VALOR QUE EL LOGO */
    }
}

/* SOLO EN DESKTOP */
@media screen and (min-width: 1025px) {

    /* Centra verticalmente TODO el header */
    .header-layout.header-layout--left-center {
        align-items: center !important;
    }

    /* Corrige el item del logo, que está alineado arriba */
    .header-item--logo {
        align-items: center !important;
        display: flex !important;
    }

    /* Corrige el item del menú */
    .header-item--nav,
    .header__menu {
        align-items: center !important;
        display: flex !important;
    }

    /* Ajuste final por si el grid aplica altura fija */
    .site-header.site-header--heading-style {
        display: flex !important;
        align-items: center !important;
    }
}
/* SOLO DESKTOP */
@media screen and (min-width: 1025px) {

    /* Fuerza la alineación vertical del grid que contiene logo y menú */
    header.site-header .header-layout.header-layout--left-center {
        align-items: center !important;
    }

    /* Fuerza que las celdas del grid centren su contenido */
    header.site-header .header-layout.header-layout--left-center .header-item {
        display: flex !important;
        align-items: center !important;
    }

    /* Centrar logo */
    header.site-header .header-item--logo {
        align-items: center !important;
    }

    /* Centrar menú */
    header.site-header .header-item--nav,
    header.site-header .header__menu {
        align-items: center !important;
    }
}
/* SOLO DESKTOP */
@media screen and (min-width: 1025px) {

    /* Eliminar padding que desconfigura el logo */
    .site-header__logo {
        padding-top: 0 !important;
        padding-bottom: 0 !important;
    }

    /* Eliminar padding del contenedor del logo */
    .header-item--logo {
        padding-top: 0 !important;
        padding-bottom: 0 !important;
    }

    /* Alinear verticalmente el header */
    .header-layout.header-layout--left-center {
        align-items: center !
/* SOLO EN DESKTOP */
@media screen and (min-width: 1025px) {

    /* CENTRAR verticalmente el grid del header */
    .site-header .header-layout.header-layout--left-center {
        align-items: center !important;
        height: 70px !important; /* ayuda a normalizar la altura */
    }

    /* Asegurar que cada celda del grid se centre */
    .site-header .header-layout.header-layout--left-center .header-item {
        align-self: center !important;
    }
}
/* SOLO DESKTOP */
@media screen and (min-width: 1025px) {

    /* Forzar que el header use FLEX y no GRID */
    .header-layout.header-layout--left-center {
        display: flex !important;
        align-items: center !important;
        justify-content: space-between !important;
        height: 70px !important;
    }

    /* Cada item del header centrado verticalmente */
    .header-layout.header-layout--left-center .header-item {
        display: flex !important;
        align-items: center !important;
        height: 70px !important;
    }

    /* Asegurar alineación perfecta del LOGO */
    .header-item--logo {
        display: flex !important;
        align-items: center !important;
    }

    /* Asegurar alineación perfecta del MENÚ */
    .header-item--navigation {
        display: flex !important;
        align-items: center !important;
    }
}
/* SOLO DESKTOP */
@media screen and (min-width: 1025px) {

    /* Quitar el align-items inline usando un selector superior */
    .header-layout.header-layout--left-center:not(*) {
        align-items: center !important;
    }

    /* Forzar que cada item se comporte como flex centrado */
    .header-layout.header-layout--left-center .header-item {
        display: flex !important;
        align-items: center !important;
    }
}
/* SOLO DESKTOP */
@media screen and (min-width: 1025px) {

    /* Anula el display:grid !important que viene de enova.css */
    .header-layout.header-layout--left-center {
        display: flex !important;
        flex-direction: row !important;
        align-items: center !important;
        justify-content: space-between !important;
    }

    /* Asegurar que los hijos se alineen al centro */
    .header-layout.header-layout--left-center .header-item {
        align-self: center !important;
        display: flex !important;
        align-items: center !important;
    }
}
/* SOLO DESKTOP */
@media screen and (min-width: 1025px) {

    /* Quitar el padding superior que deforma el header */
    .site-header.site-header--heading-style {
        padding-top: 0 !important;
        padding-bottom: 0 !important;
        height: 70px !important;
        display: flex !important;
        align-items: center !important;
    }

    /* Alinear el layout dentro */
    .site-header.site-header--heading-style .header-layout.header-layout--left-center {
        align-items: center !im
/* SOLO DESKTOP */
@media screen and (min-width: 1025px) {

    /* Quitar padding alto del header principal */
    header.site-header.site-header--heading-style {
        padding-top: 0 !important;
        padding-bottom: 0 !important;
        height: 70px !important; /* misma altura interna que vimos en tus items */
        display: flex !important;
        align-items: center !important;
    }

    /* Alinear el layout dentro */
    header.site-header.site-header--heading-style .header-layout {
        align-items: center !important;
    }
}
/* SOLO DESKTOP */
@media screen and (min-width: 1025px) {
    
    /* Forzar altura real del header wrapper */
    #HeaderWrapper.header-wrapper {
        height: 70px !important;
        min-height: 70px !important;
        max-height: 70px !important;
        padding: 0 !important;
        display: flex !important;
        align-items: center !important;
    }

    /* Forzar que el header interior llene la altura */
    #HeaderWrapper.header-wrapper header.site-header {
        height: 70px !important;
        display: flex !important;
        align-items: center !important;
    }

    /* Forzar alineación interna */
    #HeaderWrapper .header-layout.header-layout--left-center {
        height: 70px !important;
        display: flex !important;
        align-items: center !important;
    }
}
/* SOLO DESKTOP */
@media screen and (min-width: 1025px) {

    :root {
        --typeHeaderSpacing: 0rem !important;
        --typeHeaderLineHeight: 1 !important;
    }

    #HeaderWrapper.header-wrapper {
        height: auto !important;
        min-height: 70px !important;
        display: flex !important;
        align-items: center !important;
    }

    header.site-header.site-header--heading-style {
        height: 70px !important;
        display: flex !important;
        align-items: center !important;
        padding: 0 !important;
    }
}
/* SOLO DESKTOP */
@media screen and (min-width: 1025px) {

    /* Quitar padding que deforma el header sticky */
    .header-sticky-wrapper {
        padding-top: 0 !important;
        padding-bottom: 0 !important;
        height: auto !important;
    }

    /* Alinear todo dentro del sticky */
    .header-sticky-wrapper .header-layout {
        display: flex !important;
        align-items: center !important;
    }
/* BAJAR header SOLO en desktop */
@media screen and (min-width: 1025px) {
  .header-layout.header-layout--left-center {
    margin-top: 20px !important;
  }
}

}
@media screen and (min-width: 1025px) {
  .header-item--logo,
  .header-item--navigation {
    margin-top: 20px !important;
  }
}
/* BAJAR SOLO LOGO Y MENU EN DESKTOP - IMPULSE */
@media screen and (min-width: 1025px) {

  .header-item--logo {
    transform: translateY(12px) !important;
  }

  .header-item--navigation {
    transform: translateY(12px) !important;
  }

}
@media screen and (min-width: 1025px) {

  .header-item--logo,
  .header-item--navigation {
    position: relative !important;
    top: 12px !important;
  }

}
/* BAJAR HEADER COMPLETO SOLO EN DESKTOP */
@media (min-width: 769px) {

  /* baja el contenedor completo del header */
  .site-header--heading-style .header-layout {
    padding-top: 20px !important;
  }

}
/* BAJAR TODO EL HEADER EN DESKTOP (IMPULSE) */
@media (min-width: 769px) {
  #HeaderWrapper.header-wrapper {
    padding-top: 25px !important;
  }
}
/* BAJAR HEADER USANDO TRANSFORM - SIEMPRE FUNCIONA */
@media (min-width: 769px) {
  #HeaderWrapper.header-wrapper {
    transform: translateY(20px) !important;
  }
}
/* BAJAR EL HEADER REAL EN DESKTOP (IMPULSE) */
@media (min-width: 769px) {
  .header-sticky-wrapper {
    margin-top: 25px !important;
  }
}
/* VERSION QUE FUNCIONA SIEMPRE */
@media (min-width: 769px) {
  .header-sticky-wrapper {
    transform: translateY(25px) !important;
    position: relative !important;
    z-index: 999;
  }
}
/* BAJAR TODO EL HEADER DESKTOP – FORZADO Y GARANTIZADO */
@media (min-width: 769px) {
  .shopify-section[data-section-type="header"] {
    transform: translateY(25px) !important;
    position: relative !important;
    z-index: 9999 !important;
  }
}
@media (min-width: 769px) {
  body > div:first-child {
    transform: translateY(25px) !important;
    position: relative !important;
  }
}
/* BAJAR EL HEADER REAL EN IMPULSE - DESKTOP SOLAMENTE */
@media (min-width: 769px) {
  #shopify-section-sections--18567592575137__header {
    margin-top: 30px !important;
    display: block !important;
    position: relative !important;
    z-index: 99 !important;
  }
}
@media (min-width: 769px) {
  #shopify-section-sections--18567592575137__header {
    transform: translateY(30px) !important;
    position: relative !important;
    z-index: 99 !important;
  }
}
@media (min-width: 769px) {
  header.site-header {
    transform: translateY(40px) !important;
    position: relative !important;
    z-index: 9999 !important;
  }
}
 /* Mover header sticky hacia abajo */
@media (min-width: 769px) {
  .header-wrapper--sticky.is-light {
    top: 30px !important;
  }
}
@media (min-width: 769px) {
  .header-sticky-wrapper {
    top: 30px !important;
    position: sticky !important;
  }
}
@media (min-width: 769px) {
  header.site-header {
    top: 30px !important;
    position: sticky !important;
  }
}
/* BAJAR EL HEADER PRINCIPAL EN DESKTOP */
@media (min-width: 769px) {
  #SiteHeader.site-header {
    top: 30px !important;
    position: sticky !important;
  }
}
@media (min-width: 769px) {
  .site-header--heading-style {
    top: 30px !important;
    position: sticky !important;
  }
}
@media (min-width: 769px) {
  .header-wrapper--sticky.is-light {
    top: 30px !important;
    position: sticky !important;
  }
}