/* ================================================================
   Balaji Aurica — Checkout CSS
   All checkout pages: cart, login, delivery, kyc, review, payment,
   confirmation, track
================================================================ */

/* ── Variables (inherit from styles.css) ──────────────────────── */
:root {
  --co-gold:      #C9A84C;
  --co-gold-dark: #9a7a20;
  --co-green:     #1a6b4a;
  --co-dark:      #1a1f2e;
  --co-ivory:     #fdfaf4;
  --co-border:    #e8dfc8;
  --co-muted:     #6b7280;
  --co-red:       #dc3545;
  --co-shadow:    0 2px 16px rgba(0,0,0,.07);
  --co-radius:    12px;
}

/* ── Page wrapper ─────────────────────────────────────────────── */
.co-page { background: var(--co-ivory); min-height: 80vh; padding: 2rem 0 4rem; }
.co-page .container { max-width: 1240px; margin: 0 auto; padding: 0 1.25rem; }

/* ── Layout: main + sidebar ───────────────────────────────────── */
.co-layout {
  display: grid;
  grid-template-columns: 1fr 380px;
  gap: 2rem;
  align-items: start;
  margin-top: 1.5rem;
}
.co-main  { min-width: 0; }
.co-side  { position: sticky; top: 90px; }

/* ── Breadcrumb ───────────────────────────────────────────────── */
.co-breadcrumb { font-size: .8rem; color: var(--co-muted); margin-bottom: 1.25rem; }
.co-breadcrumb a { color: var(--co-muted); text-decoration: none; }
.co-breadcrumb a:hover { color: var(--co-gold-dark); }

/* ── Page title ───────────────────────────────────────────────── */
.co-page-title { font-family:'Playfair Display',serif; font-size:1.6rem; font-weight:700; margin-bottom:.25rem; }
.co-page-count { font-size:1rem; color:var(--co-muted); font-family:'Inter',sans-serif; font-weight:400; }
.co-section-title { font-family:'Playfair Display',serif; font-size:1.5rem; font-weight:700; margin-bottom:.25rem; }
.co-section-sub { color:var(--co-muted); font-size:.875rem; margin-bottom:1.25rem; }

