:root {
  --tcc-ac: #7c3aed; --tcc-ac2: #f58529; --tcc-tx: #1a1033; --tcc-ts: #6b7280; --tcc-tm: #9ca3af;
  --tcc-bd: #e5e7eb; --tcc-ag: rgba(124,58,237,.08); --tcc-bg: #faf9f5;
  --tcc-rad: 16px; --tcc-sh: 0 4px 14px -6px rgba(15,15,17,.08);
  --tcc-fh: 'Rubik', 'Inter', -apple-system, sans-serif;
  --tcc-fb: 'Nunito', -apple-system, sans-serif;
}
body.sf24-tcc-page { background:var(--tcc-bg) !important; }
.sf24-tcc { font-family:var(--tcc-fb); color:var(--tcc-tx); padding:24px 22px 80px; min-height:100vh; box-sizing:border-box; }
.sf24-tcc *, .sf24-tcc *::before, .sf24-tcc *::after { box-sizing:border-box; }
.sf24-tcc-container { max-width:1200px; margin:0 auto; }

/* HERO */
.sf24-tcc-hero { display:flex; align-items:center; justify-content:space-between; gap:16px; margin-bottom:24px; flex-wrap:wrap; }
.sf24-tcc-hero-left { display:flex; flex-direction:column; gap:6px; }
.sf24-tcc-eyebrow { display:inline-flex; align-items:center; gap:7px; align-self:flex-start; padding:5px 11px; background:var(--tcc-ag); border:1px solid rgba(124,58,237,.18); border-radius:999px; font-size:11.5px; font-weight:800; letter-spacing:.06em; text-transform:uppercase; color:var(--tcc-ac); }
.sf24-tcc-pulse { display:inline-block; width:6px; height:6px; border-radius:50%; background:#10b981; box-shadow:0 0 0 0 rgba(16,185,129,.5); animation:sf24-tcc-pulse 1.6s ease-out infinite; }
@keyframes sf24-tcc-pulse { 0% { box-shadow:0 0 0 0 rgba(16,185,129,.5); } 70% { box-shadow:0 0 0 7px rgba(16,185,129,0); } 100% { box-shadow:0 0 0 0 rgba(16,185,129,0); } }
.sf24-tcc-h1 { font-family:var(--tcc-fh); font-size:28px; font-weight:800; letter-spacing:-.02em; margin:0; line-height:1.15; color:var(--tcc-tx); }
.sf24-tcc-back { display:inline-flex; align-items:center; gap:6px; padding:9px 14px; background:#fff; border:1px solid var(--tcc-bd); border-radius:999px; font-size:13px; font-weight:600; color:var(--tcc-tx); text-decoration:none; transition:all .2s; }
.sf24-tcc-back:hover { border-color:var(--tcc-ac); color:var(--tcc-ac); transform:translateX(-2px); }

/* LAYOUT */
.sf24-tcc-layout { display:grid; grid-template-columns:1fr 360px; gap:24px; align-items:start; }
@media (max-width:920px) { .sf24-tcc-layout { grid-template-columns:1fr; } }

/* ITEMS */
.sf24-tcc-items-col { min-width:0; }
.sf24-tcc-items { list-style:none; margin:0; padding:0; display:flex; flex-direction:column; gap:12px; }
.sf24-tcc-item { display:grid; grid-template-columns:104px 1fr; gap:14px; padding:14px; background:#fff; border:1px solid var(--tcc-bd); border-radius:var(--tcc-rad); box-shadow:var(--tcc-sh); transition:border-color .2s, box-shadow .2s, opacity .25s; position:relative; }
.sf24-tcc-item:hover { border-color:rgba(124,58,237,.3); box-shadow:0 8px 22px -10px rgba(124,58,237,.18); }
.sf24-tcc-item.is-removing { opacity:.4; transform:scale(.98); transition:opacity .25s, transform .25s; }
.sf24-tcc-item[data-upsell="1"] { background:linear-gradient(135deg, #fff 0%, #fffbf5 100%); border-color:rgba(245,133,41,.25); }
.sf24-tcc-item-img { display:block; aspect-ratio:1; border-radius:12px; overflow:hidden; background:linear-gradient(135deg,rgba(124,58,237,.05),rgba(245,133,41,.04)); padding:8px; position:relative; flex-shrink:0; }
.sf24-tcc-item-img img { width:100%; height:100%; object-fit:contain; }
.sf24-tcc-item-upsell-tag { position:absolute; top:5px; left:5px; padding:2px 7px; background:linear-gradient(135deg,#f58529,#dd2a7b); color:#fff; border-radius:999px; font-size:9px; font-weight:900; letter-spacing:.06em; box-shadow:0 2px 6px rgba(245,133,41,.4); }
.sf24-tcc-item-body { display:flex; flex-direction:column; gap:6px; min-width:0; }
.sf24-tcc-item-name { font-family:var(--tcc-fh); font-size:15px; font-weight:700; line-height:1.3; margin:0; letter-spacing:-.005em; }
.sf24-tcc-item-name a { color:var(--tcc-tx); text-decoration:none; }
.sf24-tcc-item-name a:hover { color:var(--tcc-ac); }
.sf24-tcc-item-meta { font-size:12px; color:var(--tcc-ts); font-weight:500; }
.sf24-tcc-item-link { display:inline-flex; align-items:center; gap:5px; padding:3px 9px; background:var(--tcc-ag); border-radius:6px; color:var(--tcc-ac); font-size:11.5px; font-weight:600; max-width:100%; border:0; }
.sf24-tcc-item-link svg { color:var(--tcc-ac); flex-shrink:0; opacity:.85; }
.sf24-tcc-item-link span { white-space:nowrap; overflow:hidden; text-overflow:ellipsis; min-width:0; max-width:240px; }
.sf24-tcc-item-photos { font-size:11.5px; color:var(--tcc-ts); font-weight:600; }
.sf24-tcc-item-comment { font-size:12px; color:var(--tcc-ts); font-style:italic; line-height:1.4; }
.sf24-tcc-item-foot { display:flex; align-items:center; justify-content:space-between; gap:10px; margin-top:auto; padding-top:8px; flex-wrap:wrap; }

.sf24-tcc-qty-display { display:inline-flex; align-items:baseline; gap:2px; padding:6px 12px; background:var(--tcc-ag); border:1px solid rgba(124,58,237,.18); border-radius:8px; font-family:var(--tcc-fh); font-size:13.5px; font-weight:800; color:var(--tcc-ac); letter-spacing:-.01em; line-height:1; font-variant-numeric:tabular-nums; }
.sf24-tcc-qty-display .sf24-tcc-qty-x { font-size:11px; font-weight:600; opacity:.7; margin-right:2px; }
.sf24-tcc-item-price { display:flex; flex-direction:column; align-items:flex-end; gap:1px; line-height:1.2; }
.sf24-tcc-item-unit { font-size:10.5px; color:var(--tcc-tm); font-weight:500; }
.sf24-tcc-item-total { font-family:var(--tcc-fh); font-size:16px; font-weight:800; color:var(--tcc-tx); letter-spacing:-.01em; font-variant-numeric:tabular-nums; }
.sf24-tcc-remove { display:inline-flex; align-items:center; justify-content:center; width:32px; height:32px; background:transparent !important; border:1px solid var(--tcc-bd) !important; border-radius:8px; color:var(--tcc-ts) !important; cursor:pointer !important; transition:all .15s; padding:0 !important; }
.sf24-tcc-remove:hover { background:#fee2e2 !important; border-color:#fecaca !important; color:#dc2626 !important; }

/* EMPTY */
.sf24-tcc-empty { padding:60px 24px; text-align:center; background:#fff; border:1px solid var(--tcc-bd); border-radius:20px; display:flex; flex-direction:column; align-items:center; gap:12px; }
.sf24-tcc-empty-icon { width:80px; height:80px; border-radius:50%; background:var(--tcc-ag); color:var(--tcc-ac); display:flex; align-items:center; justify-content:center; }
.sf24-tcc-empty h2 { font-family:var(--tcc-fh); margin:0; font-size:22px; font-weight:800; }
.sf24-tcc-empty p { margin:0 0 8px; color:var(--tcc-ts); font-size:14px; }

/* SUMMARY */
.sf24-tcc-summary-col { min-width:0; }
.sf24-tcc-summary { padding:20px 20px 18px; background:#fff; border:1px solid var(--tcc-bd); border-radius:18px; box-shadow:0 8px 28px -16px rgba(15,15,17,.12); position:sticky; top:24px; }
.sf24-tcc-summary-title { font-family:var(--tcc-fh); margin:0 0 14px; font-size:17px; font-weight:800; letter-spacing:-.01em; }
/* Cashback card — premium wallet credit teaser */
.sf24-tcc-cashback { position:relative; display:flex; align-items:center; gap:12px; padding:13px 14px 13px 12px; margin:0 0 16px; background:linear-gradient(135deg,#7c3aed 0%,#6d28d9 55%,#5b21b6 100%); border-radius:14px; box-shadow:0 10px 26px -10px rgba(124,58,237,.55), inset 0 1px 0 rgba(255,255,255,.18); overflow:hidden; isolation:isolate; }
.sf24-tcc-cashback::before { content:''; position:absolute; inset:0; background:radial-gradient(ellipse at top right, rgba(245,133,41,.32), transparent 55%); pointer-events:none; z-index:-1; }
.sf24-tcc-cashback::after { content:''; position:absolute; top:-50%; right:-15%; width:38px; height:200%; background:linear-gradient(105deg, transparent 35%, rgba(255,255,255,.18) 50%, transparent 65%); transform:translateX(-300%) skewX(-22deg); animation:sf24-tcc-cb-shine 4.2s ease-in-out infinite 1.2s; pointer-events:none; }
@keyframes sf24-tcc-cb-shine { 0%,55%,100% { transform:translateX(-300%) skewX(-22deg); } 75% { transform:translateX(800%) skewX(-22deg); } }
.sf24-tcc-cashback--co { margin:14px 0 16px; }

/* Guest variant — clickable login CTA */
a.sf24-tcc-cashback { text-decoration:none !important; cursor:pointer; transition:transform .2s, box-shadow .25s; color:inherit; }
a.sf24-tcc-cashback:hover { transform:translateY(-1px); box-shadow:0 14px 32px -10px rgba(124,58,237,.65), inset 0 1px 0 rgba(255,255,255,.22); }
a.sf24-tcc-cashback:active { transform:translateY(0); }
.sf24-tcc-cashback--guest { padding-right:10px; }
.sf24-tcc-cashback-arrow { display:inline-flex; align-items:center; justify-content:center; width:24px; height:24px; flex-shrink:0; margin-left:auto; color:rgba(255,255,255,.85); background:rgba(255,255,255,.12); border-radius:7px; transition:transform .25s cubic-bezier(.34,1.56,.64,1), background .2s; }
a.sf24-tcc-cashback:hover .sf24-tcc-cashback-arrow { transform:translateX(3px); background:rgba(255,255,255,.22); color:#fff; }

.sf24-tcc-cashback-coin { position:relative; display:inline-flex; align-items:center; justify-content:center; flex-shrink:0; width:34px; height:34px; }
.sf24-tcc-cashback-coin-inner { display:inline-flex; align-items:center; justify-content:center; width:34px; height:34px; border-radius:50%; background:linear-gradient(135deg,#fde68a 0%,#f59e0b 55%,#d97706 100%); box-shadow:0 4px 12px -2px rgba(217,119,6,.55), inset 0 1px 2px rgba(255,255,255,.5), inset 0 -2px 3px rgba(120,53,15,.35); animation:sf24-tcc-cb-bob 2.6s ease-in-out infinite; }
@keyframes sf24-tcc-cb-bob { 0%,100% { transform:translateY(0) rotate(-3deg); } 50% { transform:translateY(-2px) rotate(3deg); } }
.sf24-tcc-cashback-spark { position:absolute; width:4px; height:4px; border-radius:50%; background:#fff; box-shadow:0 0 6px rgba(255,255,255,.9); pointer-events:none; opacity:0; }
.sf24-tcc-cashback-spark--1 { top:-2px; right:2px; animation:sf24-tcc-cb-spark 2.2s ease-in-out infinite; }
.sf24-tcc-cashback-spark--2 { bottom:0; left:-1px; animation:sf24-tcc-cb-spark 2.2s ease-in-out infinite .7s; }
.sf24-tcc-cashback-spark--3 { top:50%; right:-2px; width:3px; height:3px; animation:sf24-tcc-cb-spark 2.2s ease-in-out infinite 1.4s; }
@keyframes sf24-tcc-cb-spark { 0%,100% { opacity:0; transform:scale(.4); } 40%,60% { opacity:1; transform:scale(1.2); } }

.sf24-tcc-cashback-body { display:flex; flex-direction:column; gap:2px; min-width:0; line-height:1.25; }
.sf24-tcc-cashback-eyebrow { font-size:9.5px; font-weight:800; color:rgba(255,255,255,.78); letter-spacing:.1em; text-transform:uppercase; }
.sf24-tcc-cashback-text { font-size:12.5px; color:rgba(255,255,255,.95); font-weight:600; letter-spacing:-.005em; }
.sf24-tcc-cashback-text strong { font-family:var(--tcc-fh); color:#fef3c7; font-size:14px; font-weight:900; padding:0 1px; font-variant-numeric:tabular-nums; }
@media (prefers-reduced-motion: reduce) { .sf24-tcc-cashback::after, .sf24-tcc-cashback-coin-inner, .sf24-tcc-cashback-spark { animation:none !important; } }

.sf24-tcc-summary-rows { display:flex; flex-direction:column; gap:9px; padding-bottom:14px; border-bottom:1px solid var(--tcc-bd); margin-bottom:14px; }
.sf24-tcc-summary-row { display:flex; align-items:center; justify-content:space-between; font-size:13.5px; color:var(--tcc-ts); }
.sf24-tcc-summary-row strong { color:var(--tcc-tx); font-weight:700; font-variant-numeric:tabular-nums; }
.sf24-tcc-summary-row--discount { color:#059669; }
.sf24-tcc-summary-row--discount strong { color:#059669; }

/* Applied-coupons list — Buzzoid-style "✓ CODE — You saved $X" pills */
.sf24-tcc-applied-coupons { list-style:none; margin:0 0 14px; padding:0; display:flex; flex-direction:column; gap:7px; animation:sf24-tcc-coup-fade .35s ease; }
@keyframes sf24-tcc-coup-fade { from { opacity:0; transform:translateY(-4px); } to { opacity:1; transform:translateY(0); } }
.sf24-tcc-applied-coupon { display:flex; align-items:center; gap:9px; padding:9px 11px 9px 9px; background:linear-gradient(135deg, rgba(16,185,129,.09), rgba(16,185,129,.05)); border:1px solid rgba(16,185,129,.3); border-radius:11px; position:relative; overflow:hidden; }
.sf24-tcc-applied-coupon::before { content:''; position:absolute; left:0; top:0; bottom:0; width:3px; background:linear-gradient(180deg,#10b981,#059669); }
.sf24-tcc-applied-check { display:inline-flex; align-items:center; justify-content:center; width:20px; height:20px; border-radius:50%; background:linear-gradient(135deg,#10b981,#059669); color:#fff; flex-shrink:0; box-shadow:0 3px 8px -2px rgba(16,185,129,.4); margin-left:4px; }
.sf24-tcc-applied-code { font-family:"SF Mono", Monaco, monospace; font-size:11.5px; font-weight:800; color:#065f46; letter-spacing:.04em; padding:2px 7px; background:rgba(16,185,129,.15); border-radius:5px; flex-shrink:0; }
.sf24-tcc-applied-saved { flex:1; min-width:0; font-size:12px; font-weight:600; color:#065f46; line-height:1.3; }
.sf24-tcc-applied-saved strong { font-family:var(--tcc-fh); font-size:13px; font-weight:900; color:#059669; font-variant-numeric:tabular-nums; padding-left:2px; }
.sf24-tcc-applied-remove { display:inline-flex; align-items:center; justify-content:center; width:22px; height:22px; padding:0; background:transparent; border:0; border-radius:6px; color:#065f46; opacity:.5; cursor:pointer; transition:all .15s; flex-shrink:0; }
.sf24-tcc-applied-remove:hover { opacity:1; background:rgba(220,38,38,.08); color:#dc2626; }
.sf24-tcc-applied-remove.is-loading { opacity:.4; pointer-events:none; animation:sf24-tcc-co-spin .7s linear infinite; }
.sf24-tcc-summary-row--total { padding-top:6px; font-size:15px; }
.sf24-tcc-summary-row--total strong { font-family:var(--tcc-fh); font-size:22px; color:#c2410c; font-weight:800; }

/* COUPON */
.sf24-tcc-coupon { padding:12px 0 14px; }
.sf24-tcc-coupon-input-wrap { display:flex; gap:8px; }
.sf24-tcc-coupon-input { flex:1 1 auto; padding:10px 12px; border:1.5px solid var(--tcc-bd); border-radius:9px; font-family:inherit; font-size:13px; color:var(--tcc-tx); outline:none; transition:border-color .2s; min-width:0; background:#fff; text-transform:uppercase; letter-spacing:.05em; font-weight:600; }
.sf24-tcc-coupon-input:focus { border-color:var(--tcc-ac); }
.sf24-tcc-coupon-btn { padding:10px 16px !important; background:var(--tcc-ac) !important; color:#fff !important; border:1px solid var(--tcc-ac) !important; border-radius:9px !important; font-family:inherit !important; font-size:12.5px !important; font-weight:700 !important; cursor:pointer !important; transition:all .15s !important; flex-shrink:0; letter-spacing:.02em; outline:none !important; }
.sf24-tcc-coupon-btn:hover { background:#6d28d9 !important; border-color:#6d28d9 !important; transform:translateY(-1px); }
.sf24-tcc-coupon-applied { display:flex; flex-wrap:wrap; gap:6px; margin-top:10px; }
.sf24-tcc-coupon-chip { display:inline-flex; align-items:center; gap:6px; padding:5px 6px 5px 10px; background:rgba(16,185,129,.08); border:1px solid rgba(16,185,129,.3); border-radius:999px; font-size:11.5px; font-weight:800; color:#065f46; letter-spacing:.04em; }
.sf24-tcc-coupon-chip button { width:18px; height:18px; border-radius:50%; background:rgba(16,185,129,.18) !important; color:#059669 !important; font-size:13px !important; font-weight:900 !important; line-height:1 !important; border:0 !important; cursor:pointer !important; padding:0 !important; display:inline-flex; align-items:center; justify-content:center; }
.sf24-tcc-coupon-chip button:hover { background:#dc2626 !important; color:#fff !important; }
.sf24-tcc-coupon-msg { margin-top:8px; padding:8px 10px; border-radius:8px; font-size:12px; font-weight:600; }
.sf24-tcc-coupon-msg.is-error { background:#fee2e2; color:#dc2626; border:1px solid #fecaca; }
.sf24-tcc-coupon-msg.is-success { background:rgba(16,185,129,.1); color:#059669; border:1px solid rgba(16,185,129,.3); }
/* Available coupon CARDS — visible by default, ticket-style */
.sf24-tcc-coupon-available { margin-top:14px; }
.sf24-tcc-coupon-available[hidden] { display:none !important; }
.sf24-tcc-coupon-available-head { margin-bottom:8px; }
.sf24-tcc-coupon-available-eyebrow { display:inline-flex; align-items:center; gap:5px; padding:3px 9px; background:var(--tcc-ag); border:1px solid rgba(124,58,237,.18); border-radius:999px; font-size:10.5px; font-weight:800; letter-spacing:.06em; text-transform:uppercase; color:var(--tcc-ac); }
.sf24-tcc-coupon-cards { display:flex; flex-direction:column; gap:8px; max-height:280px; overflow-y:auto; padding-right:2px; scrollbar-width:thin; }
.sf24-tcc-coupon-cards::-webkit-scrollbar { width:4px; }
.sf24-tcc-coupon-cards::-webkit-scrollbar-thumb { background:rgba(124,58,237,.25); border-radius:2px; }
.sf24-tcc-coupon-card { position:relative; display:flex; align-items:stretch; background:linear-gradient(135deg,#fff7ed 0%,#fff 50%,#fefce8 100%); border:1.5px dashed rgba(245,133,41,.4); border-radius:10px; overflow:hidden; cursor:pointer; transition:all .25s cubic-bezier(.34,1.56,.64,1); padding:0; box-shadow:0 2px 6px -2px rgba(245,133,41,.12); }
.sf24-tcc-coupon-card::before, .sf24-tcc-coupon-card::after { content:''; position:absolute; width:10px; height:10px; background:var(--tcc-bg); border:1.5px dashed rgba(245,133,41,.4); border-radius:50%; top:50%; transform:translateY(-50%); }
.sf24-tcc-coupon-card::before { left:-6px; border-right:0; }
.sf24-tcc-coupon-card::after { right:-6px; border-left:0; }
.sf24-tcc-coupon-card:hover { transform:translateY(-2px); border-color:#f58529; border-style:solid; box-shadow:0 8px 18px -6px rgba(245,133,41,.3); }
.sf24-tcc-coupon-card:hover::before, .sf24-tcc-coupon-card:hover::after { border-style:solid; border-color:#f58529; }
.sf24-tcc-coupon-card.is-applying { opacity:.5; pointer-events:none; }
.sf24-tcc-coupon-card.is-disabled { opacity:.5; cursor:not-allowed; }
.sf24-tcc-coupon-card-discount { display:flex; flex-direction:column; align-items:center; justify-content:center; padding:10px 12px; background:linear-gradient(135deg, var(--tcc-ac), var(--tcc-ac2)); color:#fff; min-width:62px; flex-shrink:0; position:relative; }
.sf24-tcc-coupon-card-discount-value { font-family:var(--tcc-fh); font-size:18px; font-weight:900; line-height:1; letter-spacing:-.02em; }
.sf24-tcc-coupon-card-discount-label { font-size:9px; font-weight:700; letter-spacing:.06em; text-transform:uppercase; opacity:.95; margin-top:2px; }
.sf24-tcc-coupon-card-body { flex:1; padding:9px 14px; display:flex; flex-direction:column; gap:2px; min-width:0; justify-content:center; }
.sf24-tcc-coupon-card-code { font-family:'SF Mono', Monaco, Consolas, monospace; font-size:13px; font-weight:800; color:var(--tcc-tx); letter-spacing:.05em; line-height:1.2; }
.sf24-tcc-coupon-card-desc { font-size:11px; color:var(--tcc-ts); line-height:1.3; max-height:28px; overflow:hidden; }
.sf24-tcc-coupon-card-cta { display:inline-flex; align-items:center; gap:3px; padding:0 14px; font-size:11px; font-weight:800; color:var(--tcc-ac); letter-spacing:.04em; text-transform:uppercase; flex-shrink:0; transition:transform .2s; }
.sf24-tcc-coupon-card:hover .sf24-tcc-coupon-card-cta { transform:translateX(2px); color:#c2410c; }
.sf24-tcc-coupon-empty { padding:12px; text-align:center; color:var(--tcc-tm); font-size:11.5px; font-style:italic; }

/* CTA */
.sf24-tcc-btn { display:inline-flex; align-items:center; justify-content:center; gap:8px; padding:13px 18px !important; border-radius:12px !important; font-family:var(--tcc-fh) !important; font-size:15px !important; font-weight:700 !important; text-decoration:none !important; cursor:pointer !important; border:0 !important; transition:all .25s !important; line-height:1; outline:none !important; }
.sf24-tcc-btn-primary, a.sf24-tcc-btn-primary { background:linear-gradient(135deg, var(--tcc-ac) 0%, var(--tcc-ac2) 100%) !important; color:#fff !important; box-shadow:0 8px 20px -6px rgba(124,58,237,.4) !important; }
.sf24-tcc-btn-primary:hover, a.sf24-tcc-btn-primary:hover { background:linear-gradient(135deg, var(--tcc-ac) 0%, var(--tcc-ac2) 100%) !important; color:#fff !important; transform:translateY(-2px); box-shadow:0 14px 28px -8px rgba(124,58,237,.5) !important; }
.sf24-tcc-btn-primary[aria-disabled="true"] { opacity:.4; pointer-events:none; }
/* Checkout CTA — animated: shimmer sweep + breathing glow + arrow nudge on hover */
.sf24-tcc-checkout-btn { width:100%; margin-top:6px; position:relative; overflow:hidden; isolation:isolate; transition:transform .25s, box-shadow .3s !important; animation:sf24-tcc-cta-pulse 2.6s ease-in-out infinite; }
.sf24-tcc-checkout-btn::before {
  content:''; position:absolute; top:0; bottom:0; left:-60%; width:50%;
  background:linear-gradient(105deg, transparent 30%, rgba(255,255,255,.42) 50%, transparent 70%);
  transform:skewX(-22deg); pointer-events:none; z-index:1;
  animation:sf24-tcc-cta-shine 3.2s cubic-bezier(.55,0,.2,1) infinite;
  animation-delay:.8s;
}
.sf24-tcc-checkout-btn > * { position:relative; z-index:2; }
.sf24-tcc-checkout-btn svg { transition:transform .35s cubic-bezier(.34,1.56,.64,1); }
.sf24-tcc-checkout-btn:hover { animation-play-state:paused; transform:translateY(-2px) scale(1.01); box-shadow:0 18px 38px -10px rgba(124,58,237,.55) !important; }
.sf24-tcc-checkout-btn:hover svg { transform:translateX(4px); }
.sf24-tcc-checkout-btn:hover::before { animation-duration:1.4s; }
.sf24-tcc-checkout-btn:active { transform:translateY(0) scale(.99); }
.sf24-tcc-checkout-btn[aria-disabled="true"] { animation:none; opacity:.55; pointer-events:none; }
.sf24-tcc-checkout-btn[aria-disabled="true"]::before { display:none; }
@keyframes sf24-tcc-cta-pulse { 0%,100% { box-shadow:0 8px 20px -6px rgba(124,58,237,.4); } 50% { box-shadow:0 12px 32px -6px rgba(124,58,237,.55), 0 0 0 4px rgba(124,58,237,.08); } }
@keyframes sf24-tcc-cta-shine { 0% { left:-60%; } 60%,100% { left:120%; } }
@media (prefers-reduced-motion: reduce) { .sf24-tcc-checkout-btn { animation:none; } .sf24-tcc-checkout-btn::before { animation:none; display:none; } .sf24-tcc-checkout-btn:hover { transform:none; } .sf24-tcc-checkout-btn:hover svg { transform:none; } }

.sf24-tcc-summary-trust { display:flex; align-items:center; gap:8px; padding:12px 0 0; margin-top:14px; border-top:1px solid var(--tcc-bd); font-size:11.5px; color:var(--tcc-ts); }
.sf24-tcc-summary-trust strong { color:#065f46; }
.sf24-tcc-trust-lock { display:inline-flex; align-items:center; justify-content:center; width:22px; height:22px; border-radius:50%; background:linear-gradient(135deg,#10b981,#059669); color:#fff; flex-shrink:0; }

/* BUNDLE-UNLOCK — matches test-shop "Most Popular" warm-cream aesthetic */
.sf24-tcc-bundle { margin-top:24px; }
.sf24-tcc-bundle-trigger, button.sf24-tcc-bundle-trigger {
  position:relative !important; width:100% !important;
  display:flex !important; align-items:center !important; gap:16px !important;
  padding:18px 18px 18px 16px !important;
  background:linear-gradient(135deg,#fff7ed 0%,#fff 35%,#fefce8 100%) !important;
  border:1px solid rgba(245,133,41,.18) !important; border-radius:16px !important;
  cursor:pointer !important; outline:none !important;
  font-family:inherit !important; text-align:left !important;
  box-shadow:0 6px 18px -10px rgba(245,133,41,.3), inset 0 0 0 1px rgba(255,255,255,.7) !important;
  transition:border-color .2s, box-shadow .25s, transform .2s !important;
  overflow:hidden;
}
.sf24-tcc-bundle-trigger::before {
  content:''; position:absolute; top:-50%; right:-15%; width:55%; height:200%;
  background:radial-gradient(ellipse at center, rgba(245,133,41,.12), transparent 60%);
  pointer-events:none; z-index:0;
}
.sf24-tcc-bundle-trigger > * { position:relative; z-index:1; }
.sf24-tcc-bundle-trigger:hover { border-color:rgba(245,133,41,.4) !important; box-shadow:0 12px 28px -10px rgba(245,133,41,.4), inset 0 0 0 1px rgba(255,255,255,.7) !important; transform:translateY(-2px); }
.sf24-tcc-bundle-trigger:active { transform:translateY(0); }
/* Hide elements we no longer use */
.sf24-tcc-bundle-bg, .sf24-tcc-bundle-shine, .sf24-tcc-bundle-sparkle, .sf24-tcc-bundle-flame, .sf24-tcc-bundle-cta-text { display:none !important; }
.sf24-tcc-bundle-rings { position:relative; display:inline-flex; align-items:center; justify-content:center; width:64px; height:64px; flex-shrink:0; }
.sf24-tcc-bundle-ring { position:absolute; top:50%; left:50%; width:60px; height:60px; border-radius:50%; border:1.5px solid var(--tcc-ac); transform:translate(-50%,-50%); opacity:0; animation:sf24-tcc-bundle-pulse 2.6s ease-out infinite; animation-delay:calc(var(--ring-index) * 0.7s); }
@keyframes sf24-tcc-bundle-pulse { 0% { width:36px; height:36px; opacity:.6; } 75% { opacity:0.12; } 100% { width:64px; height:64px; opacity:0; } }
.sf24-tcc-bundle-pct { position:relative; z-index:2; display:inline-flex; align-items:center; justify-content:center; width:40px; height:40px; border-radius:50%; background:linear-gradient(135deg, var(--tcc-ac), var(--tcc-ac2)); color:#fff; font-family:var(--tcc-fh); font-size:17px; font-weight:900; box-shadow:0 4px 14px -2px rgba(124,58,237,.45); }
.sf24-tcc-bundle-text { flex:1; min-width:0; display:flex; flex-direction:column; gap:2px; line-height:1.3; }
.sf24-tcc-bundle-title { font-family:var(--tcc-fh); font-size:15.5px; font-weight:800; color:var(--tcc-tx); letter-spacing:-.005em; }
.sf24-tcc-bundle-sub { font-size:13px; color:#c2410c; font-weight:600; }
.sf24-tcc-bundle-sub strong { color:#9a3412; font-weight:800; }
.sf24-tcc-bundle-cta { display:inline-flex; align-items:center; justify-content:center; width:36px; height:36px; border-radius:10px; background:linear-gradient(135deg, var(--tcc-ac), var(--tcc-ac2)); color:#fff; flex-shrink:0; transition:transform .2s; box-shadow:0 4px 10px -3px rgba(124,58,237,.35); }
.sf24-tcc-bundle-trigger:hover .sf24-tcc-bundle-cta { transform:translateX(2px); }
.sf24-tcc-bundle-cta-icon { display:inline-flex; align-items:center; justify-content:center; }
.sf24-tcc-bundle-spin { animation:sf24-tcc-bundle-spin .7s linear infinite; }
@keyframes sf24-tcc-bundle-spin { to { transform:rotate(360deg); } }
@media (prefers-reduced-motion: reduce) { .sf24-tcc-bundle-ring, .sf24-tcc-bundle-spin { animation:none !important; } }
@media (max-width:600px) { .sf24-tcc-bundle-trigger { padding:12px 12px 12px 10px !important; gap:12px !important; } .sf24-tcc-bundle-title { font-size:13.5px; } .sf24-tcc-bundle-sub { font-size:11.5px; } }
/* Compact variant — fits inside the order summary card */
.sf24-tcc-bundle-trigger--compact { padding:12px 12px 12px 10px !important; gap:12px !important; margin-bottom:14px; border-radius:13px !important; }
.sf24-tcc-bundle-trigger--compact .sf24-tcc-bundle-rings { width:50px; height:50px; }
.sf24-tcc-bundle-trigger--compact .sf24-tcc-bundle-ring { width:46px; height:46px; }
.sf24-tcc-bundle-trigger--compact .sf24-tcc-bundle-ring { animation-name:sf24-tcc-bundle-pulse-compact; }
@keyframes sf24-tcc-bundle-pulse-compact { 0% { width:28px; height:28px; opacity:.6; } 75% { opacity:0.12; } 100% { width:50px; height:50px; opacity:0; } }
.sf24-tcc-bundle-trigger--compact .sf24-tcc-bundle-pct { width:32px; height:32px; font-size:14px; }
.sf24-tcc-bundle-trigger--compact .sf24-tcc-bundle-title { font-size:13px; }
.sf24-tcc-bundle-trigger--compact .sf24-tcc-bundle-sub { font-size:11.5px; }
.sf24-tcc-bundle-trigger--compact .sf24-tcc-bundle-cta { width:28px; height:28px; border-radius:8px; }

/* BUNDLE MODAL — Buzzoid "Boost Your Results" fullscreen overlay (perf-optimized) */
.sf24-tcc-bm { position:fixed !important; inset:0; z-index:2147483647 !important; display:flex !important; align-items:center; justify-content:center; padding:20px; contain:layout style; }
.sf24-tcc-bm[hidden] { display:none !important; }
.sf24-tcc-bm-backdrop { position:absolute; inset:0; background:rgba(15,15,17,.6); animation:sf24-tcc-bm-fade .15s ease-out; will-change:opacity; }
@keyframes sf24-tcc-bm-fade { from { opacity:0; } to { opacity:1; } }
.sf24-tcc-bm-sheet { position:relative; width:100%; max-width:520px; max-height:90vh; background:#fff; border-radius:24px; overflow:hidden; display:flex; flex-direction:column; box-shadow:0 20px 50px -16px rgba(0,0,0,.35); animation:sf24-tcc-bm-pop .22s cubic-bezier(.34,1.4,.64,1); will-change:transform, opacity; transform:translateZ(0); contain:layout paint; }
@keyframes sf24-tcc-bm-pop { from { opacity:0; transform:translate3d(0,16px,0) scale(.97); } to { opacity:1; transform:translate3d(0,0,0) scale(1); } }
.sf24-tcc-bm-hero { position:relative; padding:34px 24px 28px; background:linear-gradient(180deg, #fce7f3 0%, #fbcfe8 50%, #fff 100%); text-align:center; flex-shrink:0; overflow:hidden; }
/* Replaced conic-gradient (heavy paint) with lightweight repeating linear-gradient */
.sf24-tcc-bm-rays { position:absolute; top:-50px; left:50%; transform:translate3d(-50%, 0, 0); width:540px; height:280px; background:repeating-conic-gradient(from 0deg at 50% 100%, rgba(255,255,255,0) 0deg 8deg, rgba(255,255,255,.35) 8deg 12deg); pointer-events:none; opacity:.55; }
.sf24-tcc-bm-hero-text { position:relative; z-index:2; }
.sf24-tcc-bm-h { font-family:var(--tcc-fh); font-size:24px; font-weight:900; color:var(--tcc-tx); margin:0 0 6px; letter-spacing:-.02em; }
.sf24-tcc-bm-sub { font-size:13px; color:var(--tcc-ts); margin:0; font-weight:500; }
.sf24-tcc-bm-close, button.sf24-tcc-bm-close { position:absolute !important; top:14px !important; right:14px !important; z-index:3; width:34px !important; height:34px !important; padding:0 !important; border:0 !important; border-radius:50% !important; background:#fff !important; color:var(--tcc-tx) !important; cursor:pointer !important; display:flex !important; align-items:center !important; justify-content:center !important; transition:transform .15s, background .15s !important; outline:none !important; box-shadow:0 3px 10px -2px rgba(0,0,0,.18) !important; }
.sf24-tcc-bm-close:hover { background:#fff !important; transform:scale(1.05); }
.sf24-tcc-bm-tabs { display:flex; gap:8px; padding:14px 18px 6px; border-bottom:0; flex-shrink:0; overflow-x:auto; scrollbar-width:none; }
.sf24-tcc-bm-tabs::-webkit-scrollbar { display:none; }
.sf24-tcc-bm-tab, button.sf24-tcc-bm-tab { display:inline-flex !important; align-items:center !important; gap:6px !important; padding:10px 14px !important; background:#fff !important; border:1.5px solid var(--tcc-bd) !important; border-radius:12px !important; cursor:pointer !important; font-family:inherit !important; font-size:13px !important; font-weight:700 !important; color:var(--tcc-tx) !important; transition:all .2s !important; outline:none !important; flex-shrink:0; position:relative; }
.sf24-tcc-bm-tab:hover { border-color:var(--tcc-ac) !important; }
.sf24-tcc-bm-tab.is-active { border-color:#E4405F !important; box-shadow:0 0 0 3px rgba(228,64,95,.12) !important; }
.sf24-tcc-bm-tab-icon { display:inline-flex; align-items:center; justify-content:center; width:18px; height:18px; }
.sf24-tcc-bm-tab-icon svg { width:18px; height:18px; }
.sf24-tcc-bm-tab-count { display:inline-flex; align-items:center; justify-content:center; min-width:22px; height:22px; padding:0 6px; background:#f97316; color:#fff; border-radius:999px; font-size:10.5px; font-weight:900; line-height:1; box-shadow:0 2px 6px -1px rgba(249,115,22,.5); }
.sf24-tcc-bm-content { flex:1 1 auto; overflow-y:auto; padding:14px 18px 4px; -webkit-overflow-scrolling:touch; overscroll-behavior:contain; }
.sf24-tcc-bm-pane { display:none; }
.sf24-tcc-bm-pane.is-active { display:block; animation:sf24-tcc-bm-pane-in .15s ease-out; }
@keyframes sf24-tcc-bm-pane-in { from { opacity:0; } to { opacity:1; } }
.sf24-tcc-bm-rec { position:relative; padding:18px 16px 16px; background:#fff; border:1.5px solid var(--tcc-bd); border-radius:16px; margin-bottom:12px; }
.sf24-tcc-bm-rec-head { position:absolute; top:-12px; left:14px; right:14px; display:flex; justify-content:space-between; align-items:center; pointer-events:none; }
.sf24-tcc-bm-rec-tag { display:inline-flex; align-items:center; gap:5px; padding:4px 10px; background:#1a1033; color:#fff; border-radius:999px; font-size:10.5px; font-weight:800; letter-spacing:.04em; box-shadow:0 4px 12px -3px rgba(15,15,17,.4); }
.sf24-tcc-bm-rec-tag svg { color:#fbbf24; }
.sf24-tcc-bm-rec-value { display:inline-flex; align-items:center; gap:4px; padding:4px 10px; background:#1a1033; color:#fff; border-radius:999px; font-size:10.5px; font-weight:800; box-shadow:0 4px 12px -3px rgba(15,15,17,.4); }
.sf24-tcc-bm-rec-value svg { color:#fbbf24; }
.sf24-tcc-bm-rec-title { font-family:var(--tcc-fh); font-size:14px; font-weight:800; color:var(--tcc-tx); margin:6px 0 16px; }
.sf24-tcc-bm-coins { display:flex; align-items:center; justify-content:center; gap:14px; padding:6px 0 16px; }
.sf24-tcc-bm-coin-plus { font-family:var(--tcc-fh); font-size:24px; font-weight:900; color:#f97316; flex-shrink:0; }
.sf24-tcc-bm-coin-card { display:flex; flex-direction:column; align-items:center; gap:6px; flex:1 1 0; min-width:0; max-width:160px; }
.sf24-tcc-bm-coin { position:relative; width:80px; height:80px; border-radius:50%; background:radial-gradient(circle at 30% 30%, #fde68a 0%, #fbbf24 35%, #d97706 75%, #92400e 100%); display:flex; align-items:center; justify-content:center; box-shadow:0 6px 14px -4px rgba(217,119,6,.4), inset 0 -2px 4px rgba(120,53,15,.3); flex-shrink:0; }
.sf24-tcc-bm-coin-qty { font-family:var(--tcc-fh); font-size:20px; font-weight:900; color:#1a1033; letter-spacing:-.02em; line-height:1; text-shadow:0 1px 0 rgba(255,255,255,.4); }
.sf24-tcc-bm-coin-platform { position:absolute; bottom:-4px; right:-2px; width:24px; height:24px; border-radius:50%; background:#fff; display:flex; align-items:center; justify-content:center; box-shadow:0 2px 6px rgba(0,0,0,.2); }
.sf24-tcc-bm-coin-platform svg { width:16px; height:16px; }
.sf24-tcc-bm-coin-name { font-size:12.5px; font-weight:700; color:var(--tcc-tx); text-align:center; line-height:1.3; display:-webkit-box; -webkit-line-clamp:3; -webkit-box-orient:vertical; overflow:hidden; padding:0 2px; word-break:break-word; hyphens:auto; }
.sf24-tcc-bm-coin-price { font-family:var(--tcc-fh); font-size:16px; font-weight:900; color:var(--tcc-tx); letter-spacing:-.01em; }
.sf24-tcc-bm-coin-add, button.sf24-tcc-bm-coin-add { display:flex !important; align-items:center !important; justify-content:center !important; width:46px !important; height:46px !important; padding:0 !important; border:0 !important; border-radius:14px !important; background:linear-gradient(135deg, #fb923c, #ea580c) !important; color:#fff !important; cursor:pointer !important; transition:all .2s !important; outline:none !important; box-shadow:0 6px 16px -4px rgba(234,88,12,.55) !important; flex-shrink:0; }
.sf24-tcc-bm-coin-add:hover { transform:scale(1.08) translateY(-1px); box-shadow:0 10px 22px -4px rgba(234,88,12,.65) !important; }
.sf24-tcc-bm-coin-add:active { transform:scale(.95); }
.sf24-tcc-bm-coin-card.is-loading .sf24-tcc-bm-coin-add { pointer-events:none; }
.sf24-tcc-bm-coin-card.is-loading .sf24-tcc-bm-coin-add-default, .sf24-tcc-bm-coin-card.is-loading .sf24-tcc-bm-coin-add-done { display:none; }
.sf24-tcc-bm-coin-card.is-loading .sf24-tcc-bm-coin-add-loading { display:inline-flex !important; }
.sf24-tcc-bm-coin-card.is-added .sf24-tcc-bm-coin-add { background:linear-gradient(135deg, #10b981, #059669) !important; }
.sf24-tcc-bm-coin-card.is-added .sf24-tcc-bm-coin-add-default, .sf24-tcc-bm-coin-card.is-added .sf24-tcc-bm-coin-add-loading { display:none; }
.sf24-tcc-bm-coin-card.is-added .sf24-tcc-bm-coin-add-done { display:inline-flex !important; }
.sf24-tcc-bm-rec-cta { display:flex; align-items:center; justify-content:center; gap:14px; padding-top:14px; border-top:1px dashed var(--tcc-bd); }
.sf24-tcc-bm-rec-total { font-family:var(--tcc-fh); font-size:18px; font-weight:900; color:var(--tcc-tx); }
.sf24-tcc-bm-rec-bundle-btn, button.sf24-tcc-bm-rec-bundle-btn { display:inline-flex !important; align-items:center !important; gap:6px !important; padding:11px 18px !important; background:#1a1033 !important; color:#fff !important; border:0 !important; border-radius:12px !important; font-family:var(--tcc-fh) !important; font-size:13px !important; font-weight:800 !important; cursor:pointer !important; transition:all .2s !important; outline:none !important; box-shadow:0 6px 16px -4px rgba(15,15,17,.4) !important; }
.sf24-tcc-bm-rec-bundle-btn:hover { transform:translateY(-1px); background:#2d1b4e !important; }
.sf24-tcc-bm-rec-bundle-btn.is-loading { opacity:.6; pointer-events:none; }
.sf24-tcc-bm-singles { display:flex; flex-wrap:wrap; gap:14px; justify-content:center; padding:14px 0 12px; border-top:1px dashed var(--tcc-bd); }
.sf24-tcc-bm-coin-card--solo { max-width:140px; }
.sf24-tcc-bm-foot { display:flex; align-items:center; justify-content:space-between; gap:14px; padding:14px 18px; background:#fff; border-top:1px solid var(--tcc-bd); flex-shrink:0; box-shadow:0 -8px 20px -10px rgba(0,0,0,.08); }
.sf24-tcc-bm-foot-cart { font-size:13px; color:var(--tcc-ts); font-weight:600; }
.sf24-tcc-bm-foot-cart strong { font-family:var(--tcc-fh); font-size:18px; font-weight:900; color:var(--tcc-tx); margin-left:4px; letter-spacing:-.01em; }
.sf24-tcc-bm-continue, button.sf24-tcc-bm-continue { padding:13px 30px !important; border:0 !important; border-radius:12px !important; background:linear-gradient(135deg, #fb923c, #ea580c) !important; color:#fff !important; font-family:var(--tcc-fh) !important; font-size:14.5px !important; font-weight:800 !important; cursor:pointer !important; transition:all .2s !important; outline:none !important; box-shadow:0 6px 18px -4px rgba(234,88,12,.5) !important; }
.sf24-tcc-bm-continue:hover { transform:translateY(-1px); box-shadow:0 10px 24px -4px rgba(234,88,12,.6) !important; }
@media (max-width:600px) { .sf24-tcc-bm { padding:0; align-items:flex-end; } .sf24-tcc-bm-sheet { max-height:92vh; border-radius:24px 24px 0 0; max-width:100%; } .sf24-tcc-bm-coin { width:70px; height:70px; } .sf24-tcc-bm-coin-qty { font-size:17px; } .sf24-tcc-bm-coins { gap:10px; } .sf24-tcc-bm-h { font-size:20px; } }

/* Inline link-prompt — overlays the modal sheet, replaces browser prompt() */
.sf24-tcc-bm-prompt { position:absolute !important; inset:0; z-index:10; display:flex !important; align-items:center; justify-content:center; padding:20px; background:rgba(15,15,17,.6); animation:sf24-tcc-bm-fade .15s ease-out; }
.sf24-tcc-bm-prompt[hidden] { display:none !important; }
.sf24-tcc-bm-prompt-card { width:100%; max-width:400px; padding:26px 22px 22px; background:#fff; border-radius:20px; box-shadow:0 20px 50px -10px rgba(0,0,0,.3); animation:sf24-tcc-bm-pop .35s cubic-bezier(.34,1.56,.64,1); text-align:center; }
.sf24-tcc-bm-prompt-icon { display:inline-flex; align-items:center; justify-content:center; width:54px; height:54px; border-radius:16px; background:linear-gradient(135deg, var(--tcc-ac), var(--tcc-ac2)); color:#fff; margin-bottom:14px; box-shadow:0 8px 20px -4px rgba(124,58,237,.4); }
.sf24-tcc-bm-prompt-title { font-family:var(--tcc-fh); font-size:18px; font-weight:800; color:var(--tcc-tx); margin:0 0 6px; letter-spacing:-.01em; }
.sf24-tcc-bm-prompt-sub { font-size:13px; color:var(--tcc-ts); margin:0 0 18px; line-height:1.4; }
.sf24-tcc-bm-prompt-input-wrap { position:relative; display:flex; align-items:center; background:var(--tcc-bg); border:1.5px solid var(--tcc-bd); border-radius:12px; transition:border-color .2s, box-shadow .2s; margin-bottom:8px; }
.sf24-tcc-bm-prompt-input-wrap:focus-within { border-color:var(--tcc-ac); box-shadow:0 0 0 3px var(--tcc-ag); background:#fff; }
.sf24-tcc-bm-prompt-prefix { padding:0 4px 0 14px; font-size:16px; font-weight:700; color:var(--tcc-tm); user-select:none; line-height:1; min-width:14px; display:inline-flex; align-items:center; }
.sf24-tcc-bm-prompt-input, input.sf24-tcc-bm-prompt-input { flex:1 1 auto !important; padding:12px 14px 12px 6px !important; border:0 !important; background:transparent !important; font-family:inherit !important; font-size:15px !important; font-weight:600 !important; color:var(--tcc-tx) !important; outline:none !important; min-width:0; box-sizing:border-box; letter-spacing:-.005em; }
.sf24-tcc-bm-prompt-input::placeholder { color:var(--tcc-tm); font-weight:500; }
.sf24-tcc-bm-prompt-textarea { width:100% !important; padding:12px 14px !important; background:var(--tcc-bg) !important; border:1.5px solid var(--tcc-bd) !important; border-radius:12px !important; font-family:inherit !important; font-size:14px !important; font-weight:500 !important; color:var(--tcc-tx) !important; outline:none !important; resize:vertical; min-height:140px; max-height:280px; line-height:1.5; box-sizing:border-box; transition:border-color .2s, box-shadow .2s, background .2s !important; margin-bottom:8px; }
.sf24-tcc-bm-prompt-textarea[hidden] { display:none !important; }
.sf24-tcc-bm-prompt-textarea:focus { border-color:var(--tcc-ac) !important; box-shadow:0 0 0 3px var(--tcc-ag) !important; background:#fff !important; }
.sf24-tcc-bm-prompt-textarea::placeholder { color:var(--tcc-tm); font-weight:500; }
.sf24-tcc-bm-prompt-counter { font-family:var(--tcc-fh); font-size:12.5px; font-weight:700; color:var(--tcc-ts); margin:0 0 10px; text-align:right; padding:0 4px; font-variant-numeric:tabular-nums; }
.sf24-tcc-bm-prompt-counter[hidden] { display:none !important; }
.sf24-tcc-bm-prompt-counter.is-ok { color:#10b981; }
.sf24-tcc-bm-prompt-counter.is-warn { color:#f59e0b; }
.sf24-tcc-bm-prompt-counter.is-over { color:#ef4444; }
.sf24-tcc-bm-prompt-help { font-size:11px; color:var(--tcc-tm); margin:0 0 18px; display:flex; align-items:center; gap:5px; justify-content:center; }
.sf24-tcc-bm-prompt-help[hidden] { display:none !important; }
.sf24-tcc-bm-prompt-actions { display:flex; gap:10px; }
.sf24-tcc-bm-prompt-cancel, button.sf24-tcc-bm-prompt-cancel { flex:0 0 auto !important; padding:11px 18px !important; background:#fff !important; border:1.5px solid var(--tcc-bd) !important; border-radius:11px !important; color:var(--tcc-ts) !important; font-family:inherit !important; font-size:13px !important; font-weight:700 !important; cursor:pointer !important; transition:border-color .15s, color .15s !important; outline:none !important; }
.sf24-tcc-bm-prompt-cancel:hover { border-color:var(--tcc-tm) !important; color:var(--tcc-tx) !important; }
.sf24-tcc-bm-prompt-confirm, button.sf24-tcc-bm-prompt-confirm { flex:1 1 auto !important; padding:11px 18px !important; background:linear-gradient(135deg, var(--tcc-ac), var(--tcc-ac2)) !important; color:#fff !important; border:0 !important; border-radius:11px !important; font-family:var(--tcc-fh) !important; font-size:13.5px !important; font-weight:800 !important; cursor:pointer !important; transition:transform .2s, box-shadow .2s !important; outline:none !important; box-shadow:0 6px 16px -4px rgba(124,58,237,.4) !important; }
.sf24-tcc-bm-prompt-confirm:hover { transform:translateY(-1px); box-shadow:0 10px 22px -4px rgba(124,58,237,.5) !important; }
.sf24-tcc-bm-prompt-confirm:active { transform:scale(.97); }

/* UPSELLS — PWA-style "You might also like" */
.sf24-tcc-upsells { margin-top:28px; animation:sf24-tcc-ups-fadein .5s ease; }
@keyframes sf24-tcc-ups-fadein { from { opacity:0; transform:translateY(12px); } to { opacity:1; transform:translateY(0); } }
.sf24-tcc-upsells-title { font-family:var(--tcc-fh); font-size:11px; font-weight:800; text-transform:uppercase; letter-spacing:1.4px; margin:0 0 12px; padding:0 2px; display:inline-flex; align-items:center; gap:6px; color:var(--tcc-tm); }
.sf24-tcc-upsells-title::before { content:''; display:inline-block; width:14px; height:1px; background:var(--tcc-bd); }
.sf24-tcc-upsells-track { display:flex !important; flex-direction:column !important; gap:12px !important; }
.sf24-tcc-upsell { position:relative; background:#fff !important; border:1.5px solid var(--tcc-bd) !important; border-radius:16px !important; overflow:visible !important; opacity:0; transform:translateY(16px); animation:sf24-tcc-ups-slide .45s cubic-bezier(.34,1.56,.64,1) forwards; }
@keyframes sf24-tcc-ups-slide { to { opacity:1; transform:translateY(0); } }
.sf24-tcc-upsell.is-featured { border-color:rgba(124,58,237,.25) !important; }
.sf24-tcc-upsell-corner { position:absolute; top:0; left:0; padding:4px 10px; background:rgba(124,58,237,.08); color:var(--tcc-ac); border-radius:14px 0 12px 0; font-size:10px; font-weight:700; letter-spacing:.03em; z-index:3; line-height:1.3; }
.sf24-tcc-upsell-corner.is-hot { background:rgba(245,133,41,.1) !important; color:#c2410c !important; }
.sf24-tcc-upsell-body { padding:28px 14px 14px !important; display:flex !important; flex-direction:column !important; gap:9px !important; }
.sf24-tcc-upsell-top { display:flex; align-items:flex-start; gap:12px; }
.sf24-tcc-upsell-icon { display:flex !important; align-items:center; justify-content:center; width:54px !important; height:54px !important; flex-shrink:0; border-radius:13px; overflow:hidden; background:linear-gradient(135deg, rgba(124,58,237,.12), rgba(245,133,41,.08)); padding:5px; box-sizing:border-box; }
.sf24-tcc-upsell-icon img { width:100% !important; height:100% !important; object-fit:contain !important; display:block; }
.sf24-tcc-upsell-info { flex:1; min-width:0; display:flex; flex-direction:column; gap:5px; }
.sf24-tcc-upsell-name { font-family:var(--tcc-fh); font-size:13px; font-weight:700; line-height:1.35; color:var(--tcc-tx) !important; text-decoration:none !important; display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden; }
.sf24-tcc-upsell-name:hover { color:var(--tcc-ac) !important; }
.sf24-tcc-upsell-price-row { display:flex; align-items:center; gap:7px; flex-wrap:wrap; }
.sf24-tcc-upsell-disc-tag { background:#ef4444; color:#fff; font-size:10px; font-weight:900; padding:2px 7px; border-radius:6px; line-height:1.2; box-shadow:0 2px 6px -1px rgba(239,68,68,.45); }
.sf24-tcc-upsell-from { font-size:9.5px; color:var(--tcc-tm); font-weight:700; text-transform:uppercase; letter-spacing:.06em; }
.sf24-tcc-upsell-orig { text-decoration:line-through; color:var(--tcc-tm); font-size:11px; font-weight:500; }
.sf24-tcc-upsell-price { font-family:var(--tcc-fh); font-size:14.5px; font-weight:800; color:var(--tcc-tx); font-variant-numeric:tabular-nums; letter-spacing:-.01em; }
.sf24-tcc-upsell-proof { font-size:11.5px; color:var(--tcc-ts); font-weight:600; padding:2px 0 2px; }
/* Variation dropdown — custom-styled, hides browser default */
.sf24-tcc-upsell-variation, select.sf24-tcc-upsell-variation {
  width:100% !important;
  padding:11px 38px 11px 14px !important;
  border:1.5px solid var(--tcc-bd) !important;
  border-radius:11px !important;
  font-family:var(--tcc-fh) !important;
  font-size:13px !important;
  font-weight:700 !important;
  color:var(--tcc-tx) !important;
  background:#fff url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%237c3aed' stroke-width='2.6' stroke-linecap='round' stroke-linejoin='round'><polyline points='6 9 12 15 18 9'/></svg>") no-repeat right 13px center !important;
  background-size:14px 14px !important;
  outline:none !important;
  cursor:pointer !important;
  transition:border-color .15s, box-shadow .15s, background-color .15s !important;
  appearance:none !important;
  -webkit-appearance:none !important;
  -moz-appearance:none !important;
  line-height:1.3 !important;
  box-sizing:border-box !important;
  letter-spacing:-.01em;
  text-overflow:ellipsis;
}
.sf24-tcc-upsell-variation:hover { border-color:rgba(124,58,237,.4) !important; background-color:#faf9ff !important; }
.sf24-tcc-upsell-variation:focus { border-color:var(--tcc-ac) !important; box-shadow:0 0 0 3px var(--tcc-ag) !important; background-color:#fff !important; }
.sf24-tcc-upsell-variation:not([data-empty]):not([value=""]) { border-color:var(--tcc-ac) !important; background-color:rgba(124,58,237,.03) !important; }
.sf24-tcc-upsell-variation option { padding:10px 12px; font-weight:600; color:var(--tcc-tx); background:#fff; }
.sf24-tcc-upsell-variation option:checked { background:var(--tcc-ag); color:var(--tcc-ac); font-weight:800; }
/* Upsell add — solid lila (NOT gradient — that's reserved for the primary checkout CTA) */
.sf24-tcc-upsell-add, button.sf24-tcc-upsell-add { display:block !important; width:100% !important; padding:10px 14px !important; border:0 !important; border-radius:10px !important; background:#7c3aed !important; color:#fff !important; font-family:var(--tcc-fh) !important; font-size:13px !important; font-weight:700 !important; cursor:pointer !important; transition:background .15s, transform .2s !important; text-align:center !important; outline:none !important; box-shadow:none !important; }
.sf24-tcc-upsell-add:hover, button.sf24-tcc-upsell-add:hover { background:#6d28d9 !important; transform:translateY(-1px); box-shadow:0 4px 10px -4px rgba(124,58,237,.35) !important; }
.sf24-tcc-upsell-add:active, button.sf24-tcc-upsell-add:active { transform:scale(.98); }
.sf24-tcc-upsell-add.is-loading { pointer-events:none; opacity:.7; }
.sf24-tcc-upsell-add.is-added { background:#10b981 !important; }
/* When expand panel is open, hide the outer add button so only ONE active CTA per card */
.sf24-tcc-upsell.is-expanded .sf24-tcc-upsell-add { display:none !important; }

.sf24-tcc-upsell-expand { padding:0 14px 14px; animation:sf24-tcc-ups-expand .3s ease; overflow:hidden; }
@keyframes sf24-tcc-ups-expand { from { opacity:0; max-height:0; padding-bottom:0; } to { opacity:1; max-height:200px; padding-bottom:14px; } }
.sf24-tcc-upsell-expand[hidden] { display:none !important; }
.sf24-tcc-upsell-link-input { width:100% !important; padding:10px 12px !important; background:var(--tcc-bg) !important; border:1.5px solid var(--tcc-bd) !important; border-radius:9px !important; color:var(--tcc-tx) !important; font-family:inherit !important; font-size:13px !important; font-weight:500 !important; outline:none !important; transition:border-color .2s, box-shadow .2s !important; margin-bottom:8px; box-sizing:border-box; }
.sf24-tcc-upsell-link-input:focus { border-color:var(--tcc-ac) !important; box-shadow:0 0 0 3px var(--tcc-ag) !important; }
.sf24-tcc-upsell-link-input::placeholder { color:var(--tcc-tm); opacity:.7; }

.sf24-tcc-upsell-expand-row { display:flex; gap:8px; align-items:stretch; }
.sf24-tcc-upsell-cancel, button.sf24-tcc-upsell-cancel { flex-shrink:0; display:inline-flex !important; align-items:center !important; justify-content:center !important; width:38px !important; padding:0 !important; border:1.5px solid var(--tcc-bd) !important; border-radius:9px !important; background:#fff !important; color:var(--tcc-ts) !important; cursor:pointer !important; transition:all .15s !important; outline:none !important; }
.sf24-tcc-upsell-cancel:hover { background:#f9fafb !important; border-color:#cbcdd5 !important; color:var(--tcc-tx) !important; }
.sf24-tcc-upsell-confirm, button.sf24-tcc-upsell-confirm { flex:1 !important; padding:10px !important; border:0 !important; border-radius:9px !important; background:#7c3aed !important; color:#fff !important; font-family:var(--tcc-fh) !important; font-size:13px !important; font-weight:700 !important; cursor:pointer !important; transition:background .15s, transform .2s !important; outline:none !important; box-shadow:none !important; }
.sf24-tcc-upsell-confirm:hover { background:#6d28d9 !important; transform:translateY(-1px); }
.sf24-tcc-upsell-confirm:active { transform:scale(.98); }
.sf24-tcc-upsell-confirm.is-loading { opacity:.7; pointer-events:none; }
.sf24-tcc-upsell-msg { font-size:12px; margin-top:6px; text-align:center; line-height:1.4; padding:0 4px; }
.sf24-tcc-upsell-msg[hidden] { display:none !important; }
.sf24-tcc-upsell-msg.is-err { color:#dc2626; font-weight:600; }
.sf24-tcc-upsell-msg.is-ok { color:#10b981; font-weight:700; }

/* TRUST BAR */
.sf24-tcc-trust { display:flex; flex-direction:column; align-items:center; gap:14px; padding:18px 20px; margin-top:28px; background:#fff; border:1px solid var(--tcc-bd); border-radius:16px; }
.sf24-tcc-trust-head { display:flex; align-items:center; gap:8px; flex-wrap:wrap; justify-content:center; text-align:center; font-size:13px; color:var(--tcc-ts); }
.sf24-tcc-trust-head strong { color:#065f46; font-weight:800; }
.sf24-tcc-trust-lock-big { display:inline-flex; align-items:center; justify-content:center; width:26px; height:26px; border-radius:50%; background:linear-gradient(135deg,#10b981,#059669); color:#fff; box-shadow:0 3px 8px -2px rgba(16,185,129,.4); flex-shrink:0; }
.sf24-tcc-trust-logos { display:flex; align-items:center; justify-content:center; gap:12px; flex-wrap:wrap; padding-top:12px; border-top:1px solid var(--tcc-bd); width:100%; }
.sf24-tcc-trust-logo { display:inline-flex; align-items:center; justify-content:center; gap:5px; min-width:54px; height:32px; padding:0 12px; background:#fff; border:1px solid var(--tcc-bd); border-radius:8px; font-family:-apple-system,'SF Pro Display',Helvetica,Arial,sans-serif; font-weight:900; font-size:13px; letter-spacing:.04em; color:#1a1a1a; }
.sf24-tcc-trust-logo svg { height:18px; width:auto; display:block; }
.sf24-tcc-trust-logo--visa { color:#1A1F71; font-style:italic; letter-spacing:.06em; font-size:14px; }
.sf24-tcc-trust-logo--mc { padding:0 8px; }
.sf24-tcc-trust-logo--mc svg { height:22px; }
.sf24-tcc-trust-logo--amex { background:#006FCF; color:#fff; border-color:#006FCF; letter-spacing:.08em; }
.sf24-tcc-trust-logo--btc { font-size:12px; gap:5px; }

/* TOAST */
.sf24-tcc-toast { position:fixed; left:50%; bottom:30px; transform:translateX(-50%) translateY(20px); z-index:120; display:inline-flex; align-items:center; gap:10px; padding:11px 18px; background:#1a1033; color:#fff; border-radius:999px; font-size:14px; font-weight:600; box-shadow:0 14px 36px rgba(15,15,17,.4); opacity:0; pointer-events:none; transition:opacity .25s, transform .35s cubic-bezier(.34,1.56,.64,1); max-width:calc(100% - 32px); }
.sf24-tcc-toast.is-shown { opacity:1; pointer-events:auto; transform:translateX(-50%) translateY(0); }
.sf24-tcc-toast-check { width:24px; height:24px; border-radius:50%; background:linear-gradient(135deg,#10b981,#059669); display:inline-flex; align-items:center; justify-content:center; flex-shrink:0; }

/* MOBILE */
@media (max-width:600px) {
  .sf24-tcc { padding:16px 12px 100px; }
  .sf24-tcc-h1 { font-size:22px; }
  .sf24-tcc-back { font-size:12px; padding:7px 12px; }
  .sf24-tcc-item { grid-template-columns:80px 1fr; gap:10px; padding:10px; }
  .sf24-tcc-item-img { padding:5px; }
  .sf24-tcc-item-name { font-size:13.5px; }
  .sf24-tcc-item-total { font-size:14px; }
  .sf24-tcc-summary-row--total strong { font-size:18px; }
  .sf24-tcc-trust-logos { gap:6px; }
  .sf24-tcc-trust-logo { padding:0 8px; height:28px; min-width:46px; font-size:11.5px; }
  .sf24-tcc-trust-logo svg { height:14px; }
  .sf24-tcc-trust-logo--mc svg { height:18px; }
}

/* Live order-feed ticker (sticky-summary, below trust bar) */
.sf24-tcc-orderfeed { display:flex; align-items:center; gap:9px; margin-top:10px; padding:9px 12px; background:linear-gradient(135deg, rgba(16,185,129,.06), rgba(16,185,129,.02)); border:1px solid rgba(16,185,129,.18); border-radius:10px; font-size:12px; color:var(--tcc-ts); line-height:1.35; min-height:38px; overflow:hidden; }
.sf24-tcc-orderfeed[hidden] { display:none !important; }
.sf24-tcc-of-pulse { position:relative; display:inline-flex; align-items:center; justify-content:center; width:8px; height:8px; flex-shrink:0; }
.sf24-tcc-of-pulse > span { position:absolute; inset:0; background:#10b981; border-radius:50%; box-shadow:0 0 8px #10b981; animation:sf24-tcc-of-blink 1.4s ease-in-out infinite; }
.sf24-tcc-of-pulse::before, .sf24-tcc-of-pulse::after { content:''; position:absolute; inset:0; background:#10b981; border-radius:50%; opacity:.5; animation:sf24-tcc-of-ping 1.6s ease-out infinite; }
.sf24-tcc-of-pulse::after { animation-delay:.8s; }
@keyframes sf24-tcc-of-blink { 0%,100% { opacity:1; } 50% { opacity:.6; } }
@keyframes sf24-tcc-of-ping { 0% { transform:scale(1); opacity:.5; } 100% { transform:scale(2.6); opacity:0; } }
.sf24-tcc-of-text { flex:1; min-width:0; transition:opacity .35s ease; }
.sf24-tcc-of-text.is-fading { opacity:0; }
.sf24-tcc-of-text strong { color:var(--tcc-tx); font-weight:700; }
.sf24-tcc-of-text em { font-style:normal; color:#059669; font-weight:600; }
.sf24-tcc-of-flag { display:inline-block; margin:0 2px; }
.sf24-tcc-of-time { color:var(--tcc-tm); font-size:11px; padding-left:3px; }
@media (prefers-reduced-motion: reduce) { .sf24-tcc-of-pulse > span, .sf24-tcc-of-pulse::before, .sf24-tcc-of-pulse::after { animation:none; } }

/* Smart-Recommend co-purchase proof line — premium amber treatment */
.sf24-tcc-upsell-proof--smart { display:inline-flex !important; align-items:center; gap:6px; padding:5px 10px 5px 8px !important; background:linear-gradient(135deg, rgba(245,158,11,.12), rgba(245,133,41,.08)) !important; border:1px solid rgba(245,158,11,.3); border-radius:8px; color:#b45309 !important; font-size:11.5px !important; font-weight:600 !important; letter-spacing:-.005em; align-self:flex-start; }
.sf24-tcc-upsell-proof--smart strong { font-family:var(--tcc-fh); font-weight:900; color:#92400e; font-size:12.5px; padding-right:1px; font-variant-numeric:tabular-nums; }
.sf24-tcc-upsell-proof-icon { display:inline-flex; align-items:center; justify-content:center; color:#f59e0b; flex-shrink:0; }