/** Shopify CDN: Minification failed

Line 71:14 Unexpected "{"
Line 238:0 Unexpected "@media"

**/
@font-face {
    font-family: 'Tropiline';
    src: url('Tropiline-Black.woff2') format('woff2');
    font-weight: 900;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Tropiline';
    src: url('Tropiline-Bold.woff2') format('woff2');
    font-weight: bold;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Tropiline ExtBd';
    src: url('Tropiline-ExtraBold.woff2') format('woff2');
    font-weight: bold;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Tropiline';
    src: url('Tropiline-Light.woff2') format('woff2');
    font-weight: 300;
    font-style: normal;
    font-display: swap;
}


@font-face {
    font-family: 'Tropiline';
    src: url('Tropiline-Regular.woff2') format('woff2');
    font-weight: normal;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Tropiline SemBd';
    src: url('Tropiline-SemiBold.woff2') format('woff2');
    font-weight: 600;
    font-style: normal;
    font-display: swap;
}


*, *::before, *::after {
  font-family: 'Tropiline', sans-serif !important;
}




/* Altura fija de 600px para secciones en desktop, excepto en página de producto */
@media (min-width: 750px) {
  .shopify-section .hero,
  .shopify-section .banner,
  .shopify-section .slideshow,
  .shopify-section .image-with-text,
  .shopify-section .promotion-banner,
  .x-section, {
    max-height: 600px !important;
    margin:3% 3%;
  }
/* Imágenes */
.x-section img {
  width: 100% !important;
  height: 100% !important;
  object-fit: cover !important; /* mantiene proporción sin deformar */
}


}

------------------- icon de las acordeones --------------------------

/* Ocultar el SVG del chevron */
.x-block-nutrition-bar-header span svg,
.accordion button span svg {
  display: none !important;
}

/* + cuando cerrado (rotate-0) */
.x-block-nutrition-bar-header span.rotate-0::after,
.accordion button span.rotate-0::after {
  content: '+';
  font-size: 1.4rem;
  font-weight: 300;
}

/* − cuando abierto (rotate-180) */
.x-block-nutrition-bar-header span.rotate-180::after,
.accordion button span.rotate-180::after {
  content: '−';
  font-size: 1.4rem;
  font-weight: 300;
}

/* Ocultar SVG del primer acordeón (nutrition bar) */
.x-block-nutrition-bar-header > span svg {
  display: none !important;
}

/* + cerrado */
.x-block-nutrition-bar-header > span.rotate-0::after {
  content: '+';
  font-size: 1.4rem;
  font-weight: 300;
}

/* − abierto */
.x-block-nutrition-bar-header > span.rotate-180::after {
  content: '−';
  font-size: 1.4rem;
  font-weight: 300;
}


/* ===== SELECTOR DE IDIOMAS CON BANDERAS ===== */

/* Botón principal - ocultar texto, mostrar bandera */
[aria-controls="LanguageList"] > span:first-child {
  font-size: 0 !important;
  display: inline-block;
  width: 28px;
  height: 20px;
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center;
  vertical-align: middle;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 900 600'%3E%3Crect width='900' height='300' fill='%23FCD116'/%3E%3Crect y='300' width='900' height='150' fill='%23003893'/%3E%3Crect y='450' width='900' height='150' fill='%23CE1126'/%3E%3C/svg%3E");
}

/* Opciones del dropdown - ocultar texto */
#LanguageList .disclosure-list__label {
  font-size: 0 !important;
  display: inline-block;
  width: 28px;
  height: 20px;
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center;
  vertical-align: middle;
}

/* Colombia - Español (primer item) */
#LanguageList li:nth-child(1) .disclosure-list__label {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 900 600'%3E%3Crect width='900' height='300' fill='%23FCD116'/%3E%3Crect y='300' width='900' height='150' fill='%23003893'/%3E%3Crect y='450' width='900' height='150' fill='%23CE1126'/%3E%3C/svg%3E");
}

/* USA - English (segundo item) */
#LanguageList li:nth-child(2) .disclosure-list__label {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1235 650'%3E%3Crect width='1235' height='650' fill='%23fff'/%3E%3Cg fill='%23B22234'%3E%3Crect width='1235' height='50'/%3E%3Crect y='100' width='1235' height='50'/%3E%3Crect y='200' width='1235' height='50'/%3E%3Crect y='300' width='1235' height='50'/%3E%3Crect y='400' width='1235' height='50'/%3E%3Crect y='500' width='1235' height='50'/%3E%3Crect y='600' width='1235' height='50'/%3E%3C/g%3E%3Crect width='494' height='350' fill='%233C3B6E'/%3E%3C/svg%3E");
}