/* ── Alerts ───────────────────────────────────────────────────── */
.co-alert { border-radius:8px; padding:.75rem 1rem; font-size:.85rem; margin-bottom:1rem; }
.co-alert--success { background:#d1fae5; color:#065f46; }
.co-alert--error   { background:#fee2e2; color:#991b1b; }
.co-error-list     { margin:0; padding-left:1.25rem; }

/* ── Buttons ──────────────────────────────────────────────────── */
.co-btn {
  display: inline-flex; align-items:center; justify-content:center; gap:.5rem;
  padding:.65rem 1.25rem; border-radius:8px; font-weight:600; font-size:.85rem;
  cursor:pointer; text-decoration:none; border:none; transition:all .2s; letter-spacing:.3px;
}
.co-btn--dark    { background:var(--co-dark); color:#fff; }
.co-btn--dark:hover { background:#2d3550; }
.co-btn--outline { background:transparent; border:1.5px solid #d1d5db; color:var(--co-dark); }
.co-btn--outline:hover { border-color:var(--co-gold); color:var(--co-gold-dark); }
.co-btn--ghost   { background:transparent; border:1.5px solid var(--co-gold); color:var(--co-gold-dark); }
.co-btn--ghost:hover { background:var(--co-gold); color:#fff; }
.co-btn--full    { width:100%; }
.co-btn--sm      { padding:.35rem .75rem; font-size:.78rem; }
.co-btn--wide    { padding:.75rem 2rem; }
.co-btn--checkout { margin-top:1rem; padding:.85rem; font-size:.9rem; letter-spacing:.5px; }
.co-form-actions { display:flex; gap:.75rem; align-items:center; margin-top:1.5rem; flex-wrap:wrap; }

/* ── Cards / boxes ────────────────────────────────────────────── */
.co-box { background:#fff; border-radius:var(--co-radius); box-shadow:var(--co-shadow); padding:1.5rem; }

/* ── Trust bar ────────────────────────────────────────────────── */
.co-trust-bar {
  background:#f0fdf4; border:1px solid #bbf7d0; border-radius:8px;
  padding:.75rem 1rem; font-size:.82rem; color:var(--co-green);
  display:flex; align-items:center; gap:.75rem; flex-wrap:wrap; margin-bottom:1.25rem;
}
.co-trust-badges { display:flex; gap:.5rem; color:#374151; font-size:.78rem; margin-left:auto; }

/* ── Stepper ──────────────────────────────────────────────────── */
.co-stepper { background:#fff; border-bottom:1px solid var(--co-border); padding:.85rem 0; margin-bottom:0; }
.co-stepper-inner {
  max-width:1240px; margin:0 auto; padding:0 1.25rem;
  display:flex; align-items:center; gap:0; overflow-x:auto; scrollbar-width:none;
}
.co-stepper-inner::-webkit-scrollbar { display:none; }
.co-step { display:flex; align-items:center; gap:.4rem; flex-shrink:0; }
.co-step-circle {
  width:26px; height:26px; border-radius:50%; display:flex; align-items:center;
  justify-content:center; font-size:.72rem; font-weight:700; flex-shrink:0;
}
.co-step--done .co-step-circle    { background:var(--co-dark); color:#fff; }
.co-step--active .co-step-circle  { background:var(--co-dark); color:#fff; }
.co-step--pending .co-step-circle { background:#f3f4f6; color:#9ca3af; border:1.5px solid #e5e7eb; }
.co-step-label { font-size:.68rem; font-weight:600; letter-spacing:.3px; white-space:nowrap; }
.co-step--done .co-step-label    { color:var(--co-muted); }
.co-step--active .co-step-label  { color:var(--co-dark); }
.co-step--pending .co-step-label { color:#9ca3af; }
.co-step-arrow { margin:0 .35rem; color:#d1d5db; font-size:.8rem; flex-shrink:0; }
.co-step-arrow.done { color:var(--co-dark); }

/* ── Order Summary ────────────────────────────────────────────── */
.co-summary {
  background:#fff; border-radius:var(--co-radius); box-shadow:var(--co-shadow);
  padding:1.25rem; margin-bottom:1rem;
}
.co-summary-title {
  font-family:'Inter',sans-serif; font-size:.78rem; font-weight:700;
  letter-spacing:1px; text-transform:uppercase; margin-bottom:1rem;
  padding-bottom:.75rem; border-bottom:1px solid var(--co-border);
}
.co-summary-count { color:var(--co-muted); font-weight:400; }
.co-sum-item { display:flex; gap:.75rem; padding:.75rem 0; border-bottom:1px solid #f3f4f6; }
.co-sum-img { width:52px; height:52px; border-radius:8px; overflow:hidden; background:#faf8f4; flex-shrink:0; }
.co-sum-img img { width:100%; height:100%; object-fit:contain; }
.co-sum-img-ph { width:100%; height:100%; background:#f3f4f6; }
.co-sum-info { flex:1; min-width:0; }
.co-sum-name { font-size:.8rem; font-weight:600; line-height:1.3; }
.co-sum-sub  { font-size:.72rem; color:var(--co-muted); }
.co-sum-qty  { font-size:.72rem; color:var(--co-muted); }
.co-sum-price { font-size:.85rem; font-weight:600; flex-shrink:0; }
.co-sum-divider { border:none; border-top:1px solid var(--co-border); margin:.75rem 0; }
.co-sum-row { display:flex; justify-content:space-between; font-size:.82rem; margin-bottom:.4rem; color:#374151; }
.co-sum-row--reward { color:var(--co-green); font-weight:500; }
.co-sum-row--charge { color:var(--co-muted); }
.co-sum-total { display:flex; justify-content:space-between; font-weight:700; font-size:1rem; }
.co-sum-tax   { font-size:.72rem; color:var(--co-muted); text-align:right; margin-top:.2rem; }
.co-sum-why { font-size:.78rem; }
.co-sum-why b { display:block; margin-bottom:.4rem; }
.co-sum-why ul { padding-left:0; list-style:none; }
.co-sum-why ul li { margin-bottom:.2rem; color:var(--co-green); font-size:.78rem; }
.co-sum-prices-note { font-size:.72rem; color:var(--co-muted); text-align:center; margin-top:.75rem; display:flex; align-items:center; justify-content:center; gap:.3rem; }
.co-sum-trust { background:#fff; border-radius:var(--co-radius); padding:1rem; box-shadow:var(--co-shadow); font-size:.8rem; display:flex; flex-direction:column; gap:.3rem; }
.co-sum-trust-item { display:flex; align-items:center; gap:.4rem; font-weight:600; color:var(--co-green); }
.co-sum-trust-sub { font-size:.73rem; color:var(--co-muted); }
.co-sum-secure { display:flex; gap:.5rem; align-items:flex-start; font-size:.78rem; color:var(--co-green); font-weight:500; }
.co-sum-why-list { list-style:none; padding:0; font-size:.75rem; margin-top:.4rem; }
.co-sum-why-list li { margin-bottom:.2rem; }
.co-sum-info-ic { font-size:.7rem; color:var(--co-muted); }

/* ── Rewards ──────────────────────────────────────────────────── */
.co-rewards-box { padding:.75rem 0; }
.co-rewards-head { display:flex; justify-content:space-between; font-size:.82rem; font-weight:600; }
.co-rewards-bal  { color:var(--co-green); }
.co-rewards-sub  { font-size:.72rem; color:var(--co-muted); margin-bottom:.5rem; }
.co-rewards-form { display:flex; gap:.5rem; }
.co-rewards-input { flex:1; border:1.5px solid var(--co-border); border-radius:6px; padding:.4rem .75rem; font-size:.82rem; outline:none; }
.co-rewards-input:focus { border-color:var(--co-gold); }
.co-rewards-apply { background:var(--co-dark); color:#fff; border:none; border-radius:6px; padding:.4rem .85rem; font-size:.78rem; font-weight:600; cursor:pointer; letter-spacing:.3px; }
.co-rewards-save { font-size:.75rem; color:var(--co-green); font-weight:600; margin-top:.4rem; }
.co-rewards-bal-big { font-size:1.2rem; font-weight:700; color:var(--co-green); }

/* ── Cart table ───────────────────────────────────────────────── */
.co-cart-table { border:1px solid var(--co-border); border-radius:var(--co-radius); overflow:hidden; background:#fff; margin-bottom:1.25rem; }
.co-cart-head { display:grid; grid-template-columns:1fr 160px 120px 130px 30px; gap:1rem; padding:.75rem 1.25rem; background:#f9fafb; font-size:.72rem; font-weight:600; letter-spacing:.5px; color:var(--co-muted); text-transform:uppercase; }
.co-cart-row  { display:grid; grid-template-columns:1fr 160px 120px 130px 30px; gap:1rem; padding:1rem 1.25rem; align-items:center; border-top:1px solid #f3f4f6; }
.co-cart-row:hover { background:#fdfaf4; }
.co-cart-product { display:flex; gap:.75rem; align-items:flex-start; }
.co-cart-img  { width:60px; height:60px; border-radius:8px; background:#faf8f4; flex-shrink:0; overflow:hidden; border:1px solid var(--co-border); }
.co-cart-img img { width:100%; height:100%; object-fit:contain; }
.co-cart-info { flex:1; }
.co-cart-name  { font-size:.85rem; font-weight:600; margin-bottom:.2rem; }
.co-cart-brand { font-size:.75rem; color:var(--co-muted); }
.co-cart-badge { display:inline-flex; align-items:center; gap:.3rem; font-size:.68rem; color:var(--co-green); margin-top:.25rem; }
.co-cart-price-main { font-size:.9rem; font-weight:600; }
.co-cart-price-sub  { font-size:.72rem; color:var(--co-muted); }
.co-cart-weight     { font-size:.72rem; color:var(--co-muted); }
.co-cart-subtotal   { font-size:.9rem; font-weight:600; }
.co-cart-actions    { display:flex; gap:1rem; flex-wrap:wrap; }
.co-remove-btn { background:none; border:none; cursor:pointer; color:#9ca3af; font-size:1rem; padding:.25rem; }
.co-remove-btn:hover { color:var(--co-red); }
.co-qty { display:flex; align-items:center; border:1.5px solid var(--co-border); border-radius:8px; overflow:hidden; width:fit-content; }
.co-qty-btn   { width:32px; height:32px; background:none; border:none; cursor:pointer; font-size:1rem; color:var(--co-dark); display:flex; align-items:center; justify-content:center; }
.co-qty-btn:hover { background:#f3f4f6; }
.co-qty-input { width:40px; text-align:center; border:none; border-left:1px solid var(--co-border); border-right:1px solid var(--co-border); font-size:.85rem; font-weight:600; background:none; outline:none; }
.co-empty { text-align:center; padding:4rem 2rem; }
.co-empty-ico { font-size:3rem; margin-bottom:1rem; }
.co-empty h3  { font-family:'Playfair Display',serif; font-size:1.3rem; margin-bottom:.5rem; }
.co-empty p   { color:var(--co-muted); font-size:.875rem; margin-bottom:1.5rem; }

/* ── Delivery estimate / pincode ──────────────────────────────── */
.co-delivery-est { background:#f9fafb; border-radius:8px; padding:.75rem 1rem; margin-bottom:.75rem; font-size:.82rem; }
.co-del-date { font-size:.82rem; color:var(--co-muted); margin-bottom:.4rem; }
.co-del-note { font-size:.72rem; color:var(--co-muted); }

/* ── Trust grid ───────────────────────────────────────────────── */
.co-trust-grid { display:grid; grid-template-columns:1fr 1fr; gap:.75rem; background:#fff; border-radius:var(--co-radius); padding:1rem; box-shadow:var(--co-shadow); }
.co-trust-grid--4 { grid-template-columns:repeat(4,1fr); margin-top:1.5rem; }
.co-trust-item { display:flex; align-items:flex-start; gap:.6rem; font-size:.75rem; }
.co-trust-ico  { font-size:1.3rem; flex-shrink:0; }
.co-trust-item b { display:block; font-size:.75rem; margin-bottom:.1rem; }
.co-trust-item small { color:var(--co-muted); font-size:.68rem; }

/* ── Forms ────────────────────────────────────────────────────── */
.co-field { margin-bottom:1rem; }
.co-field label { display:block; font-size:.8rem; font-weight:600; margin-bottom:.35rem; color:#374151; }
.co-field input, .co-field select, .co-field textarea {
  width:100%; border:1.5px solid #d1d5db; border-radius:8px;
  padding:.6rem .85rem; font-size:.875rem; outline:none; background:#fff;
  transition:border-color .15s;
}
.co-field input:focus, .co-field select:focus { border-color:var(--co-gold); box-shadow:0 0 0 3px rgba(201,168,76,.1); }
.co-field-row      { margin-bottom:0; }
.co-field-row--2   { display:grid; grid-template-columns:1fr 1fr; gap:1rem; }
.co-field-row--3   { display:grid; grid-template-columns:1fr 1fr 1fr; gap:1rem; }
.co-field-note     { font-size:.72rem; color:var(--co-muted); margin-top:.3rem; }
.co-req            { color:var(--co-red); }
.co-muted-label    { color:var(--co-muted); font-weight:400; font-size:.78rem; }
.co-muted          { color:var(--co-muted); }
.co-muted-sm       { color:var(--co-muted); font-size:.78rem; line-height:1.5; }
.co-gold           { color:var(--co-gold-dark); font-weight:600; }
.co-link-gold      { color:var(--co-gold-dark); font-weight:600; font-size:.8rem; text-decoration:none; }
.co-link-gold:hover { text-decoration:underline; }
.co-check-row      { margin-bottom:1rem; }
.co-check          { display:flex; align-items:center; gap:.4rem; font-size:.82rem; cursor:pointer; }
.co-forgot         { float:right; font-size:.78rem; }
.co-secure-note    { display:flex; align-items:center; gap:.5rem; font-size:.78rem; color:var(--co-muted); background:#f9fafb; border-radius:8px; padding:.75rem 1rem; margin-top:1.25rem; }
.co-secure-note--sm { margin-top:.75rem; padding:.6rem .75rem; }
.co-skip-note      { font-size:.72rem; color:var(--co-muted); text-align:center; margin-top:.4rem; }

/* ── Phone input ──────────────────────────────────────────────── */
.co-phone-input { display:flex; align-items:center; border:1.5px solid #d1d5db; border-radius:8px; overflow:hidden; }
.co-phone-input:focus-within { border-color:var(--co-gold); box-shadow:0 0 0 3px rgba(201,168,76,.1); }
.co-phone-flag  { padding:.6rem .75rem; background:#f9fafb; border-right:1px solid #e5e7eb; font-size:.82rem; white-space:nowrap; flex-shrink:0; }
.co-phone-input input { border:none; border-radius:0; box-shadow:none; flex:1; }
.co-phone-input input:focus { box-shadow:none; }

/* ── Password toggle ──────────────────────────────────────────── */
.co-pass-wrap  { position:relative; }
.co-pass-toggle { position:absolute; right:.75rem; top:50%; transform:translateY(-50%); background:none; border:none; cursor:pointer; color:var(--co-muted); font-size:1rem; }

/* ── Login grid ───────────────────────────────────────────────── */
.co-login-grid   { display:grid; grid-template-columns:1fr 1fr; gap:2rem; }
.co-login-box    { background:#fff; border-radius:var(--co-radius); padding:1.75rem; box-shadow:var(--co-shadow); }
.co-login-box h3 { font-size:.82rem; font-weight:700; letter-spacing:.5px; text-transform:uppercase; margin-bottom:.25rem; }
.co-register-box { background:#fff; border-radius:var(--co-radius); padding:1.75rem; box-shadow:var(--co-shadow); }
.co-register-box h3 { font-size:.82rem; font-weight:700; letter-spacing:.5px; text-transform:uppercase; margin-bottom:.25rem; }
.co-or { text-align:center; color:var(--co-muted); font-size:.8rem; margin:.75rem 0; position:relative; }
.co-or::before, .co-or::after { content:''; position:absolute; top:50%; width:42%; height:1px; background:#e5e7eb; }
.co-or::before { left:0; } .co-or::after { right:0; }
.co-reg-benefits { list-style:none; padding:0; margin:.75rem 0 1.25rem; }
.co-reg-benefits li { display:flex; gap:.75rem; align-items:flex-start; margin-bottom:.75rem; }
.co-reg-ico   { width:32px; height:32px; border-radius:50%; background:rgba(201,168,76,.12); display:flex; align-items:center; justify-content:center; flex-shrink:0; font-size:.9rem; }
.co-reg-benefits b { display:block; font-size:.82rem; }
.co-reg-benefits small { color:var(--co-muted); font-size:.75rem; }

/* ── Delivery grid ────────────────────────────────────────────── */
.co-del-grid     { display:grid; grid-template-columns:1fr 1fr; gap:2rem; }
.co-del-left, .co-del-right { display:flex; flex-direction:column; gap:0; }
.co-fieldset-title { font-size:.75rem; font-weight:700; letter-spacing:.5px; text-transform:uppercase; color:var(--co-dark); display:flex; align-items:center; gap:.4rem; margin-bottom:1rem; padding-bottom:.5rem; border-bottom:1px solid var(--co-border); }
.co-help { font-size:.7rem; color:var(--co-muted); cursor:help; }
.co-serviceable { display:flex; align-items:center; gap:.4rem; background:#f0fdf4; border:1px solid #bbf7d0; border-radius:6px; padding:.5rem .75rem; font-size:.78rem; color:var(--co-green); }

/* ── Recipient selector ───────────────────────────────────────── */
.co-recipient-choice { display:grid; grid-template-columns:1fr 1fr; gap:.75rem; margin-bottom:1rem; }
.co-recipient-opt input { display:none; }
.co-recipient-card {
  border:2px solid var(--co-border); border-radius:10px; padding:1rem;
  cursor:pointer; display:flex; gap:.75rem; align-items:flex-start;
  font-size:.8rem; transition:border-color .15s;
}
.co-recipient-opt input:checked + .co-recipient-card { border-color:var(--co-dark); background:#fdfaf4; }
.co-recipient-card b  { display:block; margin-bottom:.2rem; font-size:.82rem; }
.co-recipient-card small { color:var(--co-muted); font-size:.73rem; }

/* ── Delivery estimate ────────────────────────────────────────── */
.co-del-estimate { background:#fdfaf4; border:1px solid var(--co-border); border-radius:10px; padding:1rem; margin-top:1rem; }
.co-del-est-head { font-size:.72rem; font-weight:700; letter-spacing:.5px; text-transform:uppercase; display:flex; align-items:center; gap:.4rem; margin-bottom:.4rem; }
.co-del-est-date { font-size:1rem; font-weight:700; color:var(--co-green); margin-bottom:.2rem; }
.co-del-est-sub  { font-size:.8rem; color:#374151; }
.co-del-est-note { font-size:.72rem; color:var(--co-muted); margin-top:.4rem; }

/* ── KYC ──────────────────────────────────────────────────────── */
.co-kyc-header { display:flex; gap:1rem; align-items:flex-start; margin-bottom:1.25rem; }
.co-kyc-note   { background:#f0fdf4; border:1px solid #bbf7d0; border-radius:8px; padding:.75rem 1rem; font-size:.82rem; color:var(--co-green); display:flex; gap:.5rem; margin-bottom:1.25rem; }
.co-kyc-grid   { display:grid; grid-template-columns:1fr 1fr; gap:2rem; }
.co-kyc-left, .co-kyc-right { display:flex; flex-direction:column; }
.co-pan-wrap   { position:relative; }
.co-pan-input  { padding-right:2.5rem !important; }
.co-pan-check  { position:absolute; right:.75rem; top:50%; transform:translateY(-50%); color:var(--co-green); font-size:1rem; }
.co-kyc-privacy { font-size:.75rem; color:var(--co-muted); display:flex; gap:.4rem; align-items:center; margin:.75rem 0; }
.co-kyc-verified { text-align:center; padding:2rem; }
.co-kyc-items  { list-style:none; padding:0; margin:1rem 0; }
.co-kyc-item   { display:flex; align-items:center; gap:.5rem; font-size:.85rem; padding:.5rem 0; }
.co-kyc-item.done { color:var(--co-green); }
.co-kyc-tag    { background:#d1fae5; color:var(--co-green); font-size:.7rem; font-weight:600; padding:.15rem .5rem; border-radius:20px; margin-left:.5rem; }

/* ── Upload zone ──────────────────────────────────────────────── */
.co-upload-zone {
  border:2px dashed var(--co-border); border-radius:10px;
  cursor:pointer; transition:border-color .15s;
}
.co-upload-zone:hover, .co-upload-zone--active { border-color:var(--co-gold); }
.co-upload-inner { padding:2rem 1.5rem; display:flex; flex-direction:column; align-items:center; gap:.5rem; text-align:center; }
.co-upload-zone--sm .co-upload-inner { padding:1.25rem; }
.co-upload-text { font-size:.82rem; color:#374151; }
.co-upload-or   { font-size:.75rem; color:var(--co-muted); }
.co-upload-note { font-size:.72rem; color:var(--co-muted); }

/* ── Review page ──────────────────────────────────────────────── */
.co-price-update-note { background:#f9fafb; border:1px solid #e5e7eb; border-radius:8px; padding:.75rem 1rem; font-size:.8rem; color:#374151; display:flex; align-items:center; gap:.5rem; margin-bottom:1.25rem; }
.co-review-table { background:#fff; border-radius:var(--co-radius); box-shadow:var(--co-shadow); overflow:hidden; margin-bottom:1.5rem; }
.co-review-head  { display:grid; grid-template-columns:1fr 160px 60px 120px; gap:1rem; padding:.75rem 1.25rem; background:#f9fafb; font-size:.72rem; font-weight:600; letter-spacing:.5px; color:var(--co-muted); text-transform:uppercase; }
.co-review-row   { display:grid; grid-template-columns:1fr 160px 60px 120px; gap:1rem; padding:1rem 1.25rem; align-items:center; border-top:1px solid #f3f4f6; }
.co-review-product { display:flex; gap:.75rem; align-items:flex-start; }
.co-review-price { font-size:.85rem; }
.co-review-qty   { font-size:.85rem; font-weight:600; }
.co-review-sub   { font-size:.9rem; font-weight:600; }
.co-review-bottom-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:1.25rem; margin-bottom:1.5rem; }
.co-review-section { background:#fff; border-radius:var(--co-radius); padding:1.25rem; box-shadow:var(--co-shadow); }
.co-review-sec-title { font-size:.72rem; font-weight:700; letter-spacing:.5px; text-transform:uppercase; color:var(--co-dark); display:flex; align-items:center; gap:.4rem; margin-bottom:.75rem; padding-bottom:.5rem; border-bottom:1px solid var(--co-border); }
.co-review-del-name { font-weight:600; font-size:.875rem; margin-bottom:.3rem; }
.co-pay-method  { display:block; margin-bottom:.75rem; cursor:pointer; }
.co-pay-method input { display:none; }
.co-pay-method-card { border:2px solid var(--co-border); border-radius:8px; padding:.85rem; font-size:.82rem; transition:border-color .15s; }
.co-pay-method input:checked + .co-pay-method-card { border-color:var(--co-dark); background:#fdfaf4; }
.co-pay-rec-badge { background:#d1fae5; color:var(--co-green); font-size:.65rem; font-weight:600; padding:.15rem .5rem; border-radius:20px; margin-left:.4rem; }
.co-price-lock-note { background:#fffbeb; border:1px solid #fde68a; border-radius:8px; padding:1rem 1.25rem; display:flex; gap:.75rem; margin-bottom:1.5rem; font-size:.82rem; }
.co-price-lock-note p { margin:.25rem 0 0; color:var(--co-muted); }

/* ── Payment page ─────────────────────────────────────────────── */
.co-pay-header { display:flex; align-items:flex-start; justify-content:space-between; gap:1rem; margin-bottom:1.5rem; flex-wrap:wrap; }
.co-price-lock-timer { text-align:center; flex-shrink:0; }
.co-timer-label { font-size:.65rem; font-weight:700; letter-spacing:1px; text-transform:uppercase; color:var(--co-gold); display:flex; align-items:center; gap:.3rem; justify-content:center; margin-bottom:.2rem; }
.co-timer-digits { font-size:2.5rem; font-weight:800; color:var(--co-gold); letter-spacing:2px; line-height:1; }
.co-timer-sub { font-size:.72rem; color:var(--co-muted); margin-top:.3rem; }
.co-pay-tabs { display:flex; gap:0; border-bottom:2px solid var(--co-border); margin-bottom:1.5rem; }
.co-pay-tab { background:none; border:none; border-bottom:2px solid transparent; padding:.75rem 1.25rem; font-size:.82rem; font-weight:600; cursor:pointer; color:var(--co-muted); display:flex; align-items:center; gap:.5rem; margin-bottom:-2px; white-space:nowrap; transition:all .15s; }
.co-pay-tab.active  { border-bottom-color:var(--co-dark); color:var(--co-dark); }
.co-pay-tab:hover   { color:var(--co-dark); }
.co-pay-tab-badge   { background:#d1fae5; color:var(--co-green); font-size:.65rem; font-weight:600; padding:.15rem .5rem; border-radius:20px; }
.co-pay-tab-badge--alt { background:#fef3c7; color:#92400e; }
.co-bank-grid   { display:grid; grid-template-columns:1fr 260px; gap:2rem; }
.co-bank-left   {}
.co-bank-right  {}
.co-bank-rec    { background:#fffbeb; border:1px solid #fde68a; border-radius:8px; padding:.75rem 1rem; font-size:.8rem; margin-bottom:1.25rem; }
.co-bank-title  { font-size:.72rem; font-weight:700; letter-spacing:.5px; text-transform:uppercase; color:var(--co-dark); margin-bottom:.75rem; padding-bottom:.4rem; border-bottom:1px solid var(--co-border); }
.co-bank-row    { display:flex; align-items:center; gap:.75rem; padding:.5rem 0; border-bottom:1px solid #f3f4f6; font-size:.82rem; }
.co-bank-label  { width:140px; flex-shrink:0; color:var(--co-muted); font-size:.78rem; }
.co-bank-value  { flex:1; font-weight:500; }
.co-bank-note   { background:#f0fdf4; border-radius:8px; padding:.75rem 1rem; font-size:.78rem; color:var(--co-green); display:flex; gap:.4rem; margin:1rem 0; }
.co-bank-proof-grid { display:grid; grid-template-columns:1fr 1fr; gap:1rem; }
.co-submit-note { font-size:.73rem; color:var(--co-muted); text-align:center; margin-top:.4rem; }
.co-copy-btn    { background:none; border:1px solid var(--co-border); border-radius:6px; padding:.2rem .5rem; font-size:.72rem; cursor:pointer; color:var(--co-muted); display:flex; align-items:center; gap:.25rem; flex-shrink:0; }
.co-copy-btn:hover { border-color:var(--co-gold); color:var(--co-gold-dark); }
.co-copy-btn-sm { background:none; border:none; cursor:pointer; color:var(--co-muted); padding:.1rem .25rem; }
.co-copy-btn-sm:hover { color:var(--co-gold-dark); }
.co-qr-box     { background:#fff; border:1px solid var(--co-border); border-radius:var(--co-radius); padding:1.25rem; text-align:center; }
.co-qr-title   { font-size:.72rem; font-weight:700; letter-spacing:.5px; text-transform:uppercase; margin-bottom:.5rem; }
.co-qr-img     { width:140px; height:140px; margin:.75rem auto; display:flex; align-items:center; justify-content:center; }
.co-qr-upi     { font-size:.8rem; color:#374151; margin-bottom:.75rem; }
.co-qr-howto   { text-align:left; font-size:.78rem; margin-bottom:.75rem; }
.co-qr-howto b { display:block; margin-bottom:.4rem; }
.co-qr-howto ol { padding-left:1.25rem; margin:0; }
.co-qr-howto li { margin-bottom:.25rem; color:var(--co-muted); }

/* ── Razorpay tab ─────────────────────────────────────────────── */
.co-rzp-grid  { display:grid; grid-template-columns:1fr 260px; gap:2rem; margin-top:1rem; }
.co-rzp-method { display:block; margin-bottom:.4rem; cursor:pointer; }
.co-rzp-method input { display:none; }
.co-rzp-method-inner { display:flex; justify-content:space-between; align-items:center; border:1.5px solid var(--co-border); border-radius:8px; padding:.65rem 1rem; font-size:.82rem; transition:all .15s; }
.co-rzp-method.active .co-rzp-method-inner,
.co-rzp-method input:checked + .co-rzp-method-inner { border-color:var(--co-dark); background:#fdfaf4; }
.co-rzp-method-label { display:flex; align-items:center; gap:.4rem; }
.co-rzp-charge { font-weight:600; font-size:.8rem; color:var(--co-gold-dark); }
.co-rzp-logo   { font-weight:800; color:#528ff0; font-size:1rem; margin-left:.75rem; }
.co-rzp-apps   { display:flex; justify-content:center; gap:.75rem; margin:.5rem 0; font-size:.72rem; color:var(--co-muted); }
.co-rzp-secure { font-size:.72rem; color:var(--co-muted); text-align:left; margin-top:.5rem; }
.co-rzp-secure div { margin-bottom:.2rem; }

/* ── Confirmation ─────────────────────────────────────────────── */
.co-confirm-box { background:#fff; border-radius:var(--co-radius); box-shadow:var(--co-shadow); padding:2rem; margin-bottom:1.5rem; text-align:center; }
.co-confirm-box--success { border-top:4px solid var(--co-green); }
.co-confirm-icon { width:80px; height:80px; border-radius:50%; display:flex; align-items:center; justify-content:center; margin:0 auto 1rem; }
.co-confirm-icon--pending { background:#fef3c7; }
.co-confirm-icon--success { background:#d1fae5; }
.co-confirm-title { font-family:'Playfair Display',serif; font-size:1.6rem; font-weight:700; margin-bottom:.5rem; }
.co-confirm-sub   { color:var(--co-muted); font-size:.875rem; margin-bottom:1.5rem; }
.co-confirm-meta  { display:flex; justify-content:center; gap:2rem; flex-wrap:wrap; margin-top:1.5rem; padding:1rem; background:#f9fafb; border-radius:8px; }
.co-confirm-meta-item { text-align:center; }
.co-confirm-meta-label { font-size:.72rem; text-transform:uppercase; letter-spacing:.5px; color:var(--co-muted); margin-bottom:.25rem; }
.co-confirm-meta-val   { font-weight:700; font-size:.9rem; }
.co-pay-meta-grid { display:grid; grid-template-columns:repeat(4,1fr); gap:1rem; margin:1.5rem 0; padding:1rem; background:#f9fafb; border-radius:8px; text-align:left; }
.co-pay-meta-item   { }
.co-pay-meta-label  { font-size:.72rem; text-transform:uppercase; letter-spacing:.5px; color:var(--co-muted); margin-bottom:.25rem; }
.co-pay-meta-val    { font-weight:600; font-size:.85rem; display:flex; align-items:center; gap:.3rem; }
.co-utr             { font-family:monospace; }
.co-confirm-note    { background:#f0fdf4; border-radius:8px; padding:.85rem 1rem; font-size:.8rem; color:#374151; display:flex; gap:.5rem; align-items:flex-start; margin:1.5rem 0; text-align:left; }
.co-confirm-lock-note { display:block; margin-top:.4rem; color:var(--co-muted); font-size:.72rem; }
.co-confirm-del-grid { display:grid; grid-template-columns:1fr 1fr; gap:1.5rem; margin:1.5rem 0; text-align:left; }
.co-confirm-del, .co-confirm-est { background:#f9fafb; border-radius:8px; padding:1rem; }
.co-confirm-del-title { font-size:.72rem; font-weight:700; letter-spacing:.5px; text-transform:uppercase; color:var(--co-dark); display:flex; align-items:center; gap:.4rem; margin-bottom:.6rem; }
.co-confirm-del-name { font-weight:600; font-size:.875rem; margin-bottom:.25rem; }
.co-confirm-est-date { font-size:1.1rem; font-weight:700; color:var(--co-green); margin-bottom:.25rem; }
.co-confirm-insured  { display:flex; align-items:center; gap:.35rem; font-size:.72rem; color:var(--co-green); }
.co-alt-rec-tag      { display:inline-block; background:#fef3c7; color:#92400e; font-size:.65rem; font-weight:600; padding:.15rem .5rem; border-radius:20px; margin:.25rem 0; }
.co-confirm-actions  { display:grid; grid-template-columns:repeat(4,1fr); gap:.75rem; margin:1.5rem 0; }
.co-confirm-action   { display:flex; flex-direction:column; align-items:center; gap:.4rem; padding:1rem .75rem; background:#f9fafb; border:1.5px solid var(--co-border); border-radius:10px; text-decoration:none; color:var(--co-dark); font-size:.75rem; font-weight:600; text-align:center; letter-spacing:.3px; transition:all .15s; }
.co-confirm-action:hover { border-color:var(--co-gold); background:#fdfaf4; }
.co-confirm-action--dark { background:var(--co-dark); color:#fff; border-color:var(--co-dark); }
.co-confirm-action--dark:hover { background:#2d3550; }
.co-confirm-action svg { flex-shrink:0; }
.co-confirm-action small { font-size:.65rem; font-weight:400; color:inherit; opacity:.7; }

/* ── Tracker (bank transfer) ──────────────────────────────────── */
.co-tracker { display:flex; align-items:center; justify-content:center; gap:0; margin:2rem 0; flex-wrap:wrap; }
.co-tracker-step   { display:flex; flex-direction:column; align-items:center; gap:.4rem; max-width:120px; text-align:center; }
.co-tracker-circle { width:32px; height:32px; border-radius:50%; display:flex; align-items:center; justify-content:center; font-size:.82rem; font-weight:700; flex-shrink:0; }
.co-tracker-step.done   .co-tracker-circle { background:var(--co-dark); color:#fff; }
.co-tracker-step.active .co-tracker-circle { background:var(--co-gold); color:#fff; }
.co-tracker-step:not(.done):not(.active) .co-tracker-circle { background:#f3f4f6; color:#9ca3af; border:2px solid #e5e7eb; }
.co-tracker-label  { font-size:.72rem; font-weight:600; }
.co-tracker-status { font-size:.68rem; }
.co-tracker-status.done   { color:var(--co-green); }
.co-tracker-status.active { color:var(--co-gold-dark); }
.co-tracker-line   { flex:1; height:2px; background:#e5e7eb; min-width:40px; max-width:80px; }
.co-tracker-line.active { background:var(--co-gold); }

/* ── Delivery timeline (vertical) ─────────────────────────────── */
.co-delivery-timeline { display:flex; flex-direction:column; margin:1.5rem 0; }
.co-tl-step   { display:flex; align-items:flex-start; gap:.75rem; }
.co-tl-icon   { width:28px; height:28px; border-radius:50%; display:flex; align-items:center; justify-content:center; flex-shrink:0; }
.co-tl-step--done    .co-tl-icon { background:var(--co-dark); }
.co-tl-step--active  .co-tl-icon { background:var(--co-gold); }
.co-tl-step--pending .co-tl-icon { background:#f3f4f6; border:2px solid #e5e7eb; }
.co-tl-pulse  { width:10px; height:10px; border-radius:50%; background:#fff; animation:pulse 1.5s infinite; }
.co-tl-empty  { width:10px; height:10px; border-radius:50%; background:#d1d5db; }
.co-tl-content { flex:1; padding-bottom:.75rem; }
.co-tl-label  { font-size:.82rem; font-weight:600; }
.co-tl-time   { font-size:.72rem; color:var(--co-muted); }
.co-tl-est    { font-size:.72rem; color:var(--co-muted); }
.co-tl-status.done   { color:var(--co-green); font-size:.72rem; }
.co-tl-status.active { color:var(--co-gold-dark); font-size:.72rem; }
.co-tl-line   { width:2px; background:#e5e7eb; height:20px; margin-left:14px; }
.co-tl-line--done { background:var(--co-dark); }
@keyframes pulse { 0%,100%{opacity:1}50%{opacity:.4} }

/* ── Horizontal timeline (track page) ────────────────────────── */
.co-htl { display:flex; align-items:flex-start; justify-content:space-between; margin:1.5rem 0 1rem; overflow-x:auto; padding-bottom:.5rem; }
.co-htl-step { display:flex; flex-direction:column; align-items:center; gap:.4rem; min-width:90px; text-align:center; }
.co-htl-icon { width:44px; height:44px; border-radius:50%; display:flex; align-items:center; justify-content:center; flex-shrink:0; }
.co-htl-step--done    .co-htl-icon { background:var(--co-dark); }
.co-htl-step--active  .co-htl-icon { background:var(--co-gold); }
.co-htl-step--pending .co-htl-icon { background:#f3f4f6; border:2px solid #e5e7eb; }
.co-htl-step--done    .co-htl-icon svg { stroke:#fff; }
.co-htl-step--active  .co-htl-icon svg { stroke:#fff; }
.co-htl-step--pending .co-htl-icon svg { stroke:#9ca3af; }
.co-htl-active-dot { width:14px; height:14px; border-radius:50%; background:#fff; animation:pulse 1.5s infinite; }
.co-htl-label  { font-size:.72rem; font-weight:600; }
.co-htl-time   { font-size:.65rem; color:var(--co-muted); line-height:1.4; }
.co-htl-est    { font-size:.65rem; color:var(--co-muted); }
.co-htl-status { font-size:.68rem; }
.co-htl-status--done   { color:var(--co-green); }
.co-htl-status--active { color:var(--co-gold-dark); }
.co-htl-line   { flex:1; height:2px; background:#e5e7eb; margin-top:22px; min-width:20px; }
.co-htl-line--done { background:var(--co-dark); }

/* ── Track page ───────────────────────────────────────────────── */
.co-track-header { display:flex; align-items:flex-start; justify-content:space-between; gap:1rem; margin-bottom:1rem; flex-wrap:wrap; }
.co-track-meta   { display:flex; gap:2rem; flex-wrap:wrap; }
.co-track-meta-item  { text-align:right; }
.co-track-meta-label { font-size:.68rem; text-transform:uppercase; letter-spacing:.5px; color:var(--co-muted); margin-bottom:.2rem; }
.co-track-meta-val   { font-weight:700; font-size:.9rem; display:flex; align-items:center; gap:.4rem; }
.co-track-status-msg { background:#f9fafb; border:1px solid #e5e7eb; border-radius:8px; padding:1rem 1.25rem; font-size:.82rem; color:#374151; display:flex; align-items:flex-start; gap:.75rem; justify-content:space-between; margin-bottom:1.5rem; }
.co-track-help { display:flex; align-items:center; gap:.4rem; flex-shrink:0; font-size:.78rem; color:var(--co-muted); }
.co-track-help a { color:var(--co-dark); text-decoration:none; display:flex; }
.co-track-info-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:1.5rem; }
.co-track-section    { background:#fff; border-radius:var(--co-radius); padding:1.25rem; box-shadow:var(--co-shadow); }
.co-track-sec-title  { font-size:.72rem; font-weight:700; letter-spacing:.5px; text-transform:uppercase; color:var(--co-dark); margin-bottom:1rem; padding-bottom:.5rem; border-bottom:1px solid var(--co-border); }
.co-track-item       { display:flex; gap:.75rem; align-items:flex-start; margin-bottom:.75rem; }
.co-track-item-name  { font-size:.82rem; font-weight:600; }
.co-track-item-price { font-size:.82rem; font-weight:600; margin-top:.25rem; }
.co-track-del-row    { display:flex; gap:.6rem; align-items:flex-start; margin-bottom:.75rem; }
.co-track-del-label  { font-size:.72rem; text-transform:uppercase; letter-spacing:.3px; color:var(--co-muted); margin-bottom:.2rem; }
.co-track-del-val    { font-weight:600; font-size:.82rem; }
.co-track-number     { background:#f0fdf4; border-radius:8px; padding:.75rem; font-size:.8rem; color:var(--co-green); margin-bottom:.75rem; }
.co-track-pending-msg { background:#f9fafb; border-radius:8px; padding:.75rem; font-size:.8rem; color:#374151; margin-bottom:.75rem; }
.co-track-log        { margin-top:.75rem; }
.co-track-log-item   { display:flex; gap:.6rem; align-items:flex-start; padding:.4rem 0; border-left:2px solid #e5e7eb; padding-left:.75rem; margin-left:.4rem; }
.co-track-log-item--active { border-left-color:var(--co-gold); }
.co-track-log-dot    { width:10px; height:10px; border-radius:50%; background:#e5e7eb; flex-shrink:0; margin-top:.25rem; margin-left:-1.15rem; }
.co-track-log-dot--active { background:var(--co-gold); }
.co-track-log-event  { font-size:.8rem; font-weight:600; }
.co-track-log-time   { font-size:.7rem; color:var(--co-muted); }

/* ── Responsive ───────────────────────────────────────────────── */
@media (max-width: 1024px) {
  .co-layout { grid-template-columns:1fr; }
  .co-side   { position:static; }
  .co-pay-meta-grid { grid-template-columns:1fr 1fr; }
  .co-confirm-actions { grid-template-columns:1fr 1fr; }
  .co-track-info-grid { grid-template-columns:1fr; }
}
@media (max-width: 768px) {
  .co-login-grid { grid-template-columns:1fr; }
  .co-del-grid   { grid-template-columns:1fr; }
  .co-kyc-grid   { grid-template-columns:1fr; }
  .co-review-bottom-grid { grid-template-columns:1fr; }
  .co-review-head, .co-review-row { grid-template-columns:1fr 100px 40px 100px; }
  .co-bank-grid  { grid-template-columns:1fr; }
  .co-bank-proof-grid { grid-template-columns:1fr; }
  .co-rzp-grid   { grid-template-columns:1fr; }
  .co-confirm-del-grid { grid-template-columns:1fr; }
  .co-confirm-actions { grid-template-columns:1fr 1fr; }
  .co-pay-meta-grid { grid-template-columns:1fr 1fr; }
  .co-trust-grid--4 { grid-template-columns:1fr 1fr; }
  .co-cart-head { display:none; }
  .co-cart-row { grid-template-columns:1fr; gap:.5rem; }
  .co-recipient-choice { grid-template-columns:1fr; }
  .co-track-header { flex-direction:column; }
  .co-track-meta { justify-content:flex-start; }
  .co-track-meta-item { text-align:left; }
  .co-stepper-inner { gap:0; }
  .co-step-label { display:none; }
  .co-step--active .co-step-label { display:block; }
}
@media (max-width: 480px) {
  .co-confirm-actions { grid-template-columns:1fr; }
  .co-field-row--2 { grid-template-columns:1fr; }
  .co-field-row--3 { grid-template-columns:1fr; }
  .co-htl-step { min-width:70px; }
}
.co-btn--disabled,
.co-btn:disabled{
  opacity:.45;
  cursor:not-allowed;
  pointer-events:none;
}
/* ── Pincode field with status icon ──────────────────────────── */
.co-pin-wrap{ position:relative; }
.co-pin-wrap input{ padding-right:2.4rem !important; }
.co-pin-status{
  position:absolute; right:.7rem; top:50%; transform:translateY(-50%);
  width:20px; height:20px; border-radius:50%;
  display:flex; align-items:center; justify-content:center;
  font-size:.75rem; font-weight:800; line-height:1;
}
.co-pin-status--ok{ background:#d1fae5; color:#065f46; }
.co-pin-status--error{ background:#fee2e2; color:#b91c1c; }
.co-pin-spinner{
  width:13px; height:13px; border:2px solid #e5e7eb; border-top-color:#C9A84C;
  border-radius:50%; display:block; animation:coPinSpin .6s linear infinite;
}
@keyframes coPinSpin{ to{ transform:rotate(360deg); } }

.co-pin-msg{ font-size:.74rem; margin-top:.35rem; line-height:1.4; min-height:0; }
.co-pin-msg--error{ color:#b45309; background:#fffbeb; border:1px solid #fde68a; border-radius:6px; padding:.5rem .65rem; }
.co-pin-msg--error b{ color:#92400e; }

/* ── Shipping Availability Modal ─────────────────────────────── */
.co-pin-modal-overlay{
  position:fixed; inset:0; background:rgba(26,31,46,.55); z-index:3000;
  display:none; align-items:center; justify-content:center; padding:1.5rem;
}
.co-pin-modal-overlay.active{ display:flex; }
.co-pin-modal{
  background:#fdfaf4; border-radius:18px; padding:2.25rem 2rem; max-width:460px; width:100%;
  position:relative; text-align:center; box-shadow:0 20px 60px rgba(0,0,0,.3);
  animation:coPinModalIn .25s ease;
}
@keyframes coPinModalIn{ from{ opacity:0; transform:translateY(-14px) scale(.97); } to{ opacity:1; transform:translateY(0) scale(1); } }

.co-pin-modal-close{
  position:absolute; top:1rem; right:1.1rem; background:none; border:none;
  font-size:1.05rem; cursor:pointer; color:#9ca3af;
}
.co-pin-modal-close:hover{ color:#1a1f2e; }

.co-pin-modal-icon{
  width:76px; height:76px; border-radius:50%; background:rgba(201,168,76,.14);
  display:flex; align-items:center; justify-content:center; margin:0 auto 1.1rem;
}
.co-pin-modal-title{ font-family:'Playfair Display',serif; font-size:1.5rem; font-weight:700; color:#1a1f2e; margin-bottom:.5rem; }
.co-pin-modal-divider{ color:#C9A84C; font-size:1rem; margin-bottom:1rem; }
.co-pin-modal-text{ font-size:.88rem; color:#4b5563; line-height:1.7; margin-bottom:1.25rem; }

.co-pin-modal-code{
  background:#fff3e0; border:1px solid #fcd9a8; border-radius:8px;
  padding:.7rem 1rem; font-size:.92rem; color:#9a4d0a; font-weight:600; margin-bottom:1.25rem;
}
.co-pin-modal-code b{ font-weight:800; }

.co-pin-modal-actions{ display:flex; flex-direction:column; gap:.65rem; margin-bottom:1.25rem; }
.co-pin-modal-btn{
  display:flex; align-items:center; gap:.75rem; text-align:left;
  background:#f0fdf4; border:1.5px solid #bbf7d0; border-radius:10px;
  padding:.75rem 1rem; text-decoration:none; color:#1a1f2e; transition:transform .15s;
}
.co-pin-modal-btn:hover{ transform:translateY(-2px); }
.co-pin-modal-btn b{ display:block; font-size:.85rem; color:#065f46; }
.co-pin-modal-btn small{ font-size:.78rem; color:#374151; }
.co-pin-modal-btn--wa{ background:#f0fdf4; border-color:#bbf7d0; }

.co-pin-modal-note{
  display:flex; align-items:center; justify-content:center; gap:.4rem;
  font-size:.76rem; color:#065f46; margin-bottom:1.25rem;
}

.co-pin-modal-continue{
  width:100%; background:none; border:1.5px solid #C9A84C; color:#9a7a20;
  font-weight:700; font-size:.82rem; letter-spacing:.4px;
  padding:.7rem; border-radius:8px; cursor:pointer; transition:all .2s;
}
.co-pin-modal-continue:hover{ background:#C9A84C; color:#fff; }

@media (max-width:480px){
  .co-pin-modal{ padding:1.75rem 1.25rem; }
  .co-pin-modal-title{ font-size:1.25rem; }
}
.co-sum-free{
  color:#1a6b4a;
  font-weight:700;
}
#stateSelect:disabled{
  background:#f3f4f6;
  color:#374151;
  cursor:not-allowed;
  opacity:1; /* override default browser dimming so it stays readable */
}
.co-summary-title{
  font-size:.8rem; font-weight:700; letter-spacing:.5px; text-transform:uppercase;
  color:#1a1f2e; margin-bottom:1rem;
}
.co-summary-count{ font-weight:500; color:#6b7280; text-transform:none; letter-spacing:0; }

.co-summary-item{
  display:flex;
  align-items:flex-start;
  gap:.75rem;
  padding:.85rem 0;
  border-bottom:1px solid #f0ece0;
}
.co-summary-item:first-of-type{ padding-top:0; }

.co-summary-item-img{
  width:60px;
  height:60px;
  flex-shrink:0;
  border-radius:8px;
  overflow:hidden;
  background:#faf8f4;
  display:flex;
  align-items:center;
  justify-content:center;
}
.co-summary-item-img img{
  width:100%;
  height:100%;
  object-fit:contain;
  padding:4px;
}

.co-summary-item-info{ flex:1; min-width:0; }
.co-summary-item-name{
  font-size:.82rem; font-weight:700; color:#1a1f2e;
  line-height:1.3; margin-bottom:.15rem;
  overflow:hidden; text-overflow:ellipsis; white-space:nowrap;
}
.co-summary-item-meta{ font-size:.7rem; color:#9a7a20; margin-bottom:.15rem; }
.co-summary-item-qty{ font-size:.72rem; color:#6b7280; }

.co-summary-item-price{
  font-size:.82rem; font-weight:700; color:#1a1f2e;
  white-space:nowrap; flex-shrink:0;
}

.co-summary-divider{ border-top:1px solid #e8dfc8; margin:1rem 0; }

.pv-card{ max-width:800px; }
.pv-title{ font-family:'Playfair Display',serif; font-size:1.7rem; font-weight:700; color:#1a1f2e; margin-bottom:.4rem; }
.pv-sub{ font-size:.9rem; color:#6b7280; margin-bottom:1.5rem; }

.pv-status-box{
  background:#f0f4f0;
  border-radius:14px;
  padding:2.5rem 2rem;
  text-align:center;
}

.pv-icon-circle{
  width:88px; height:88px; border-radius:50%;
  background:rgba(201,168,76,.15);
  display:flex; align-items:center; justify-content:center;
  margin:0 auto 1.25rem;
}
.pv-status-title{ font-family:'Playfair Display',serif; font-size:1.35rem; font-weight:700; color:#1a1f2e; margin-bottom:.35rem; }
.pv-status-sub{ font-size:.85rem; color:#6b7280; margin-bottom:2rem; }

/* ── 4-step tracker ───────────────────────────────────────────── */
.pv-tracker{ position:relative; margin-bottom:2rem; text-align:left; }
.pv-tracker-line{
  position:absolute; top:6px; left:0; right:0; height:2px; background:#d1d5db;
  z-index:0;
}
.pv-tracker-line-fill{ height:100%; background:#C9A84C; transition:width .3s; }

.pv-tracker-steps{ display:flex; justify-content:space-between; position:relative; z-index:1; }
.pv-step{ display:flex; flex-direction:column; align-items:center; text-align:center; flex:1; }
.pv-step-dot{
  width:14px; height:14px; border-radius:50%; background:#d1d5db;
  border:3px solid #f0f4f0; margin-bottom:.6rem;
}
.pv-step--done .pv-step-dot{ background:#C9A84C; }
.pv-step--active .pv-step-dot{ background:#C9A84C; box-shadow:0 0 0 4px rgba(201,168,76,.25); }

.pv-step-label{ font-size:.8rem; font-weight:700; color:#1a1f2e; margin-bottom:.2rem; }
.pv-step-state{ font-size:.7rem; color:#9ca3af; }
.pv-step-state--done{ color:#1a6b4a; font-weight:600; }
.pv-step-state--active{ color:#9a7a20; font-weight:600; }

@media (max-width:600px){
  .pv-step-label{ font-size:.68rem; }
  .pv-step-state{ font-size:.62rem; }
}

/* ── Note callout ─────────────────────────────────────────────── */
.pv-note{
  display:flex; align-items:flex-start; gap:.75rem;
  background:#fdfaf4; border:1px solid #ecdfc4; border-radius:10px;
  padding:1rem 1.25rem; text-align:left;
  font-size:.82rem; color:#4b5563; line-height:1.6;
  margin-bottom:1.5rem;
}
.pv-note svg{ flex-shrink:0; margin-top:.15rem; }

/* ── Info grid ────────────────────────────────────────────────── */
.pv-info-grid{
  display:grid; grid-template-columns:repeat(3,1fr); gap:1rem;
  border:1px solid #e5e7eb; border-radius:10px; padding:1.25rem;
  background:#fff;
}
.pv-info-item{ display:flex; flex-direction:column; gap:.3rem; }
.pv-info-label{ font-size:.72rem; color:#9ca3af; font-weight:600; }
.pv-info-val{ font-size:.88rem; font-weight:700; color:#1a1f2e; }
.pv-info-val--gold{ color:#9a7a20; }

@media (max-width:600px){
  .pv-info-grid{ grid-template-columns:1fr; }
}

/* ── Back button ──────────────────────────────────────────────── */
.pv-back-btn{
  display:inline-flex; align-items:center; gap:.5rem;
  margin-top:1.5rem;
  background:#fff; border:1.5px solid #d1d5db; color:#1a1f2e;
  text-decoration:none; font-size:.8rem; font-weight:700;
  padding:.7rem 1.5rem; border-radius:8px; transition:all .2s;
}
.pv-back-btn:hover{ border-color:#C9A84C; color:#9a7a20; }


.oc-success-banner{
  position:relative; overflow:hidden;
  display:flex; align-items:flex-start; gap:1.25rem;
  background:#f0f4f0; border-radius:14px; padding:2rem;
  margin-bottom:1.5rem;
}
.oc-success-icon{
  width:60px; height:60px; border-radius:50%; background:#fff;
  border:2px solid #1a6b4a; display:flex; align-items:center; justify-content:center;
  flex-shrink:0;
}
.oc-success-title{ font-family:'Playfair Display',serif; font-size:1.5rem; font-weight:700; color:#1a1f2e; margin-bottom:.3rem; }
.oc-success-sub{ font-size:.9rem; color:#374151; font-weight:600; }
.oc-success-sub2{ font-size:.85rem; color:#6b7280; }
.oc-success-deco{ position:absolute; right:1.5rem; top:1rem; font-size:2rem; color:rgba(201,168,76,.2); }

.oc-detail-strip{
  display:grid; grid-template-columns:repeat(4,1fr); gap:1rem;
  background:#fff; border:1px solid #e5e7eb; border-radius:12px;
  padding:1.25rem; margin-bottom:1.5rem;
}
.oc-detail-item{ display:flex; align-items:flex-start; gap:.6rem; }
.oc-detail-label{ display:block; font-size:.68rem; color:#9ca3af; font-weight:600; margin-bottom:.15rem; }
.oc-detail-val{ display:flex; align-items:center; gap:.3rem; font-size:.82rem; font-weight:700; color:#1a1f2e; }
.oc-detail-badge{ background:#fff3e0; color:#9a4d0a; font-size:.6rem; font-weight:700; padding:.1rem .45rem; border-radius:10px; margin-left:.3rem; }
.oc-copy-btn{ background:none; border:none; color:#9ca3af; cursor:pointer; font-size:.85rem; }
.oc-copy-btn:hover{ color:#C9A84C; }

@media (max-width:900px){ .oc-detail-strip{ grid-template-columns:repeat(2,1fr); } }
@media (max-width:560px){ .oc-detail-strip{ grid-template-columns:1fr; } }

.oc-price-lock{
  display:flex; align-items:center; justify-content:space-between; flex-wrap:wrap; gap:.75rem;
  background:#f0f9f0; border:1px solid #cfe8cf; border-radius:10px;
  padding:1rem 1.25rem; margin:1.5rem 0;
  font-size:.85rem; color:#1a4d2e;
}
.oc-price-lock > div:first-child{ display:flex; align-items:center; gap:.6rem; }
.oc-price-lock-badge{
  display:flex; align-items:center; gap:.35rem;
  background:#fff; border:1px solid #cfe8cf; border-radius:20px;
  padding:.3rem .75rem; font-size:.7rem; font-weight:700; color:#1a6b4a; white-space:nowrap;
}

.oc-delivery-grid{ display:grid; grid-template-columns:1fr 1fr; gap:1rem; margin-bottom:1.5rem; }
@media (max-width:768px){ .oc-delivery-grid{ grid-template-columns:1fr; } }
.oc-delivery-box{ background:#fff; border:1px solid #e5e7eb; border-radius:12px; padding:1.25rem; }
.oc-delivery-row{ display:flex; gap:.75rem; }
.oc-delivery-row--alt{ margin-top:1rem; padding-top:1rem; border-top:1px solid #f0ece0; }
.oc-delivery-label{ display:block; font-size:.7rem; color:#9ca3af; font-weight:600; margin-bottom:.25rem; }
.oc-delivery-tag{ background:#f3f4f6; color:#4b5563; font-size:.6rem; font-weight:700; padding:.1rem .4rem; border-radius:8px; margin-left:.3rem; }
.oc-delivery-name{ font-size:.85rem; font-weight:700; color:#1a1f2e; }
.oc-delivery-sub{ font-size:.78rem; color:#6b7280; line-height:1.5; }
.oc-insured-badge{
  display:inline-flex; align-items:center; gap:.3rem; margin-top:.5rem;
  background:#f0f9f0; color:#1a6b4a; font-size:.68rem; font-weight:600;
  padding:.25rem .6rem; border-radius:20px;
}

.oc-actions{ display:grid; grid-template-columns:repeat(4,1fr); gap:.85rem; margin-bottom:2rem; }
@media (max-width:900px){ .oc-actions{ grid-template-columns:repeat(2,1fr); } }
@media (max-width:560px){ .oc-actions{ grid-template-columns:1fr; } }
.oc-action-btn{
  display:flex; align-items:center; gap:.65rem;
  background:#fff; border:1.5px solid #e5e7eb; border-radius:10px;
  padding:.9rem 1rem; text-decoration:none; color:#1a1f2e;
  transition:border-color .2s, transform .2s;
}
.oc-action-btn:hover{ border-color:#C9A84C; transform:translateY(-2px); }
.oc-action-btn b{ display:block; font-size:.8rem; }
.oc-action-btn small{ font-size:.7rem; color:#6b7280; }
.oc-action-btn--dark{ background:#1a1f2e; border-color:#1a1f2e; color:#fff; }
.oc-action-btn--dark small{ color:rgba(255,255,255,.65); }
.oc-action-btn--dark:hover{ background:#C9A84C; border-color:#C9A84C; }

.oc-trust-strip{
  display:grid; grid-template-columns:repeat(4,1fr); gap:1rem;
  background:#fdfaf4; border-radius:12px; padding:1.25rem; margin-bottom:1.5rem;
}
@media (max-width:768px){ .oc-trust-strip{ grid-template-columns:repeat(2,1fr); } }
.oc-trust-item{ display:flex; align-items:center; gap:.6rem; }
.oc-trust-item b{ display:block; font-size:.78rem; }
.oc-trust-item small{ font-size:.68rem; color:#6b7280; }


.trk-header{
  display:grid; grid-template-columns:repeat(4,1fr); gap:1rem; align-items:start;
  background:#fff; border:1px solid #e5e7eb; border-radius:12px;
  padding:1.25rem; margin-bottom:1.5rem;
}
@media (max-width:900px){ .trk-header{ grid-template-columns:1fr 1fr; } }
@media (max-width:560px){ .trk-header{ grid-template-columns:1fr; } }
.trk-header-item--right{ text-align:right; }
@media (max-width:900px){ .trk-header-item--right{ text-align:left; } }
.trk-label{ display:block; font-size:.68rem; color:#9ca3af; font-weight:600; margin-bottom:.2rem; }
.trk-val{ font-size:.9rem; font-weight:700; color:#1a1f2e; display:flex; align-items:center; gap:.4rem; }
.trk-header-item--right .trk-val{ justify-content:flex-end; }
@media (max-width:900px){ .trk-header-item--right .trk-val{ justify-content:flex-start; } }
.trk-val--gold{ color:#9a7a20; font-size:1.1rem; }
.trk-verified-badge{ background:#d1fae5; color:#065f46; font-size:.6rem; font-weight:700; padding:.1rem .4rem; border-radius:10px; }
.trk-invoice-link{ font-size:.72rem; color:#C9A84C; text-decoration:none; font-weight:600; }

.trk-status-note{
  display:flex; align-items:center; gap:.6rem; flex-wrap:wrap;
  background:#fff8ec; border:1px solid #f3d9a4; border-radius:10px;
  padding:1rem 1.25rem; margin:1.5rem 0; font-size:.84rem; color:#4b5563;
}
.trk-status-note span{ flex:1; }
.trk-contact-link{ display:flex; align-items:center; gap:.4rem; color:#1a6b4a; text-decoration:none; font-size:.8rem; font-weight:600; white-space:nowrap; }

.trk-grid{ display:grid; grid-template-columns:1fr 1fr 1fr; gap:1rem; margin-bottom:1.5rem; }
@media (max-width:900px){ .trk-grid{ grid-template-columns:1fr; } }
.trk-box{ background:#fff; border:1px solid #e5e7eb; border-radius:12px; padding:1.25rem; }
.trk-box-title{ font-size:.85rem; font-weight:700; color:#1a1f2e; margin-bottom:1rem; }
.trk-box-count{ font-weight:500; color:#9ca3af; }

.trk-item{ display:flex; gap:.65rem; padding:.65rem 0; border-bottom:1px solid #f0ece0; }
.trk-item:last-of-type{ border-bottom:none; }
.trk-item-img{ width:48px; height:48px; flex-shrink:0; border-radius:8px; background:#faf8f4; display:flex; align-items:center; justify-content:center; }
.trk-item-img img{ width:100%; height:100%; object-fit:contain; padding:3px; }
.trk-item-info{ flex:1; min-width:0; }
.trk-item-name{ font-size:.78rem; font-weight:700; color:#1a1f2e; }
.trk-item-meta{ font-size:.68rem; color:#9a7a20; }
.trk-item-qty{ font-size:.7rem; color:#6b7280; }
.trk-item-price{ font-size:.78rem; font-weight:700; color:#1a1f2e; white-space:nowrap; }
.trk-view-details{ display:block; text-align:center; margin-top:1rem; font-size:.72rem; font-weight:700; color:#1a1f2e; text-decoration:none; }
.trk-view-details:hover{ color:#C9A84C; }

.trk-delivery-row{ display:flex; gap:.6rem; padding:.5rem 0; }
.trk-delivery-row--border{ border-top:1px solid #f0ece0; padding-top:.85rem; margin-top:.35rem; }

.trk-mini-note{
  display:flex; gap:.6rem; align-items:flex-start;
  background:#fff8ec; border-radius:8px; padding:.75rem 1rem; margin-bottom:1rem;
}
.trk-mini-note b{ display:block; font-size:.78rem; color:#1a1f2e; }
.trk-mini-note small{ font-size:.68rem; color:#6b7280; }

.trk-mini-timeline{ margin-bottom:1rem; }
.trk-mini-row{ display:flex; align-items:center; gap:.6rem; padding:.5rem 0; border-bottom:1px solid #f0ece0; }
.trk-mini-row:last-child{ border-bottom:none; }
.trk-mini-dot{ width:8px; height:8px; border-radius:50%; background:#d1d5db; flex-shrink:0; }
.trk-mini-row--active .trk-mini-dot{ background:#C9A84C; box-shadow:0 0 0 3px rgba(201,168,76,.2); }
.trk-mini-row--active .trk-mini-label{ color:#9a7a20; font-weight:700; }
.trk-mini-label{ flex:1; font-size:.78rem; color:#374151; }
.trk-mini-time{ font-size:.7rem; color:#9ca3af; }

.trk-notify-btn{
  width:100%; background:#fff; border:1.5px solid #d1d5db; color:#1a1f2e;
  font-size:.78rem; font-weight:700; padding:.7rem; border-radius:8px;
  display:flex; align-items:center; justify-content:center; gap:.5rem; cursor:pointer;
  transition:border-color .2s;
}
.trk-notify-btn:hover{ border-color:#C9A84C; color:#9a7a20; }


.opt-tracker{ position:relative; padding:1rem 0 .5rem; }
.opt-line-bg{
  position:absolute; top:26px; left:6%; right:6%; height:2px; background:#e5e7eb; z-index:0;
}
.opt-line-fill{
  position:absolute; top:26px; left:6%; height:2px; background:#1a6b4a;
  transition:width .4s; z-index:0; max-width:88%;
}

.opt-steps{ display:flex; justify-content:space-between; position:relative; z-index:1; }
.opt-step{ display:flex; flex-direction:column; align-items:center; text-align:center; flex:1; padding:0 .25rem; }

.opt-step-icon{
  width:52px; height:52px; border-radius:50%;
  display:flex; align-items:center; justify-content:center;
  margin-bottom:.6rem; background:#fff; border:2px solid #d1d5db; color:#9ca3af;
}
.opt-step--done .opt-step-icon{ background:#1a6b4a; border-color:#1a6b4a; color:#fff; }
.opt-step--active .opt-step-icon{ background:#1a1f2e; border-color:#1a1f2e; color:#fff; }
.opt-step--pending .opt-step-icon{ background:#fff7ec; border-color:#f3d9a4; color:#C9A84C; }

.opt-step-label{ font-size:.78rem; font-weight:700; color:#1a1f2e; margin-bottom:.15rem; }
.opt-step-time{ font-size:.68rem; color:#9ca3af; margin-bottom:.15rem; min-height:1em; }
.opt-step-state{ font-size:.68rem; font-weight:600; }
.opt-step-state--done{ color:#1a6b4a; }
.opt-step-state--active{ color:#9a7a20; }
.opt-step-state--pending{ color:#9ca3af; }

@media (max-width:900px){
  .opt-step-label{ font-size:.66rem; }
  .opt-step-time, .opt-step-state{ font-size:.6rem; }
  .opt-step-icon{ width:40px; height:40px; }
}
@media (max-width:600px){
  .opt-tracker{ overflow-x:auto; }
  .opt-steps{ min-width:640px; }
}
.trk-breadcrumb{
  font-size:.8rem; color:#6b7280; margin-bottom:1.25rem;
  display:flex; align-items:center; gap:.5rem;
}
.trk-breadcrumb a{ color:#6b7280; text-decoration:none; }
.trk-breadcrumb a:hover{ color:#9a7a20; }
.trk-breadcrumb-active{ color:#C9A84C; font-weight:600; }
.pe-selling-price{ font-weight:700; color:#1a6b4a; font-size:.85rem; white-space:nowrap; }
.btg-overlay{
  position:fixed; inset:0; background:rgba(26,31,46,.6); z-index:3000;
  display:none; align-items:flex-start; justify-content:center;
  padding:2rem 1rem; overflow-y:auto;
}
.btg-overlay.active{ display:flex; }
.btg-modal{
  background:#fdfaf4; border-radius:18px; padding:2rem;
  max-width:1100px; width:100%; position:relative;
  box-shadow:0 20px 60px rgba(0,0,0,.3);
}
.btg-close{ position:absolute; top:1.25rem; right:1.5rem; background:none; border:none; font-size:1.2rem; cursor:pointer; color:#6b7280; }
.btg-close:hover{ color:#1a1f2e; }

.btg-header h2{ font-family:'Playfair Display',serif; font-size:1.6rem; font-weight:700; color:#1a1f2e; display:flex; align-items:center; gap:.75rem; flex-wrap:wrap; }
.btg-rec-badge{ background:#fff3e0; color:#9a4d0a; font-size:.68rem; font-weight:700; padding:.25rem .7rem; border-radius:20px; }
.btg-header p{ font-size:.9rem; color:#6b7280; margin:.5rem 0 1.5rem; max-width:700px; }

.btg-secure-note{
  display:flex; gap:.75rem; align-items:flex-start;
  background:#f0f9f0; border:1px solid #cfe8cf; border-radius:10px;
  padding:1rem 1.25rem; margin-bottom:1.5rem; font-size:.85rem; color:#1a4d2e;
}

.btg-compare-grid{ display:grid; grid-template-columns:1fr 1fr; gap:1.25rem; margin-bottom:1.5rem; }
@media (max-width:768px){ .btg-compare-grid{ grid-template-columns:1fr; } }
.btg-compare-col{ background:#fff; border-radius:12px; padding:1.5rem; border:1px solid #ecdfc4; }
.btg-compare-head{ display:flex; align-items:center; gap:.75rem; margin-bottom:1.25rem; }
.btg-compare-icon{ width:44px; height:44px; border-radius:50%; display:flex; align-items:center; justify-content:center; font-size:1.2rem; }
.btg-compare-icon--red{ background:#fee2e2; }
.btg-compare-icon--green{ background:#d1fae5; }
.btg-compare-col--without b{ color:#b91c1c; font-size:1rem; }
.btg-compare-col--with b{ color:#166534; font-size:1rem; }
.btg-compare-list{ list-style:none; padding:0; margin:0; }
.btg-compare-list li{ font-size:.85rem; color:#374151; padding:.6rem 0; border-bottom:1px solid #f3f4f6; padding-left:1.6rem; position:relative; }
.btg-compare-list li:last-child{ border-bottom:none; }
.btg-compare-list li small{ display:block; color:#9ca3af; font-size:.75rem; margin-top:.15rem; }
.btg-x::before{ content:'✕'; position:absolute; left:0; color:#dc3545; font-weight:700; }
.btg-check::before{ content:'✓'; position:absolute; left:0; color:#16a34a; font-weight:700; }

.btg-details-grid{ display:grid; grid-template-columns:2fr 1fr; gap:1.25rem; margin-bottom:1.5rem; }
@media (max-width:768px){ .btg-details-grid{ grid-template-columns:1fr; } }
.btg-bank-card, .btg-qr-card{ background:#fff; border:1px solid #ecdfc4; border-radius:12px; padding:1.5rem; }
.btg-bank-card h3, .btg-qr-card h3, .btg-steps-card h3, .btg-help-card h3{ font-size:.95rem; font-weight:700; color:#1a1f2e; margin-bottom:1.1rem; }
.btg-bank-row{ display:flex; align-items:center; gap:.75rem; padding:.75rem 0; border-bottom:1px solid #f3f4f6; }
.btg-bank-row:last-of-type{ border-bottom:none; }
.btg-bank-label{ font-size:.78rem; color:#6b7280; width:140px; flex-shrink:0; }
.btg-bank-val{ font-size:.88rem; font-weight:700; color:#1a1f2e; flex:1; }
.btg-copy-btn{ display:flex; align-items:center; gap:.3rem; background:#f9fafb; border:1px solid #e5e7eb; color:#374151; font-size:.68rem; font-weight:700; padding:.3rem .6rem; border-radius:6px; cursor:pointer; }
.btg-copy-btn:hover{ border-color:#C9A84C; color:#9a7a20; }
.btg-bank-note{ display:flex; align-items:center; gap:.5rem; font-size:.75rem; color:#6b7280; margin-top:.75rem; }

.btg-qr-card{ text-align:center; }
.btg-qr-img{ width:150px; height:150px; margin:0 auto 1rem; background:#fff; border:1px solid #e5e7eb; border-radius:8px; display:flex; align-items:center; justify-content:center; }
.btg-qr-img img{ max-width:100%; max-height:100%; }
.btg-qr-card p{ font-size:.78rem; color:#6b7280; }

.btg-steps-card{ background:#fff; border:1px solid #ecdfc4; border-radius:12px; padding:1.5rem; margin-bottom:1.5rem; }
.btg-steps-row{ display:flex; align-items:flex-start; gap:1rem; }
@media (max-width:768px){ .btg-steps-row{ flex-direction:column; } }
.btg-step{ flex:1; text-align:center; }
.btg-step-icon{ position:relative; width:60px; height:60px; border-radius:50%; background:#fff7ec; border:2px solid #C9A84C; display:flex; align-items:center; justify-content:center; font-size:1.4rem; margin:0 auto .75rem; }
.btg-step-num{ position:absolute; bottom:-4px; right:-4px; width:22px; height:22px; border-radius:50%; background:#1a1f2e; color:#fff; font-size:.68rem; font-weight:700; display:flex; align-items:center; justify-content:center; }
.btg-step b{ display:block; font-size:.88rem; margin-bottom:.35rem; }
.btg-step p{ font-size:.78rem; color:#6b7280; }
.btg-step-arrow{ font-size:1.3rem; color:#d1d5db; padding-top:1.5rem; }
@media (max-width:768px){ .btg-step-arrow{ transform:rotate(90deg); padding:0; } }

.btg-action-btn{
  display:flex; flex-direction:column; align-items:center; gap:.15rem;
  width:100%; border-radius:10px; padding:1rem; margin-bottom:.85rem;
  font-size:.95rem; font-weight:700; cursor:pointer; border:none;
}
.btg-action-btn svg{ margin-bottom:.3rem; }
.btg-action-btn small{ font-weight:400; font-size:.75rem; opacity:.85; }
.btg-action-btn--primary{ background:#0d3320; color:#fff; }
.btg-action-btn--primary:hover{ background:#0a2818; }
.btg-action-btn--secondary{ background:#fff; color:#1a1f2e; border:1.5px solid #d1d5db; }
.btg-action-btn--secondary:hover{ border-color:#C9A84C; }

.btg-lock-note{
  display:flex; align-items:center; justify-content:center; gap:.5rem;
  font-size:.82rem; color:#9a4d0a; margin-bottom:1.5rem;
}

.btg-help-card{ background:#fff; border:1px solid #ecdfc4; border-radius:12px; padding:1.5rem; margin-bottom:1.5rem; }
.btg-help-row{ display:flex; align-items:center; gap:.75rem; padding:.6rem 0; text-decoration:none; color:#1a1f2e; font-size:.85rem; }
.btg-help-ico{ font-size:1.1rem; }
.btg-help-row b{ display:block; font-size:.85rem; }
.btg-help-hours{ margin-top:.75rem; padding-top:.75rem; border-top:1px solid #f3f4f6; font-size:.78rem; color:#6b7280; display:flex; align-items:flex-start; gap:.4rem; }

.btg-footer-note{
  display:flex; gap:1.5rem; flex-wrap:wrap;
  background:#fff; border:1px solid #ecdfc4; border-radius:12px;
  padding:1.1rem 1.25rem; font-size:.78rem; color:#4b5563;
}
.btg-footer-note > div{ flex:1; min-width:220px; display:flex; align-items:flex-start; gap:.5rem; }

/* ── Top banner ───────────────────────────────────────────────── */
.co-fail-banner{
  display:flex; align-items:flex-start; gap:1.5rem; flex-wrap:wrap;
  border-radius:14px; padding:1.75rem; margin-bottom:1.5rem;
}
.co-fail-banner--warning{ background:#fdf2f2; border:1px solid #f5c6c6; }
.co-fail-banner--error{ background:#fdf2f2; border:1px solid #f5c6c6; }

.co-fail-icon{
  width:64px; height:64px; border-radius:50%; flex-shrink:0;
  display:flex; align-items:center; justify-content:center;
  font-size:1.8rem; font-weight:300; border:2px solid;
}
.co-fail-icon--warning{ color:#dc3545; border-color:#dc3545; }
.co-fail-icon--error{ color:#dc3545; border-color:#dc3545; background:#fff; }

.co-fail-content{ flex:1; min-width:250px; }
.co-fail-content h2{ font-family:'Playfair Display',serif; font-size:1.5rem; font-weight:700; color:#991b1b; margin-bottom:.4rem; }
.co-fail-content p{ font-size:.88rem; color:#4b5563; line-height:1.6; }

.co-fail-timer, .co-fail-error-code{ text-align:right; flex-shrink:0; }
.co-fail-timer-label{ font-size:.65rem; font-weight:700; letter-spacing:.5px; color:#6b7280; text-transform:uppercase; margin-bottom:.3rem; }
.co-fail-timer-val{ font-size:1.6rem; font-weight:800; color:#dc3545; }
.co-fail-timer-date{ font-size:.75rem; color:#6b7280; }
.co-fail-code-badge{ display:inline-block; background:#fff; border:1px solid #f5c6c6; color:#dc3545; font-weight:700; font-size:.85rem; padding:.35rem .85rem; border-radius:8px; }

/* ── Why did this happen ─────────────────────────────────────── */
.co-fail-why{
  display:flex; gap:1.25rem; align-items:center;
  background:#fdf2f2; border-radius:12px; padding:1.5rem; margin-bottom:1.5rem;
}
.co-fail-why-ico{ width:56px; height:56px; border-radius:50%; background:#fee2e2; display:flex; align-items:center; justify-content:center; font-size:1.4rem; flex-shrink:0; }
.co-fail-why-title{ font-weight:700; color:#991b1b; font-size:.95rem; margin-bottom:.4rem; }
.co-fail-why p{ font-size:.85rem; color:#4b5563; line-height:1.6; }

/* ── Reasons box ──────────────────────────────────────────────── */
.co-fail-reasons{ background:#fdf2f2; border-radius:12px; padding:1.5rem; margin-bottom:1.5rem; }
.co-fail-reasons-title{ display:flex; align-items:center; gap:.5rem; font-weight:700; color:#991b1b; font-size:.9rem; margin-bottom:1rem; }
.co-fail-reasons p{ font-size:.85rem; color:#4b5563; margin-bottom:1rem; }
.co-fail-reasons-grid{ display:grid; grid-template-columns:repeat(3,1fr); gap:1rem; }
.co-fail-reasons-grid--2col{ grid-template-columns:1fr 1fr; }
.co-fail-reasons-grid ul{ list-style:none; padding:0; margin:0; }
.co-fail-reasons-grid li{ font-size:.82rem; color:#374151; padding:.3rem 0 .3rem 1rem; position:relative; }
.co-fail-reasons-grid li::before{ content:'•'; position:absolute; left:0; color:#dc3545; }

/* ── Divider ──────────────────────────────────────────────────── */
.co-fail-divider{ display:flex; align-items:center; gap:1rem; margin:2rem 0 1.25rem; }
.co-fail-divider::before,.co-fail-divider::after{ content:''; flex:1; height:1px; background:#e8dfc8; }
.co-fail-divider span{ font-size:.78rem; font-weight:700; letter-spacing:.5px; color:#6b7280; text-transform:uppercase; white-space:nowrap; }

/* ── Action cards ─────────────────────────────────────────────── */
.co-fail-actions-grid{ display:grid; grid-template-columns:repeat(3,1fr); gap:1rem; margin-bottom:1.5rem; }
@media (max-width:900px){ .co-fail-actions-grid{ grid-template-columns:1fr; } }
.co-fail-action-card{
  background:#fff; border:1px solid #e5e7eb; border-radius:12px; padding:1.5rem;
  display:flex; flex-direction:column; align-items:flex-start; text-align:left;
}
.co-fail-action-card--btn{ cursor:pointer; }
.co-fail-action-ico{ font-size:1.5rem; margin-bottom:.75rem; width:48px; height:48px; border-radius:50%; background:#f9fafb; display:flex; align-items:center; justify-content:center; }
.co-fail-action-card b{ font-size:.9rem; margin-bottom:.3rem; }
.co-fail-action-card p{ font-size:.8rem; color:#6b7280; margin-bottom:1rem; }
.co-fail-action-note{ font-size:.7rem; color:#9ca3af; margin-top:.5rem; }

.co-btn--gold{ background:#C9A84C; color:#fff; border:none; }
.co-btn--gold:hover{ background:#b8963f; }
.co-btn--navy{ background:#1a1f2e; color:#fff; border:none; }
.co-btn--navy:hover{ background:#2d3550; }
.co-btn--full{ width:100%; text-align:center; }

/* ── Bottom row (safe / lock timer / help) ──────────────────────── */
.co-fail-bottom-row{ display:grid; grid-template-columns:1fr 1fr; gap:1rem; margin-bottom:1.25rem; }
.co-fail-bottom-row--3col{ grid-template-columns:1fr auto 1fr; }
.co-fail-bottom-row--2col{ grid-template-columns:1fr 1fr; }
@media (max-width:768px){ .co-fail-bottom-row, .co-fail-bottom-row--3col, .co-fail-bottom-row--2col{ grid-template-columns:1fr; } }

.co-fail-safe-note, .co-fail-help-note, .co-fail-lock-note{
  display:flex; align-items:flex-start; gap:.6rem;
  background:#fff; border:1px solid #e5e7eb; border-radius:10px; padding:1rem 1.25rem;
  font-size:.82rem; color:#374151;
}
.co-fail-lock-note{ flex-direction:column; align-items:center; text-align:center; }
.co-fail-countdown{ font-size:1.6rem; font-weight:800; color:#1a6b4a; }
.co-fail-help-note{ flex-direction:column; align-items:center; text-align:center; gap:.4rem; }
.co-fail-help-note .co-btn{ margin-top:.5rem; }

/* ── Payment proof note ───────────────────────────────────────── */
.co-fail-proof-note{
  display:flex; align-items:center; gap:1rem; flex-wrap:wrap;
  background:#fff; border:1px solid #e5e7eb; border-radius:10px; padding:1.1rem 1.25rem; margin-bottom:1.5rem;
  font-size:.82rem; color:#374151;
}
.co-fail-proof-note > div{ flex:1; min-width:250px; }

/* ── KYC resolve steps ────────────────────────────────────────── */
.co-fail-resolve-card{ background:#fdfaf4; border:1px solid #ecdfc4; border-radius:12px; padding:1.5rem; margin-bottom:1.5rem; }
.co-fail-resolve-title{ font-weight:700; font-size:.9rem; margin-bottom:1.25rem; }
.co-fail-resolve-steps{ display:flex; align-items:flex-start; gap:.75rem; }
@media (max-width:768px){ .co-fail-resolve-steps{ flex-direction:column; } }
.co-fail-resolve-step{ flex:1; text-align:center; }
.co-fail-resolve-ico{ display:block; font-size:1.5rem; margin-bottom:.5rem; }
.co-fail-resolve-step b{ display:block; font-size:.82rem; margin-bottom:.2rem; }
.co-fail-resolve-step small{ font-size:.72rem; color:#6b7280; }
.co-fail-resolve-arrow{ font-size:1.2rem; color:#d1d5db; padding-top:1.5rem; }
@media (max-width:768px){ .co-fail-resolve-arrow{ transform:rotate(90deg); } }

/* ── KYC re-enter PAN ─────────────────────────────────────────── */
.co-fail-reenter-card{ background:#fff; border:1px solid #e5e7eb; border-radius:12px; padding:1.5rem; margin-bottom:1.5rem; }
.co-fail-reenter-card b{ font-size:.9rem; }
.co-fail-reenter-card p{ font-size:.8rem; color:#6b7280; margin-bottom:1rem; }
.co-fail-reenter-form{ display:flex; gap:.75rem; }
@media (max-width:600px){ .co-fail-reenter-form{ flex-direction:column; } }
.co-fail-reenter-form input{
  flex:1; border:1.5px solid #d1d5db; border-radius:8px; padding:.65rem .9rem; font-size:.88rem;
  text-transform:uppercase;
}

/* ── Contact row ──────────────────────────────────────────────── */
.co-fail-contact-row{ display:flex; gap:2rem; flex-wrap:wrap; margin-bottom:1.5rem; padding:1.25rem 0; border-top:1px solid #e5e7eb; border-bottom:1px solid #e5e7eb; }
.co-fail-contact-item{ display:flex; align-items:flex-start; gap:.65rem; text-decoration:none; color:#1a1f2e; flex:1; min-width:200px; }
.co-fail-contact-item span{ font-size:1.2rem; }
.co-fail-contact-item b{ font-size:.85rem; }
.co-fail-contact-item small{ color:#6b7280; }

/* ── Sidebar warning box (used on Price Lock Expired + KYC Failed) ── */
.co-sum-warning-box{
  background:#fdf2f2; border:1px solid #f5c6c6; border-radius:8px;
  padding:.9rem 1rem; margin:1rem 0;
}
.co-sum-warning-box b{ color:#991b1b; font-size:.78rem; letter-spacing:.3px; }
.co-sum-warning-box p{ font-size:.78rem; color:#7f1d1d; margin:.25rem 0 0; }

.co-sum-total--stale span:last-child{ color:#9ca3af; font-style:italic; }

.co-sum-lock-info{
  display:flex; gap:.6rem; align-items:flex-start;
  background:#fdfaf4; border-radius:8px; padding:.85rem 1rem; margin-top:1rem;
}
.co-sum-lock-info b{ font-size:.78rem; display:block; margin-bottom:.2rem; }

.co-summary-item--bundle{
  background:#fdfaf4; border:1px solid #ecdfc4; border-radius:10px;
  padding:.75rem; margin-bottom:.5rem; position:relative;
}
.co-bundle-badge{
  position:absolute; 
  background:#C9A84C; color:#fff; font-size:.62rem; font-weight:700;
  padding:.15rem .55rem; border-radius:20px; letter-spacing:.3px;
}
.co-summary-item--bundle .co-summary-item-name{ margin-top:.4rem; font-weight:700; }
.co-summary-item--bundle .co-summary-item-meta{ font-size:.7rem; color:#6b7280; }
.co-sum-bundle-note{
  background:#f0f9f0; border:1px solid #cfe8cf; border-radius:8px;
  padding:.65rem .85rem; margin:.5rem 0; font-size:.78rem; color:#1a4d2e;
}
.combo-set-form{ display:flex !important; flex-direction:column !important; align-items:center !important; gap:4px !important; }
.combo-set-stepper{ display:flex !important; flex-direction:row !important; align-items:center !important; gap:0 !important; border:1px solid #d1d5db; border-radius:8px; overflow:hidden; width:fit-content; }
.combo-set-btn{ display:flex !important; align-items:center !important; justify-content:center !important; width:28px; height:28px; border:none; background:#f9fafb; color:#1a1f2e; font-size:14px; font-weight:700; cursor:pointer; line-height:1; padding:0 !important; margin:0 !important; }
.combo-set-btn:hover{ background:#f0ece0; }
.combo-set-input{ width:32px; height:28px; border:none; border-left:1px solid #d1d5db; border-right:1px solid #d1d5db; text-align:center; font-size:13px; font-weight:700; padding:0 !important; margin:0 !important; background:#fff; }
.combo-set-label{ font-size:11px; color:#6b7280; white-space:nowrap; }

.co-sum-bundle-note{ background:#f0f9f0; border:1px solid #cfe8cf; border-radius:8px; padding:.65rem .85rem; margin:.5rem 0; font-size:.78rem; color:#1a4d2e; }