/*
  GETSMARTCA Lite — Cart/Checkout conversion tweaks
  Loaded only on Cart + Checkout.
*/

/* Reduce distraction: hide page H1 on Cart/Checkout (steps already show context) */
body.woocommerce-cart .gs-h1,
body.woocommerce-checkout .gs-h1{display:none;}

/* Small top bar under steps/trust */
.gs-cc-top{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  flex-wrap:wrap;
  padding: 10px 12px;
  border:1px solid var(--border);
  border-radius: var(--radius);
  background:#fff;
  box-shadow: 0 10px 22px rgba(2,6,23,.05);
  margin: 0 0 14px;
}
.gs-cc-link{
  display:inline-flex;
  align-items:center;
  gap:8px;
  padding: 10px 12px;
  border-radius: 999px;
  border:1px solid var(--border);
  background:#fff;
  color: var(--text);
  font-weight: 900;
}
.gs-cc-link:hover{border-color: rgba(32,48,136,.35)}
.gs-cc-note{color: var(--muted); font-weight:800; font-size:13px}

/* Cards inserted by hooks (payment logos + WhatsApp help) */
.gs-cc-card{
  border:1px solid var(--border);
  border-radius: var(--radius);
  background:#fff;
  padding: 14px;
  margin-top: 12px;
  box-shadow: 0 10px 22px rgba(2,6,23,.05);
}
.gs-cc-title{font-weight: 900; margin: 0 0 8px; font-size: 14px}
.gs-cc-text{color: var(--muted); font-weight: 700; font-size: 13px; margin: 0 0 10px}
.gs-cc-small{color: var(--muted); font-weight: 800; font-size: 12px; margin-top: 10px}

.gs-cc-wa{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:10px;
  width:100%;
  padding: 12px 14px;
  border-radius: 999px;
  border:1px solid rgba(22,163,74,.35);
  background: rgba(22,163,74,.12);
  color: #166534;
  font-weight: 900;
}
.gs-cc-wa:hover{background: rgba(22,163,74,.16);}
.gs-cc-wa-ico{display:inline-flex;}
.gs-cc-wa-ico svg{width:18px;height:18px;}

/* Proceed note inside sticky bar */
.gs-cc-proceed-note{
  margin-top: 10px;
  font-size: 12px;
  font-weight: 800;
  color: var(--muted);
  text-align:center;
}

/* Payment logos sizing safeguard (in case style.css isn't cached) */
.gs-footer-payments{display:flex; flex-wrap:wrap; gap:12px; align-items:center; margin-top:10px;}
.gs-pay-logo{height:20px; width:auto; max-width:140px; display:block; opacity:.95;}
@media (max-width:520px){ .gs-pay-logo{ height:18px; } }
.gs-footer-payments.is-mono .gs-pay-logo{filter: grayscale(1) saturate(0) brightness(0); opacity:.92;}

/* Cart — quantity UX (plus/minus) */
.woocommerce-cart .quantity{
  display:inline-flex;
  align-items:center;
  gap:8px;
}
.woocommerce-cart .gs-qty-btn{
  width: 34px;
  height: 34px;
  border-radius: 999px;
  border:1px solid var(--border);
  background:#fff;
  font-weight: 900;
  cursor:pointer;
}
.woocommerce-cart .gs-qty-btn:hover{border-color: rgba(32,48,136,.35)}
.woocommerce-cart .quantity .qty{min-height: 34px;}

/* Cart — remove button more visible */
.woocommerce-cart a.remove{
  display:inline-flex !important;
  align-items:center;
  justify-content:center;
  width: 32px;
  height: 32px;
  border-radius: 999px;
  background: rgba(192,32,40,.10) !important;
  color: var(--brand-red) !important;
  border:1px solid rgba(192,32,40,.25) !important;
  font-weight: 900 !important;
}
.woocommerce-cart a.remove:hover{background: rgba(192,32,40,.14) !important;}

