/* ===== J&J Custom Checkout ===== */
:root{
  --page-bg:#ffffff;          /* ✅ no grey bg */
  --ink:#191919;
  --card:#F4F2EC;             /* warm off-white */
  --muted:#6b7280;
  --line:#d6d6d6;
  --accent:#191919;
  --danger:#B00020;
  --ring:rgba(25,25,25,.2);
  --shadow: 0 10px 20px rgba(0,0,0,.08), 0 2px 6px rgba(0,0,0,.06);
  --radius:18px;
}

body.woocommerce-checkout, .woocommerce-checkout{
  background:var(--page-bg) !important;
  color:var(--ink);
}

/* ✅ Hide default entry-title (we output our custom heading) */
.woocommerce-checkout .entry-title,
.page-id-my-checkout .entry-title{
  display:none !important;
}

/* ✅ Hide “Have a coupon?” bar */
.woocommerce-form-coupon-toggle{
  display:none !important;
}

/* ==============================
   CUSTOM HEADING (like Popular)
   ============================== */
.jj-checkout-heading{
  background:#fff;
  padding: 40px 20px 28px;
}
.jj-checkout-heading-inner{
  max-width: 1240px; /* ✅ wider */
  margin: 0 auto;
  text-align:center;
}

/* Same heading style you gave */
.jj-section-heading.jj-checkout-title{
  margin: 0 0 10px;
  font-family: "Baskerville Old Face","Times New Roman",serif;
  font-size: 28px;
  font-weight: 500;
  text-transform: uppercase;
  letter-spacing: 0.12em;
  color: #403C37;
}

/* Ornamental divider */
.jj-heading-divider{
  display:flex;
  align-items:center;
  justify-content:center;
  gap: 10px;
  margin: 0 auto;
  width: min(560px, 92vw);
}
.jj-heading-divider span{
  flex:1 1 auto;
  height:1px;
  background:#CA8B54;
  opacity:.75;
}
.jj-heading-divider .jj-heading-icon{
  width: 54px;
  height: 14px;
  border-radius: 999px;
  border: 2px solid #CA8B54;
  background:#ffffff;
  display:inline-block;
  position:relative;
}
.jj-heading-divider .jj-heading-icon::before,
.jj-heading-divider .jj-heading-icon::after{
  content:"";
  position:absolute;
  top:50%;
  width:7px;height:7px;
  border-radius:999px;
  background:#CA8B54;
  transform:translateY(-50%);
}
.jj-heading-divider .jj-heading-icon::before{ left:-16px; }
.jj-heading-divider .jj-heading-icon::after{ right:-16px; }

/* Layout wrapper */
.gsmc-wrap{
  max-width: 1240px;  /* ✅ wider */
  margin: 18px auto 48px;
  padding: 0 16px;
  overflow: visible;
}

.gsmc-grid{
  display:grid;
  grid-template-columns: 1.12fr .88fr;
  gap: 22px;
  align-items:start;
}
@media (max-width:980px){
  .gsmc-grid{ grid-template-columns:1fr; gap:16px; }
}

/* Cards */
.gsmc-card{
  background:var(--card);
  color:var(--ink);
  border-radius:var(--radius);
  box-shadow:var(--shadow);
  border:1px solid var(--line);
  padding:18px 18px 14px;
  position:relative;
}
.gsmc-card .gsmc-title{
  font-weight:700;
  letter-spacing:.2px;
  font-size:16px;
  margin-bottom:8px;
  color:var(--ink);
}
.gsmc-sep{border:0;height:1px;background:var(--line);margin:8px 0 14px}

/* Fields */
.gsmc-field{margin-bottom:12px;}
.gsmc-field input.input-text, .gsmc-field select, .gsmc-field textarea{
  width:100%;
  border:1px solid var(--line);
  background:#fff;
  border-radius:12px;
  padding:12px 12px;
  font-size:14px;
  color:var(--ink);
  outline:none;
}
.gsmc-field input:focus, .gsmc-field select:focus, .gsmc-field textarea:focus{
  border-color:var(--ink);
  box-shadow:0 0 0 3px var(--ring);
}

/* 2-col */
.gsmc-grid-2{display:grid;grid-template-columns:1fr 1fr;gap:12px;}
@media (max-width:680px){.gsmc-grid-2{grid-template-columns:1fr;}}

/* Shipping toggle */
.gsmc-check{display:inline-flex;align-items:center;gap:8px;cursor:pointer;}
.gsmc-check input{transform:translateY(1px)}

