/* تبصيرة — checkout module (self-contained; prefix tck-). Uses the landing's CSS variables when
   present and falls back to the brand values, so it drops into any page. */
.tck,.tck *{box-sizing:border-box}
.tck{--tk-navy:var(--navy,#0C1D39);--tk-azure:var(--accent,#0A6EBD);--tk-bg:var(--bg,#F5F7FB);--tk-card:var(--card,#fff);--tk-ink:var(--ink,#0C1D39);--tk-ink2:var(--ink2,#46536B);--tk-mute:var(--mute,#7C879C);--tk-line:var(--line,#E2E7F0);--tk-soft:var(--soft,#E8EDF6);--tk-bad:var(--bad,#C2410C);--tk-good:var(--good,#15803D);
  font-family:"Plex Arabic","IBM Plex Sans Arabic",Tahoma,Arial,sans-serif;color:var(--tk-ink);direction:rtl;text-align:right}
.tck[dir=ltr]{direction:ltr;text-align:left}
.tck-ov{position:fixed;inset:0;z-index:1000;display:flex;align-items:flex-end;justify-content:center;background:rgba(6,12,25,.55);backdrop-filter:blur(4px);-webkit-backdrop-filter:blur(4px);animation:tck-f .2s ease}
@media(min-width:720px){.tck-ov{align-items:center;padding:24px}}
.tck-sheet{position:relative;width:100%;max-width:560px;max-height:94vh;overflow:auto;background:var(--tk-card);border-radius:22px 22px 0 0;box-shadow:0 30px 80px -20px rgba(0,0,0,.45);padding:22px 20px 24px;animation:tck-u .28s cubic-bezier(.2,.7,.2,1)}
@media(min-width:720px){.tck-sheet{border-radius:22px;padding:28px 30px 30px}}
@keyframes tck-f{from{opacity:0}}@keyframes tck-u{from{transform:translateY(24px);opacity:.4}}
.tck-x{position:absolute;inset-inline-end:14px;top:12px;width:38px;height:38px;border-radius:50%;border:0;background:var(--tk-soft);color:var(--tk-ink);font-size:22px;line-height:1;cursor:pointer}
.tck-demo{display:inline-flex;align-items:center;gap:6px;margin:0 0 12px;padding:5px 11px;border-radius:999px;background:#FFF3D6;color:#7A5200;font-size:12.5px;font-weight:700}
[data-theme=dark] .tck-demo{background:rgba(245,165,36,.14);color:#F5C46B}
.tck-steps{display:flex;gap:6px;margin:4px 0 16px;padding-inline-end:44px}
.tck-steps i{flex:1;height:4px;border-radius:4px;background:var(--tk-soft)}
.tck-steps i.on{background:var(--tk-azure)}
.tck h2{margin:0 0 4px;font-size:22px;line-height:1.35;color:var(--tk-ink)}
.tck .tck-sub{margin:0 0 18px;color:var(--tk-ink2);font-size:14.5px;line-height:1.7}
.tck-plan{border:1.5px solid var(--tk-azure);border-radius:16px;padding:16px;background:linear-gradient(180deg,rgba(10,110,189,.06),transparent)}
.tck-plan-h{display:flex;align-items:baseline;justify-content:space-between;gap:10px}
.tck-plan-h b{font-size:18px}
.tck-price{font-size:15px;color:var(--tk-ink2)}.tck-price strong{font-size:24px;color:var(--tk-ink)}
.tck-vat{display:block;margin-top:2px;font-size:12.5px;color:var(--tk-mute)}
.tck-br{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-top:14px;padding-top:14px;border-top:1px dashed var(--tk-line)}
.tck-stepper{display:inline-flex;align-items:center;border:1px solid var(--tk-line);border-radius:999px;overflow:hidden}
.tck-stepper button{width:40px;height:40px;border:0;background:transparent;color:var(--tk-ink);font-size:20px;cursor:pointer}
.tck-stepper button:disabled{opacity:.35;cursor:default}
.tck-stepper output{min-width:38px;text-align:center;font-weight:700;font-size:17px}
.tck-sum{margin:16px 0 0;padding:12px 14px;border-radius:14px;background:var(--tk-bg);font-size:14px}
.tck-sum div{display:flex;justify-content:space-between;gap:10px;padding:3px 0;color:var(--tk-ink2)}
.tck-sum .t{color:var(--tk-ink);font-weight:700;font-size:16px;border-top:1px solid var(--tk-line);margin-top:6px;padding-top:9px}
.tck-f{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.tck-f .w{grid-column:1/-1}
@media(max-width:480px){.tck-f{grid-template-columns:1fr}}
.tck label{display:block;font-size:13.5px;font-weight:700;color:var(--tk-ink2);margin-bottom:5px}
.tck input,.tck select{width:100%;height:46px;padding:0 13px;border:1.5px solid var(--tk-line);border-radius:12px;background:var(--tk-card);color:var(--tk-ink);font:inherit;font-size:15.5px;outline:none;transition:border-color .15s,box-shadow .15s}
.tck input:focus,.tck select:focus{border-color:var(--tk-azure);box-shadow:0 0 0 3px rgba(10,110,189,.15)}
.tck .bad input,.tck .bad select{border-color:var(--tk-bad)}
.tck .err{display:none;margin-top:4px;color:var(--tk-bad);font-size:12.5px}
.tck .bad .err{display:block}
.tck .ltr{direction:ltr;text-align:left;unicode-bidi:isolate}
.tck-chk{display:flex;gap:9px;align-items:flex-start;margin-top:4px;font-size:13.5px;color:var(--tk-ink2);line-height:1.6;font-weight:500}
.tck-chk input{width:20px;height:20px;flex:0 0 20px;margin-top:2px;accent-color:var(--tk-azure)}
.tck-chk a{color:var(--tk-azure);font-weight:700}
.tck-act{display:flex;gap:10px;margin-top:20px}
.tck-btn{flex:1;display:inline-flex;align-items:center;justify-content:center;gap:8px;height:52px;padding:0 20px;border-radius:999px;border:1px solid transparent;background:var(--tk-azure);color:#fff;font:inherit;font-weight:700;font-size:16.5px;cursor:pointer;box-shadow:0 8px 24px -10px rgba(10,110,189,.8)}
.tck-btn:disabled{opacity:.6;cursor:progress}
.tck-btn.sec{flex:0 0 auto;background:transparent;color:var(--tk-ink);border-color:var(--tk-line);box-shadow:none}
.tck-alert{margin:0 0 14px;padding:12px 14px;border-radius:12px;background:rgba(194,65,12,.08);color:var(--tk-bad);font-size:14px;font-weight:600;line-height:1.6}
.tck-pay{margin-top:4px}
.tck-methods{display:flex;gap:8px;flex-wrap:wrap;margin:0 0 12px}
.tck-methods span{padding:5px 10px;border-radius:8px;border:1px solid var(--tk-line);font-size:12.5px;font-weight:700;color:var(--tk-ink2)}
.tck-apple{width:100%;height:48px;border-radius:12px;border:0;background:#000;color:#fff;font:inherit;font-weight:700;font-size:16px;cursor:pointer;margin-bottom:12px}
.tck-or{display:flex;align-items:center;gap:10px;margin:2px 0 12px;color:var(--tk-mute);font-size:12.5px}
.tck-or:before,.tck-or:after{content:"";flex:1;height:1px;background:var(--tk-line)}
.tck-hint{margin-top:12px;padding:10px 12px;border-radius:12px;background:var(--tk-bg);font-size:12.5px;color:var(--tk-ink2);line-height:1.8}
.tck-hint code{direction:ltr;unicode-bidi:isolate;font-family:ui-monospace,Menlo,monospace;font-size:12px;background:var(--tk-card);padding:1px 6px;border-radius:6px;border:1px solid var(--tk-line);cursor:pointer}
.tck-secure{margin-top:12px;text-align:center;font-size:12px;color:var(--tk-mute)}
.tck-spin{width:18px;height:18px;border-radius:50%;border:2.5px solid rgba(255,255,255,.4);border-top-color:#fff;animation:tck-r .8s linear infinite}
@keyframes tck-r{to{transform:rotate(360deg)}}
.tck-mysr{min-height:120px}
/* success page */
.tck-page{min-height:100vh;display:flex;align-items:center;justify-content:center;padding:28px 16px;background:var(--tk-bg)}
.tck-card{width:100%;max-width:560px;background:var(--tk-card);border-radius:24px;box-shadow:0 20px 60px -24px rgba(12,29,57,.3);padding:28px 24px 30px;border:1px solid var(--tk-line)}
.tck-ok{width:64px;height:64px;border-radius:50%;display:grid;place-items:center;background:rgba(21,128,61,.1);color:var(--tk-good);font-size:32px;margin-bottom:14px}
.tck-no{background:rgba(194,65,12,.1);color:var(--tk-bad)}
.tck-rows{margin:16px 0;border-radius:14px;background:var(--tk-bg);padding:6px 14px}
.tck-rows div{display:flex;justify-content:space-between;gap:12px;padding:9px 0;border-top:1px solid var(--tk-line);font-size:14px;color:var(--tk-ink2)}
.tck-rows div:first-child{border-top:0}
.tck-rows b{color:var(--tk-ink);text-align:end}
.tck-next{margin:0 0 6px;padding:0;list-style:none;font-size:14.5px;color:var(--tk-ink2);line-height:1.9}
.tck-next li:before{content:"✓";color:var(--tk-good);font-weight:700;margin-inline-end:8px}
.tck-brand{display:flex;align-items:center;gap:8px;margin-bottom:18px;font-weight:700;font-size:20px;color:var(--tk-ink);text-decoration:none}