/* Cart — coupon toggle */
.woocommerce-cart .gs-coupon-toggle{
  display:inline-flex;
  align-items:center;
  gap:8px;
  padding: 10px 12px;
  border-radius: 999px;
  border:1px solid var(--border);
  background:#fff;
  font-weight: 900;
  cursor:pointer;
}
.woocommerce-cart .gs-coupon-toggle:hover{border-color: rgba(32,48,136,.35)}

body.gs-coupon-collapsed .woocommerce-cart .coupon{display:none !important;}

/* Checkout — payment methods look cleaner */
.woocommerce-checkout #payment ul.payment_methods{
  border-top:1px solid var(--border);
}
.woocommerce-checkout #payment ul.payment_methods li{
  padding: 10px 12px;
}
.woocommerce-checkout #payment ul.payment_methods li label{
  font-weight: 900;
}
.woocommerce-checkout #payment div.payment_box{
  border-radius: 12px;
  border: 1px solid var(--border);
  background: rgba(227,211,220,.20);
}

/* Checkout — keep primary CTA always full-width */
.woocommerce-checkout #place_order{width:100% !important;}

/* Checkout — edit cart link alignment on narrow */
@media (max-width: 520px){
  .gs-cc-top{align-items:flex-start;}
  .gs-cc-note{width:100%;}
}

/* =====================================================================
   GETSMARTCA — Fixes (desktop zoom-out + payment logos sizing)
   ===================================================================== */

/* Wider container + more balanced columns on large desktop (helps when browser zoom is reduced) */
@media (min-width: 1200px){
  body.woocommerce-cart .gs-container.gs-woo,
  body.woocommerce-checkout .gs-container.gs-woo{
    width: min(1360px, calc(100% - 48px));
  }

  .woocommerce-cart .woocommerce{
    grid-template-columns: 1fr !important;
    gap: 20px;
  }

  .woocommerce-checkout form.checkout{
    grid-template-columns: 1fr !important;
    gap: 20px;
  }
}

/* Hard guard: payment logos must never blow up (some plugins force img{width:100%}) */
.gs-footer-payments .gs-pay-logo,
.gs-cc-card .gs-footer-payments .gs-pay-logo{
  width: auto !important;
  height: 22px !important;
  max-height: 22px !important;
  max-width: 150px !important;
  object-fit: contain;
}
@media (max-width: 520px){
  .gs-footer-payments .gs-pay-logo,
  .gs-cc-card .gs-footer-payments .gs-pay-logo{
    height: 20px !important;
    max-height: 20px !important;
    max-width: 140px !important;
  }
}

/* Checkout: keep payment widgets (MercadoPago/iframes) inside the column on mobile */
.woocommerce-checkout #payment,
.woocommerce-checkout #payment .payment_box{
  overflow: hidden;
}
.woocommerce-checkout #payment .payment_box{ 
  overflow-wrap: anywhere;
  word-break: break-word;
}
.woocommerce-checkout #payment .payment_box iframe,
.woocommerce-checkout #payment .payment_box img,
.woocommerce-checkout #payment .payment_box video{
  max-width: 100% !important;
  height: auto !important;
}
@media (max-width: 640px){
  .woocommerce-checkout #payment ul.payment_methods li{ padding: 10px 10px; }
  .woocommerce-checkout #payment div.payment_box{ padding: 10px 10px; }
}

/* Extra guard: some gateways set fixed iframe widths */
.woocommerce-checkout #payment iframe,
.woocommerce-checkout #payment .payment_box iframe,
body.woocommerce-order-pay #payment iframe{
  width: 100% !important;
  max-width: 100% !important;
}


/* Order Pay (pagar pedido) — keep everything full width */
body.woocommerce-order-pay .woocommerce{
  max-width: 980px;
  margin: 0 auto;
}
body.woocommerce-order-pay #payment,
body.woocommerce-order-pay #payment .payment_box{
  overflow: hidden;
}
body.woocommerce-order-pay #payment iframe,
body.woocommerce-order-pay #payment img{
  max-width:100% !important;
  height:auto !important;
}