/* ===== SELECTOR DE IDIOMAS EN LÍNEA CON ÍCONOS ===== */
#header-toolbar.moved-to-icons {
  position: static !important;
  display: flex !important;
  align-items: center !important;
  visibility: visible !important;
  opacity: 1 !important;
  width: auto !important;
  padding: 0 !important;
  margin: 0 !important;
  order: 0 !important;
}

#header-toolbar.moved-to-icons .js-hide-toolbar {
  visibility: visible !important;
  opacity: 1 !important;
}

#header-toolbar.moved-to-icons.invisible {
  visibility: visible !important;
  opacity: 1 !important;
}

/* ===== Ajustar tamaño del selector de idiomas ===== */
#header-toolbar-inline {
  max-width: 44px !important;
  max-height: 40px !important;
}

#header-toolbar-inline .toolbar-button {
  padding: 15px 12px !important;
  width: 44px !important;
  height: 40px !important;
}

#header-toolbar-inline [aria-controls="LanguageList"] > span:first-child {
  width: 30px !important;
  height: 26px !important;
}

#header-toolbar-inline .locale-options {
  min-width: 60px !important;
}

/* Quitar la flecha del dropdown para que sea solo bandera */
#header-toolbar-inline [aria-controls="LanguageList"] > span:last-child {
  display: none !important;
}

/* ===== FORZAR BANDERAS EN TODOS LOS SELECTORES ===== */
.disclosure-list__label,
.localization-form-child .toolbar-button > span:first-child,
[aria-controls="LanguageList"] > span:first-child {
  font-size: 0 !important;
  letter-spacing: 0 !important;
  text-indent: -9999px;
  overflow: hidden;
}

[class*="locale-options-mobile-nav"] li {
  padding: 8px 16px !important;
}

[class*="locale-options-mobile-nav"] {
  width: auto !important;
  min-width: 60px !important;
}


-----------------css ajuste del menu -------------------

/* ===== HEADER RESPONSIVE PARA LAPTOPS ===== */
@media (min-width: 1024px) and (max-width: 1439px) {
  /* Forzar todo en una línea */
  header.header {
    display: flex !important;
    flex-wrap: nowrap !important;
    align-items: center !important;
    gap: 2px !important;
  }

  /* Navegación en una línea */
  header [style*="grid-area"] ,
  header .x-container-header-nav,
  header .header__inline-menu {
    flex-wrap: nowrap !important;
    white-space: nowrap !important;
  }

  /* Reducir texto del menú */
  .header__inline-menu a,
  .x-container-header-nav a,
  header .nav-link,
  header .flip-container a {
    font-size: clamp(0.7rem, 1vw, 0.9rem) !important;
    padding-left: 6px !important;
    padding-right: 6px !important;
  }

  /* Reducir logo */
  .w-logo-header {
    width: 90px !important;
    min-width: 90px !important;
  }

  /* Íconos más compactos */
  .x-container-header-icons .w-11 {
    width: 2rem !important;
    padding-left: 6px !important;
    padding-right: 6px !important;
  }

  /* Reducir padding general del header */
  header.header {
    padding-left: 12px !important;
    padding-right: 12px !important;
  }

  /* Page width más ajustado */
  header.x-pgw {
    max-width: 100% !important;
    padding-left: 16px !important;
    padding-right: 16px !important;
  }
}

/* ===== LAPTOPS PEQUEÑOS 1024-1225px ===== */
@media (min-width: 1024px) and (max-width: 1225px) {
  /* Texto del menú más pequeño */
  .header__inline-menu a,
  .x-container-header-nav a,
  header .nav-link,
  header .flip-container a {
    font-size: 0.7rem !important;
    padding-left: 4px !important;
    padding-right: 4px !important;
  }

  /* Logo más pequeño */
  .w-logo-header {
    width: 75px !important;
    min-width: 75px !important;
  }

  /* Íconos aún más compactos */
  .x-container-header-icons .w-11 {
    width: 1.75rem !important;
    padding-left: 4px !important;
    padding-right: 4px !important;
  }

  /* Bandera más pequeña */
  #header-toolbar-inline {
    max-width: 36px !important;
  }

  /* Eliminar gaps */
  header.header {
    gap: 0px !important;
    padding-left: 8px !important;
    padding-right: 8px !important;
  }

  /* Dark mode botón más compacto */
  theme-mode button {
    padding-left: 4px !important;
    padding-right: 4px !important;
  }

  theme-mode {
    margin-left: 8px !important;
  }
}


/* ----- boton flotante whatsapp ------ */
  .boton-flotantewhat {
    position: fixed;
    bottom: 100px;
    right: 20px;
    color: white;
    width: 60px;
    height: 60px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    text-decoration: none;
    font-size: 28px;
    box-shadow: 0 4px 10px rgba(0,0,0,0.3);
    z-index: 9999;
    transition: transform 0.2s ease;
  }
  .boton-flotantewhat:hover {
    transform: scale(1.1);
  }