/* ======================================
   Percarbonato de Sodio – Search Bar Styling
   PrestaShop 8.1.5
   ====================================== */
<div class="header-top-free-shipping">
  🚚 <strong>Envío GRATIS</strong> en compras mayores a $799 MXN
</div>
.header-top-free-shipping {
  background-color: #1E88E5;
  color: #FFFFFF;
  text-align: center;
  font-size: 14px;
  padding: 6px 10px;
  font-weight: 500;
}

@media (max-width: 768px) {
  .header-top-free-shipping {
    font-size: 13px;
    padding: 8px 10px;
  }
}
.header-top-free-shipping{
  background:#1E88E5;
  color:#fff;
  text-align:center;
  font-size:14px;
  padding:6px 10px;
  font-weight:500;
}

@media (max-width:768px){
  .header-top-free-shipping{
    font-size:13px;
    padding:8px 10px;
  }
}
.header-top-free-shipping{
  background:#1E88E5;
  color:#fff;
  text-align:center;
  font-size:13px;
  padding:4px 10px;     /* antes 6-8 */
  font-weight:600;
  letter-spacing:.2px;
}
.header-top-free-shipping{
  background:#1E88E5;
}
.header-top-free-shipping strong{
  background:rgba(255,255,255,.15);
  padding:2px 8px;
  border-radius:999px;
}
.header-cta{
  background:#1E88E5;
  color:#fff;
  padding:10px 14px;
  border-radius:10px;
  font-weight:700;
  display:inline-block;
}
.header-cta:hover{ opacity:.92; }
#search_widget input[type="text"]{
  border-radius:12px;
  padding:12px 14px;
}
.header-contact-info{
  font-size:13px;
  color:#444;
  line-height:20px;
  white-space:nowrap;
}

.header-contact-info a{
  color:#1E88E5;
  font-weight:600;
  text-decoration:none;
}

.header-contact-info a:hover{
  text-decoration:underline;
}

.header-divider{
  margin:0 6px;
  color:#bbb;
}

@media (max-width:768px){
  .header-contact-info{
    white-space:normal;
    text-align:center;
  }
}
/* Top bar: alineación y espacio */
#header .header-nav{
  padding: 6px 0;
}

.header-contact-info{
  display:flex;
  align-items:center;
  gap:10px;
  font-size:13px;
  color:#444;
}

.header-contact-info .header-divider{
  color:#bbb;
  margin:0;
}

@media (max-width:768px){
  .header-contact-info{
    justify-content:center;
    flex-wrap:wrap;
    gap:6px;
  }
}
.header-cta-buy{
  background:#1E88E5;
  color:#fff;
  padding:10px 14px;
  border-radius:10px;
  font-weight:700;
  display:inline-block;
  margin-left:12px;
  text-decoration:none;
  white-space:nowrap;
}

.header-cta-buy:hover{
  opacity:.92;
  color:#fff;
}

@media (max-width:992px){
  .header-cta-buy{
    display:none; /* lo escondemos en tablet/móvil para no romper layout */
  }
}
.header-cta-buy{
  background:#1E88E5;
  color:#fff;
  padding:10px 16px;
  border-radius:12px;
  font-weight:700;
  text-decoration:none;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  margin-left:16px;
  box-shadow:0 4px 10px rgba(30,136,229,.25);
}

.header-cta-buy:hover{
  background:#1976D2;
  color:#fff;
}
.header-top-right{
  display:flex;
  align-items:center;
  gap:12px;
}
#desktop_logo img{
  max-height:60px;
}
#search_widget input[type="text"]{
  border-radius:14px;
  padding:12px 16px;
  font-size:14px;
}
#desktop_logo{
  display:flex;
  align-items:center;
}
.header-cta-buy{
  background:#1E88E5;
}
.header-top-right{
  gap:16px;
}
.header-top-free-shipping strong{
  background:rgba(255,255,255,.12);
}
.hero-percarb{
  margin-top:20px;
}
.hero-percarb__cta{
  display:flex;
  flex-direction:column;
  align-items:flex-start;
  gap:10px;
  margin-top:16px;
}

.hero-percarb__btn{
  background:#1E88E5;
  color:#fff;
  padding:12px 22px;
  border-radius:14px;
  font-weight:800;
  text-decoration:none;
  display:inline-block;
}

.hero-percarb__btn:hover{
  opacity:.92;
  color:#fff;
}

.hero-percarb__link{
  color:#1E88E5;
  font-weight:600;
  text-decoration:none;
}

.hero-percarb__link:hover{
  text-decoration:underline;
}
.hero-percarb__cta-center{
  margin-top:18px;
  text-align:center;
}

.hero-percarb__btn{
  background:#1E88E5;
  color:#fff;
  padding:14px 26px;
  border-radius:16px;
  font-weight:800;
  text-decoration:none;
  display:inline-block;
}

.hero-percarb__btn:hover{
  opacity:.92;
  color:#fff;
}
.hero-percarb__cta-center{
  margin-top:20px;
  text-align:center;
}

.hero-percarb__cta-center a{
  display:inline-block !important;
}

.hero-percarb__btn{
  background:#1E88E5;
  color:#ffffff !important;
  padding:14px 28px;
  border-radius:16px;
  font-weight:800;
  font-size:16px;
  text-decoration:none !important;
  line-height:1;
}