/* Items */
.gsmc-items{display:flex;flex-direction:column;gap:10px;margin-bottom:14px;}
.gsmc-item{
  display:grid;
  grid-template-columns:64px 1fr auto auto;
  gap:10px;
  align-items:center;
  background:#fff;
  border:1px solid var(--line);
  border-radius:14px;
  padding:10px;
}
.gsmc-item-thumb img{width:64px;height:64px;object-fit:contain;border-radius:10px;background:#fff}
.gsmc-item-title{font-weight:600}
.gsmc-item-meta{font-size:12px;color:#333}
.gsmc-item-total{white-space:nowrap;font-weight:700}

/* Remove button */
.gsmc-item-actions{display:flex;align-items:center;justify-content:center}
.gsmc-remove{
  background:transparent!important;
  border:none!important;
  color:var(--danger)!important;
  width:34px;height:34px;
  border-radius:999px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  cursor:pointer;
}
.gsmc-remove:hover{background:#ffeaea}

/* Coupon */
.gsmc-voucher{margin-bottom:12px}
.gsmc-voucher-row{display:flex;gap:8px}
#gsmc-coupon{
  background:#fff;
  border:1px solid var(--line);
  border-radius:12px;
  padding:10px 12px;
  flex:1;
  color:var(--ink)
}
#gsmc-apply-coupon{
  background:var(--accent);
  color:#E0E1E1;
  border:none;
  border-radius:999px;
  padding:10px 16px;
  font-weight:700;
  cursor:pointer
}
#gsmc-apply-coupon:hover{opacity:.92}
#gsmc-voucher-status{margin-top:8px;font-size:12px}

/* Buttons */
.button, .woocommerce-button, .woocommerce a.button, .woocommerce button.button{
  background:var(--accent);
  color:#E0E1E1;
  border-radius:999px;
  border:1px solid var(--ink);
  padding:12px 14px;
  font-weight:700;
  letter-spacing:.08em;
  text-transform:uppercase;
}

/* Place order */
.gsmc-light .woocommerce #place_order{
  width:100% !important;
  display:block !important;
  margin:14px auto 2px !important;
  padding:14px 18px !important;
  font-size:14px !important;
  border-radius:999px !important;
}

/* Summary card extras */
.gsmc-summary .place-order{margin-top:8px}
.gsmc-summary .woocommerce-checkout-payment{
  background:#fff;
  border:1px solid var(--line);
  border-radius:14px;
  padding:12px;
}

/* ===== Attachment / POP dropzone ===== */
.gsmc-attach{margin:8px 0 12px}
.gsmc-drop{
  display:flex;flex-direction:column;align-items:center;justify-content:center;gap:6px;
  border:2px dashed #191919;border-radius:14px;padding:18px;background:#fff;cursor:pointer;position:relative;overflow:hidden
}
.gsmc-drop:hover{background:#fafafa}
.gsmc-drop input[type=file]{position:absolute;inset:0;opacity:0;cursor:pointer}
.gsmc-plus{display:inline-flex;width:40px;height:40px;border-radius:999px;background:#191919;color:#E0E1E1;align-items:center;justify-content:center;font-weight:900}
.gsmc-help{font-size:12px;color:#333}
.gsmc-file{font-size:12px;color:#111;margin-top:6px;word-break:break-all}
.gsmc-pop-preview{margin-top:8px;border:1px solid #e5e7eb;border-radius:10px;overflow:hidden}
.gsmc-pop-preview img{display:block;max-width:100%;height:auto}

/* Bank logos + layout */
#gsmc-bacs-list .gsmc-banklogo{
  width:84px;
  height:84px;
  object-fit:contain;
  border-radius:12px;
  border:1px solid #e5e5e5;
  background:#fff;
  display:inline-block;
}
#gsmc-bacs-list .gsmc-acc{
  display:grid;
  grid-template-columns:84px 1fr auto;
  align-items:center;
  gap:12px;
  padding:10px 12px;
  background:#fff;
  border:1px solid var(--line);
  border-radius:14px;
  margin-bottom:8px;
}
#gsmc-bacs-list .gsmc-acc .gsmc-acc-body{ line-height:1.25; }
#gsmc-bacs-list .gsmc-row{ margin:2px 0; }

/* Woo totals table (keep subtotal/discount/total only) */
.woocommerce-checkout-review-order-table thead{ display:none !important; }
.woocommerce-checkout-review-order-table tbody{ display:none !important; }
.gsmc-light .woocommerce-checkout-review-order-table tfoot tr{ display:none !important; }
.gsmc-light .woocommerce-checkout-review-order-table tfoot tr.cart-subtotal,
.gsmc-light .woocommerce-checkout-review-order-table tfoot tr.order-total,
.gsmc-light .woocommerce-checkout-review-order-table tfoot tr[class*="cart-discount"]{ display:table-row !important; }
.gsmc-light .woocommerce-checkout-review-order-table tfoot th,
.gsmc-light .woocommerce-checkout-review-order-table tfoot td{
  padding:8px 10px !important;
  text-align:left !important;
}
.gsmc-light .woocommerce-checkout-review-order-table tfoot td .amount{
  display:inline-block;
}

/* Toasts */
.gsmc-toast-stack{
  position: fixed;
  top: 16px;
  right: 16px;
  z-index: 2147483647;
  display:flex;
  flex-direction:column;
  gap:8px;
  pointer-events:none;
}
.gsmc-toast{
  min-width: 240px;
  max-width: 340px;
  background: #111;
  color:#fff;
  border-radius: 12px;
  padding: 10px 12px;
  box-shadow: var(--shadow);
  transform: translateX(120%);
  opacity: 0;
  transition: transform .35s ease, opacity .35s ease;
}
.gsmc-toast.show{ transform: translateX(0); opacity: 1; }
.gsmc-toast.hide{ transform: translateX(120%); opacity: 0; }
.gsmc-toast.error{ background:#B00020; }

/* Mobile */
@media (max-width:640px){
  .jj-checkout-heading{ padding: 28px 14px 20px; }
  .jj-section-heading.jj-checkout-title{ font-size: 24px; }
}

/* Hide default Woo payment radios + payment boxes (keep in DOM for JS sync) */
.woocommerce-checkout #payment ul.wc_payment_methods,
.woocommerce-checkout #payment .payment_box,
.woocommerce-checkout #payment div.payment_box {
  display: none !important;
}

/* Optional: hide the whole default payment section title spacing */
.woocommerce-checkout #payment .woocommerce-PaymentMethods {
  display: none !important;
}