.hero-percarb__btn:hover{
  opacity:.9;
  color:#ffffff !important;
}
/* ===== Limitar tamaño del zoom en desktop ===== */
@media (min-width: 992px){

  /* EasyZoom (muy común en PrestaShop) */
  .easyzoom-flyout,
  .easyzoom--overlay{
    max-width: 75vw !important;   /* antes 100% -> baja a 75% del ancho visible */
    max-height: 75vh !important;  /* antes 100% -> baja a 75% de la altura visible */
    overflow: hidden !important;
  }

  /* ElevateZoom (algunos temas) */
  .zoomWindowContainer .zoomWindow{
    max-width: 75vw !important;
    max-height: 75vh !important;
  }

  /* Lightbox/Modal (si el tema usa fancybox u otro) */
  .fancybox-stage img,
  .modal-dialog img{
    max-width: 90vw !important;
    max-height: 90vh !important;
    object-fit: contain !important;
  }
}
@media (min-width: 992px){
  .easyzoom{
    display: inline-block;
    position: relative;
  }
}
/* Fuerza a que el bloque se vaya debajo del botón */
.product-add-to-cart .cta-trust,
.product-add-to-cart .hero-percarb__note,
.product-add-to-cart .trust-below-cart {
  display: block;
  flex: 0 0 100%;
  width: 100%;
  margin-top: 10px;
}

/* Por si el contenedor del botón está en flex */
.product-add-to-cart .product-quantity,
.product-add-to-cart .add,
.product-add-to-cart .product-actions {
  flex-wrap: wrap;
}
/* 1) El contenedor del botón debe permitir salto de línea */
.product-add-to-cart .product-quantity{
  display: flex;
  flex-wrap: wrap;
  align-items: center;
}

/* 2) Tu "Compra segura" abajo, 100% ancho y centrado */
.product-add-to-cart .cta-trust{
  flex: 0 0 100%;
  width: 100%;
  margin-top: 10px;
  text-align: center;
}

/* 3) Asegura que el corazón se quede arriba en su línea normal */
.product-add-to-cart .wishlist-button-product,
.product-add-to-cart .add-to-cart,
.product-add-to-cart .add{
  flex: 0 0 auto;
}
/* CONTENEDOR: permite 2 filas */
.product-add-to-cart .product-quantity{
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 10px;
}

/* Fila 1: cantidad + botón (se quedan arriba) */
.product-add-to-cart .product-quantity #quantity_wanted,
.product-add-to-cart .product-quantity .input-group,
.product-add-to-cart .product-quantity .add,
.product-add-to-cart .product-quantity .add-to-cart{
  flex: 0 0 auto;
}

/* Fila 2: corazón y “Compra segura” */
.product-add-to-cart .product-quantity .wishlist-button-product,
.product-add-to-cart .product-quantity .wishlist,
.product-add-to-cart .product-quantity #wishlist_button{
  order: 3;
}

.product-add-to-cart .product-quantity .cta-trust,
.product-add-to-cart .product-quantity .compra-segura,
.product-add-to-cart .product-quantity .trust-badge{
  order: 4;
}

/* Si tu “Compra segura” no tiene clase, atacamos el texto común */
.product-add-to-cart .product-quantity *:is(p,span,div){
  /* no hace nada por sí solo; sirve para no romper nada */
}

/* Estilo de la fila 2: corazón + texto alineados */
.product-add-to-cart .product-quantity .wishlist-button-product,
.product-add-to-cart .product-quantity .wishlist,
.product-add-to-cart .product-quantity #wishlist_button{
  margin-top: 8px;
}

.product-add-to-cart .product-quantity .cta-trust,
.product-add-to-cart .product-quantity .compra-segura · Pago protegido,
.product-add-to-cart .product-quantity .trust-badge{
  margin-top: 8px;
  margin-left: 6px;
}
/* Centrar solo el texto de compra segura en línea completa */
.product-add-to-cart .product-quantity .cta-trust,
.product-add-to-cart .product-quantity .compra-segura · Pago protegido,
.product-add-to-cart .product-quantity .trust-badge{
  flex: 0 0 100%;
  width: 100%;
  text-align: center;
  margin-left: 0;
}
#block-newsletter-label{
  font-weight: 600;
  line-height: 1.35;
}
#block-newsletter-label .newsletter-sub{
  display:block;
  font-weight: 400;
  font-size: .92em;
  opacity: .8;
  margin-top: 4px;
}
.home-trust{
  display:flex;
  gap:18px;
  flex-wrap:wrap;
  justify-content:center;
  padding:14px 0;
  font-size:.95em;
  opacity:.9;
}
.home-trust span{ white-space:nowrap; }
.footer-seo-note{
  margin-top: 12px;
  padding-bottom: 6px;
  font-size: 12px;
  line-height: 1.4;
  color: #9aa3ad;
  text-align: center;
}
/* BOTÓN PRINCIPAL (CTA) */
.btn-primary,
.btn.btn-primary,
button.btn-primary,
input.btn-primary {
  background: #1F8FBF
 !important;
  border-color: #1F8FBF
 !important;
  color: #fff !important;
}

/* HOVER */
.btn-primary:hover,
.btn.btn-primary:hover,
button.btn-primary:hover,
input.btn-primary:hover {
  filter: brightness(0.92) !important;
}

/* FOCUS (accesibilidad) */
.btn-primary:focus,
.btn.btn-primary:focus,
button.btn-primary:focus,
input.btn-primary:focus {
  box-shadow: 0 0 0 0.2rem rgba(36, 185, 215, 0.35) !important;
}
a { color: #1F8FBF
; }
a:hover { filter: brightness(0.85); }

.mercadopago-logo {
  width: 64px;
  height: auto;
  margin-right: 10px;
}

@media (max-width: 768px) {
  .mercadopago-logo {
    width: 48px;
  }
}
.mercadopago-badge {
  display: flex;
  align-items: center;
  margin-top: 12px;
  gap: 10px;
}