/* ═══════════════════════════════════════════════════════════
   SHEENIX PRO — design layer v1
   Dark mode · micro-interactions · command palette · polish
   Loads AFTER the inline styles in app.html and overrides them.
═══════════════════════════════════════════════════════════ */

/* ---------- LIGHT-MODE POLISH ---------- */

/* Signature: living gradient hairline under the topbar */
.topbar{position:sticky;}
.topbar::after{
  content:'';position:absolute;left:0;right:0;bottom:-1px;height:2px;
  background:linear-gradient(90deg,var(--teal) 0%,var(--blue) 30%,var(--amber) 65%,var(--gold) 100%);
  background-size:220% 100%;opacity:.85;
  animation:sxFlow 9s linear infinite;
}
@keyframes sxFlow{0%{background-position:0% 0;}100%{background-position:220% 0;}}

/* Cards & stats: softer depth, lift on hover */
.card{transition:box-shadow .22s ease,transform .22s ease;}
.card:hover{box-shadow:var(--shadow-md);}
.stat{border-radius:15px;}
.stat:hover{transform:translateY(-3px);box-shadow:0 12px 32px rgba(24,26,46,.12);}
.stat::before{
  content:'';position:absolute;right:-30px;top:-30px;width:110px;height:110px;border-radius:50%;
  background:radial-gradient(closest-side,var(--paper-2),transparent);pointer-events:none;
}

/* Primary buttons: gradient + press feel */
.btn-teal{
  background:linear-gradient(160deg,var(--teal-mid),var(--teal)) !important;
  box-shadow:0 6px 16px rgba(24,26,46,.22);
  transition:transform .15s ease,box-shadow .15s ease,filter .15s ease;
}
.btn-teal:hover{filter:brightness(1.12);box-shadow:0 9px 22px rgba(24,26,46,.3);transform:translateY(-1px);}
.btn:active{transform:translateY(0) scale(.97);}

/* Page switch animation */
.page.on{animation:sxPageIn .3s cubic-bezier(.22,.8,.3,1);}
@keyframes sxPageIn{from{opacity:0;transform:translateY(10px);}to{opacity:1;transform:none;}}

/* Focus ring for keyboard users */
:focus-visible{outline:2px solid var(--blue);outline-offset:2px;border-radius:6px;}

/* Slim branded scrollbar */
::-webkit-scrollbar{width:9px;height:9px;}
::-webkit-scrollbar-thumb{background:var(--ink-4);border-radius:8px;border:2px solid var(--paper);}
::-webkit-scrollbar-thumb:hover{background:var(--ink-3);}
::-webkit-scrollbar-track{background:transparent;}

/* Sidebar active item: glow bar */
.sb-item{position:relative;}
.sb-item.active::after{
  content:'';position:absolute;left:-10px;top:20%;bottom:20%;width:3px;border-radius:3px;
  background:linear-gradient(var(--amber),var(--gold));box-shadow:0 0 10px var(--amber);
}

@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{animation:none !important;transition:none !important;}
}

/* ---------- DARK MODE · "LEDGER NIGHT" ---------- */

html[data-theme="dark"]{
  --paper:#0D0E1A;--paper-2:#161829;--paper-3:#262A45;
  --surface:#161831;
  --ink:#EDEEF6;--ink-2:#C7C9DC;--ink-3:#9296B4;--ink-4:#5E6284;
  --rule:rgba(237,238,246,.09);
  --teal:#5B67F2;--teal-mid:#7B85FF;--teal-light:rgba(91,103,242,.16);--teal-rule:rgba(237,238,246,.14);
  --amber:#FF6B45;--amber-dark:#2F8FEA;--amber-pale:rgba(255,107,69,.15);
  --green:#2DD4A0;--green-pale:rgba(45,212,160,.14);
  --red:#FF5C8A;--red-pale:rgba(255,92,138,.14);
  --blue:#7C9BFF;--blue-pale:rgba(124,155,255,.14);
  --violet:#A88BFF;--violet-pale:rgba(168,139,255,.14);
  --gold:#FFC53D;--gold-pale:rgba(255,197,61,.14);
  --shadow-sm:0 1px 2px rgba(0,0,0,.4);
  --shadow-md:0 6px 22px rgba(0,0,0,.5);
  --shadow-lg:0 20px 54px rgba(0,0,0,.6);
  color-scheme:dark;
}
html[data-theme="dark"] body{background:var(--paper);color:var(--ink);}

/* Shell */
html[data-theme="dark"] .sidebar{background:#090A14;}
html[data-theme="dark"] .topbar{background:rgba(13,14,26,.86);border-bottom-color:var(--rule);}
html[data-theme="dark"] .sb-mark,
html[data-theme="dark"] .sb-avatar{background:var(--teal);}
html[data-theme="dark"] .stat:hover{box-shadow:0 12px 32px rgba(0,0,0,.55);}
html[data-theme="dark"] .stat::before{background:radial-gradient(closest-side,rgba(255,255,255,.05),transparent);}
html[data-theme="dark"] .modal{background:rgba(4,5,12,.72);}
html[data-theme="dark"] .btn-teal{box-shadow:0 6px 18px rgba(91,103,242,.35);}
html[data-theme="dark"] ::-webkit-scrollbar-thumb{border-color:var(--paper);}

/* Documents ALWAYS stay light — invoices & e-way bills print white
   even in dark mode, so PDFs are never dark. */
html[data-theme="dark"] .gst-doc,
html[data-theme="dark"] #billBody,
html[data-theme="dark"] .ewdoc{
  --paper:#FBF9F6;--paper-2:#F3EFE9;--paper-3:#E4DDD2;--surface:#FFFFFF;
  --ink:#1B1C28;--ink-2:#3A3B4C;--ink-3:#6E7085;--ink-4:#A2A4B8;
  --rule:rgba(27,28,40,.09);--teal:#0F2542;--teal-mid:#1E4976;
  background:#fff;color:#1B1C28;color-scheme:light;
}

/* ---------- COMMAND PALETTE (Ctrl/Cmd + K) ---------- */

.cmdk-back{
  position:fixed;inset:0;z-index:400;background:rgba(10,11,20,.5);backdrop-filter:blur(4px);
  display:none;align-items:flex-start;justify-content:center;padding:12vh 16px 16px;
}
.cmdk-back.open{display:flex;animation:sxFade .15s ease;}
@keyframes sxFade{from{opacity:0;}to{opacity:1;}}
.cmdk{
  width:100%;max-width:560px;background:var(--surface);border:1px solid var(--paper-3);
  border-radius:16px;box-shadow:var(--shadow-lg);overflow:hidden;
  animation:sxPop .18s cubic-bezier(.2,.9,.3,1.2);
}
@keyframes sxPop{from{opacity:0;transform:translateY(-8px) scale(.98);}to{opacity:1;transform:none;}}
.cmdk-input{
  width:100%;border:none;outline:none;background:transparent;color:var(--ink);
  font:600 1rem var(--sans);padding:17px 20px;border-bottom:1px solid var(--rule);
}
.cmdk-input::placeholder{color:var(--ink-4);font-weight:500;}
.cmdk-list{max-height:52vh;overflow-y:auto;padding:8px;}
.cmdk-group{font:700 .62rem var(--sans);text-transform:uppercase;letter-spacing:1px;color:var(--ink-4);padding:10px 12px 5px;}
.cmdk-item{
  display:flex;align-items:center;gap:12px;width:100%;text-align:left;
  padding:11px 12px;border-radius:10px;font:500 .9rem var(--sans);color:var(--ink-2);
  cursor:pointer;border:none;background:none;
}
.cmdk-item .ci{width:22px;text-align:center;font-size:1.05rem;}
.cmdk-item.sel,.cmdk-item:hover{background:var(--teal-light);color:var(--ink);}
.cmdk-item kbd{
  margin-left:auto;font:600 .66rem var(--mono);color:var(--ink-3);
  background:var(--paper-2);border:1px solid var(--paper-3);border-radius:5px;padding:2px 6px;
}
.cmdk-empty{padding:26px;text-align:center;color:var(--ink-3);font-size:.85rem;}
.cmdk-hint{
  display:flex;gap:14px;padding:9px 16px;border-top:1px solid var(--rule);
  font:500 .68rem var(--sans);color:var(--ink-4);background:var(--paper-2);
}
.cmdk-hint b{font-family:var(--mono);font-weight:600;color:var(--ink-3);}

/* ---------- NOTIFICATIONS DRAWER (announcements from admin) ---------- */
.sxn-back{position:fixed;inset:0;z-index:390;background:rgba(10,11,20,.4);display:none;}
.sxn-back.open{display:block;animation:sxFade .15s ease;}
.sxn{
  position:fixed;top:0;right:0;bottom:0;width:min(380px,94vw);z-index:395;
  background:var(--surface);border-left:1px solid var(--paper-3);box-shadow:var(--shadow-lg);
  transform:translateX(105%);transition:transform .28s cubic-bezier(.22,.8,.3,1);
  display:flex;flex-direction:column;
}
.sxn.open{transform:none;}
.sxn-h{padding:16px 18px;border-bottom:1px solid var(--rule);display:flex;align-items:center;gap:10px;}
.sxn-h b{font:700 1rem var(--sans);}
.sxn-x{margin-left:auto;width:32px;height:32px;border-radius:9px;background:var(--paper-2);font-size:1rem;}
.sxn-list{flex:1;overflow-y:auto;padding:10px;}
.sxn-item{
  display:flex;gap:11px;padding:13px;border-radius:12px;border:1px solid var(--rule);
  margin-bottom:9px;background:var(--paper-2);align-items:flex-start;
}
.sxn-item.unread{border-color:var(--teal);background:var(--teal-light);}
.sxn-ico{font-size:1.15rem;line-height:1.3;}
.sxn-t{font:700 .86rem var(--sans);color:var(--ink);}
.sxn-m{font:400 .8rem var(--sans);color:var(--ink-3);margin-top:2px;}
.sxn-d{font:500 .64rem var(--mono);color:var(--ink-4);margin-top:5px;}
.sxn-empty{padding:40px 20px;text-align:center;color:var(--ink-3);font-size:.85rem;}
.sx-maint{
  background:linear-gradient(90deg,var(--gold-pale),var(--amber-pale));
  border-bottom:1px solid var(--gold);color:var(--ink-2);
  font:600 .8rem var(--sans);padding:9px 16px;text-align:center;
}


/* ---------- PAYMENT REMINDERS ---------- */
.sxrem-btn{
  padding:6px 12px;border-radius:20px;font:700 .72rem var(--sans);cursor:pointer;
  background:var(--amber-pale);color:var(--amber-dark);border:1.5px solid transparent;
  transition:.15s;white-space:nowrap;
}
.sxrem-btn:hover{background:var(--amber);color:#fff;transform:translateY(-1px);box-shadow:0 6px 14px rgba(255,92,53,.3);}
.sxrem-back{
  position:fixed;inset:0;z-index:410;background:rgba(10,11,20,.5);backdrop-filter:blur(3px);
  display:flex;align-items:flex-end;justify-content:center;opacity:0;pointer-events:none;transition:.2s;
}
.sxrem-back.open{opacity:1;pointer-events:auto;}
.sxrem{
  width:100%;max-width:480px;background:var(--surface);border-radius:22px 22px 0 0;
  padding:10px 20px 22px;box-shadow:var(--shadow-lg);
  transform:translateY(40px);transition:transform .28s cubic-bezier(.22,.8,.3,1);
  max-height:88vh;overflow-y:auto;
}
.sxrem-back.open .sxrem{transform:none;}
@media(min-width:700px){
  .sxrem-back{align-items:center;}
  .sxrem{border-radius:20px;}
}
.sxrem-grip{width:40px;height:4px;border-radius:4px;background:var(--paper-3);margin:4px auto 12px;}
.sxrem-head{display:flex;align-items:center;gap:12px;margin-bottom:14px;}
.sxrem-ava{width:42px;height:42px;border-radius:12px;background:var(--teal);color:#fff;display:flex;align-items:center;justify-content:center;font:700 1.1rem var(--sans);}
.sxrem-name{font:700 1.02rem var(--sans);color:var(--ink);}
.sxrem-due{font:500 .78rem var(--sans);color:var(--ink-3);}
.sxrem-due b{color:var(--red);font-family:var(--mono);}
.sxrem-x{width:32px;height:32px;border-radius:9px;background:var(--paper-2);font-size:1.1rem;cursor:pointer;border:none;color:var(--ink-2);}
.sxrem-tabs{display:flex;gap:8px;margin-bottom:11px;}
.sxrem-tab{
  flex:1;padding:8px 6px;border-radius:10px;font:700 .76rem var(--sans);cursor:pointer;
  border:1.5px solid var(--paper-3);background:var(--paper-2);color:var(--ink-3);transition:.14s;
}
.sxrem-tab.on{background:var(--teal);border-color:var(--teal);color:#fff;}
.sxrem-msg{
  width:100%;min-height:170px;resize:vertical;border:1.5px solid var(--paper-3);border-radius:12px;
  background:var(--paper-2);color:var(--ink);font:500 .84rem var(--sans);line-height:1.55;
  padding:12px 14px;outline:none;
}
.sxrem-msg:focus{border-color:var(--teal);background:var(--surface);}
.sxrem-note{
  font:500 .72rem var(--sans);color:var(--ink-3);background:var(--teal-light);
  border-radius:10px;padding:9px 12px;margin:10px 0 12px;line-height:1.5;
}
.sxrem-btns{display:flex;gap:10px;}
.sxrem-go{
  flex:1;padding:13px;border-radius:12px;border:none;cursor:pointer;
  font:700 .88rem var(--sans);color:#fff;transition:.15s;
}
.sxrem-go:active{transform:scale(.97);}
.sxrem-go.wa{background:#25D366;box-shadow:0 6px 16px rgba(37,211,102,.35);}
.sxrem-go.wa:hover{filter:brightness(1.08);}
.sxrem-go.sms{background:var(--teal);box-shadow:0 6px 16px rgba(24,26,46,.3);}
.sxrem-go.sms:hover{filter:brightness(1.15);}
.sxrem-last{font:500 .7rem var(--mono);color:var(--ink-4);text-align:center;margin-top:10px;}

/* ---------- UPI COLLECT ---------- */
.sxupi-back{
  position:fixed;inset:0;z-index:430;background:rgba(10,11,20,.55);backdrop-filter:blur(3px);
  display:flex;align-items:flex-end;justify-content:center;opacity:0;pointer-events:none;transition:.2s;
}
.sxupi-back.open{opacity:1;pointer-events:auto;}
.sxupi{
  width:100%;max-width:420px;background:var(--surface);border-radius:22px 22px 0 0;
  padding:10px 20px 24px;box-shadow:var(--shadow-lg);text-align:center;
  transform:translateY(40px);transition:transform .28s cubic-bezier(.22,.8,.3,1);
  max-height:88vh;overflow-y:auto;
}
.sxupi-back.open .sxupi{transform:none;}
@media(min-width:700px){.sxupi-back{align-items:center;}.sxupi{border-radius:20px;}}
.sxupi-grip{width:40px;height:4px;border-radius:4px;background:var(--paper-3);margin:4px auto 12px;}
.sxupi-head{display:flex;align-items:center;gap:12px;margin-bottom:6px;text-align:left;}
.sxupi-title{font:700 1.02rem var(--sans);color:var(--ink);}
.sxupi-sub{font:500 .78rem var(--sans);color:var(--ink-3);}
.sxupi-amt{font:800 1.9rem var(--serif);color:var(--ink);margin:14px 0 4px;}
.sxupi-qr{display:flex;align-items:center;justify-content:center;padding:14px;background:#fff;border:1.5px solid var(--paper-3);border-radius:16px;width:222px;margin:6px auto 10px;}
.sxupi-qr img{image-rendering:pixelated;}
.sxupi-id{font:700 .82rem var(--mono);color:var(--ink-2);background:var(--paper-2);border-radius:20px;padding:6px 14px;display:inline-block;margin-bottom:10px;}
.sxupi-hint{font:500 .74rem var(--sans);color:var(--ink-4);line-height:1.5;margin-bottom:14px;}
.sxupi-empty{padding:20px 6px 8px;}
.sxupi-empty-ico{font-size:2.2rem;margin-bottom:8px;}
.sxupi-empty-t{font:700 1rem var(--sans);color:var(--ink);margin-bottom:6px;}
.sxupi-empty-d{font:500 .82rem var(--sans);color:var(--ink-3);line-height:1.55;margin-bottom:16px;}
.sxupi-rzp{font:600 .7rem var(--sans);color:var(--ink-4);margin-top:10px;}
.sxupi-loading{font:600 .84rem var(--sans);color:var(--ink-3);padding:30px 0;}


/* ---------- VOICE KHATA ---------- */
.sxv-fab{
  position:fixed;right:18px;bottom:150px;z-index:380;width:56px;height:56px;border-radius:50%;
  border:none;cursor:pointer;font-size:1.5rem;color:#fff;
  background:linear-gradient(140deg,var(--amber),#FF8A50);
  box-shadow:0 10px 26px rgba(255,92,53,.45);transition:.2s;
}
.sxv-fab:hover{transform:scale(1.08);}
.sxv-fab:active{transform:scale(.95);}
@media(min-width:901px){.sxv-fab{bottom:26px;right:26px;}}
.sxv-back{
  position:fixed;inset:0;z-index:420;background:rgba(10,11,20,.55);backdrop-filter:blur(3px);
  display:flex;align-items:flex-end;justify-content:center;opacity:0;pointer-events:none;transition:.2s;
}
.sxv-back.open{opacity:1;pointer-events:auto;}
.sxv{
  width:100%;max-width:440px;background:var(--surface);border-radius:22px 22px 0 0;
  padding:10px 22px 24px;box-shadow:var(--shadow-lg);
  transform:translateY(40px);transition:transform .28s cubic-bezier(.22,.8,.3,1);
}
.sxv-back.open .sxv{transform:none;}
@media(min-width:700px){.sxv-back{align-items:center;}.sxv{border-radius:20px;}}
.sxv-grip{width:40px;height:4px;border-radius:4px;background:var(--paper-3);margin:4px auto 12px;}
.sxv-top{display:flex;align-items:center;gap:10px;margin-bottom:16px;}
.sxv-top b{font:700 1.02rem var(--sans);color:var(--ink);flex:1;}
.sxv-lang{padding:6px 14px;border-radius:20px;border:1.5px solid var(--paper-3);background:var(--paper-2);
  font:700 .74rem var(--sans);color:var(--ink-2);cursor:pointer;}
.sxv-x{width:32px;height:32px;border-radius:9px;background:var(--paper-2);border:none;font-size:1.1rem;cursor:pointer;color:var(--ink-2);}
.sxv-listen{text-align:center;padding:8px 0 4px;}
.sxv-mic{
  position:relative;width:92px;height:92px;margin:0 auto 16px;border-radius:50%;cursor:pointer;
  background:linear-gradient(140deg,var(--amber),#FF8A50);display:flex;align-items:center;justify-content:center;
  font-size:2.3rem;box-shadow:0 12px 30px rgba(255,92,53,.4);transition:.2s;user-select:none;
}
.sxv-mic:active{transform:scale(.94);}
.sxv-ring{position:absolute;inset:0;border-radius:50%;border:2px solid var(--amber);opacity:0;}
.sxv-mic.live .sxv-ring{animation:sxvPulse 1.6s ease-out infinite;}
.sxv-mic.live .sxv-ring.r2{animation-delay:.8s;}
@keyframes sxvPulse{0%{opacity:.8;transform:scale(1);}100%{opacity:0;transform:scale(1.8);}}
.sxv-hint{font:500 .85rem var(--sans);color:var(--ink-2);line-height:1.6;}
.sxv-hint span{font-size:.74rem;color:var(--ink-4);font-family:var(--mono);}
.sxv-heard{min-height:26px;margin-top:12px;font:600 .95rem var(--sans);color:var(--teal);}
html[data-theme="dark"] .sxv-heard{color:var(--teal-mid);}
.sxv-row{display:flex;align-items:center;gap:10px;margin-bottom:11px;}
.sxv-row label{width:64px;font:700 .7rem var(--sans);text-transform:uppercase;letter-spacing:.5px;color:var(--ink-3);}
.sxv-in{flex:1;padding:11px 13px;border:1.5px solid var(--paper-3);border-radius:10px;background:var(--paper-2);
  color:var(--ink);font:600 .92rem var(--sans);outline:none;}
.sxv-in:focus{border-color:var(--teal);background:var(--surface);}
.sxv-new{font:700 .58rem var(--sans);background:var(--green-pale);color:var(--green);padding:3px 8px;border-radius:12px;}
.sxv-dir{display:flex;gap:9px;margin:4px 0 14px;}
.sxv-dir button{
  flex:1;padding:11px 8px;border-radius:11px;font:700 .78rem var(--sans);cursor:pointer;
  border:1.5px solid var(--paper-3);background:var(--paper-2);color:var(--ink-3);transition:.14s;
}
.sxv-dir button.on{border-color:var(--teal);background:var(--teal);color:#fff;}
.sxv-save{width:100%;padding:13px;border-radius:12px;border:none;cursor:pointer;color:#fff;
  font:700 .9rem var(--sans);background:linear-gradient(160deg,var(--teal-mid),var(--teal));
  box-shadow:0 6px 16px rgba(24,26,46,.28);}
.sxv-again{width:100%;margin-top:9px;padding:10px;border-radius:11px;cursor:pointer;
  border:1.5px solid var(--paper-3);background:var(--paper-2);color:var(--ink-2);font:700 .8rem var(--sans);}


/* ---------- UPGRADE / PLANS SHEET ---------- */
.sxup-back{position:fixed;inset:0;z-index:430;background:rgba(10,11,20,.55);backdrop-filter:blur(3px);
  display:flex;align-items:flex-end;justify-content:center;opacity:0;pointer-events:none;transition:.2s;}
.sxup-back.open{opacity:1;pointer-events:auto;}
.sxup{width:100%;max-width:470px;background:var(--surface);border-radius:22px 22px 0 0;
  padding:10px 20px 22px;box-shadow:var(--shadow-lg);max-height:90vh;overflow-y:auto;
  transform:translateY(40px);transition:transform .28s cubic-bezier(.22,.8,.3,1);}
.sxup-back.open .sxup{transform:none;}
@media(min-width:700px){.sxup-back{align-items:center;}.sxup{border-radius:20px;}}
.sxup-grip{width:40px;height:4px;border-radius:4px;background:var(--paper-3);margin:4px auto 12px;}
.sxup-top{display:flex;align-items:center;margin-bottom:13px;}
.sxup-top b{font:700 1.05rem var(--sans);color:var(--ink);flex:1;}
.sxup-x{width:32px;height:32px;border-radius:9px;background:var(--paper-2);border:none;font-size:1.1rem;cursor:pointer;color:var(--ink-2);}
.sxup-freebanner{background:linear-gradient(92deg,var(--gold-pale),var(--amber-pale));border:1px solid var(--gold);
  border-radius:12px;padding:11px 14px;font:500 .82rem var(--sans);color:var(--ink-2);margin-bottom:13px;}
.sxup-plans{display:flex;flex-direction:column;gap:10px;margin-bottom:13px;}
.sxup-plan{border:1.5px solid var(--paper-3);border-radius:14px;padding:13px 15px;cursor:pointer;transition:.15s;position:relative;}
.sxup-plan:hover{border-color:var(--ink-4);}
.sxup-plan.on{border-color:var(--teal);background:var(--teal-light);box-shadow:0 6px 18px rgba(24,26,46,.12);}
.sxup-plan.cur{opacity:.75;}
.sxup-pn{font:700 .95rem var(--sans);color:var(--ink);display:flex;align-items:center;gap:8px;}
.sxup-curtag{font:700 .56rem var(--sans);letter-spacing:.5px;background:var(--green-pale);color:var(--green);padding:2px 8px;border-radius:12px;}
.sxup-pp{margin:3px 0 2px;font:400 .85rem var(--sans);color:var(--ink-3);}
.sxup-pp b{font:700 1.2rem var(--mono);color:var(--ink);}
.sxup-pp b.freeb{color:var(--green);}
.sxup-pp s{color:var(--ink-4);font-family:var(--mono);}
.sxup-pp span{font-size:.72rem;}
.sxup-pd{font:500 .74rem var(--sans);color:var(--ink-3);}
.sxup-coupon{display:flex;gap:9px;margin-bottom:6px;}
.sxup-cin{flex:1;padding:11px 13px;border:1.5px solid var(--paper-3);border-radius:11px;background:var(--paper-2);
  color:var(--ink);font:700 .85rem var(--mono);outline:none;}
.sxup-cin:focus{border-color:var(--teal);background:var(--surface);}
.sxup-capply{padding:0 18px;border-radius:11px;border:1.5px solid var(--paper-3);background:var(--paper-2);
  font:700 .8rem var(--sans);color:var(--ink-2);cursor:pointer;}
.sxup-capply:hover{background:var(--paper-3);}
.sxup-cmsg{min-height:18px;font:600 .74rem var(--sans);margin-bottom:8px;}
.sxup-cmsg.good{color:var(--green);}
.sxup-cmsg.bad{color:var(--red);}
.sxup-pay{width:100%;padding:14px;border-radius:13px;border:none;cursor:pointer;color:#fff;
  font:700 .95rem var(--sans);background:linear-gradient(160deg,var(--teal-mid),var(--teal));
  box-shadow:0 8px 20px rgba(24,26,46,.3);transition:.15s;}
.sxup-pay:hover{filter:brightness(1.12);}
.sxup-pay:active{transform:scale(.98);}
.sxup-fine{text-align:center;font:500 .68rem var(--sans);color:var(--ink-4);margin-top:10px;}

/* ---------- MOBILE NAV — brighter, more intentional (fixes "black bar" look) ---------- */
@media(max-width:860px){
  .mob-nav{
    background:var(--surface) !important;
    border-top:1px solid var(--paper-3);
    box-shadow:0 -4px 20px rgba(24,26,46,.08);
  }
  .mob-ico{filter:none !important;opacity:.42;font-size:1.28rem;}
  .mob-tab.on .mob-ico{opacity:1;}
  .mob-tab.on{color:var(--amber-dark);}
  .mob-tab.on::before{background:linear-gradient(90deg,var(--amber),var(--gold));}
  .mob-fab{background:linear-gradient(150deg,var(--amber),#FF7A4D) !important;}
}

/* ---------- SETTINGS back-to-account link ---------- */
.settings-back{
  display:inline-flex;align-items:center;gap:5px;margin-bottom:10px;
  padding:7px 14px 7px 10px;border-radius:20px;border:1.5px solid var(--paper-3);
  background:var(--paper-2);color:var(--ink-2);font:700 .78rem var(--sans);cursor:pointer;
}
.settings-back:hover{background:var(--paper-3);}

/* ---------- MORE / ACCOUNT PAGE ---------- */
.more-profile{
  display:flex;align-items:center;gap:14px;background:var(--surface);
  border:1px solid var(--paper-3);border-radius:16px;padding:16px 18px;
  margin-bottom:18px;cursor:pointer;transition:.15s;
}
.more-profile:hover{box-shadow:var(--shadow-md);}
.more-ava{
  width:54px;height:54px;border-radius:15px;background:var(--teal);color:#fff;
  display:flex;align-items:center;justify-content:center;font:700 1.4rem var(--serif);flex-shrink:0;
}
.more-name{font:700 1.05rem var(--sans);color:var(--ink);}
.more-biz{font:500 .82rem var(--sans);color:var(--ink-3);margin-top:1px;}
.more-strength{height:5px;border-radius:6px;background:var(--paper-3);margin-top:9px;overflow:hidden;}
.more-strength-bar{display:block;height:100%;background:linear-gradient(90deg,var(--green),var(--teal));border-radius:6px;transition:width .5s ease;}
.more-strength-txt{font:600 .7rem var(--sans);color:var(--ink-4);margin-top:5px;}
.more-edit{
  flex-shrink:0;padding:8px 16px;border-radius:10px;border:1.5px solid var(--teal);
  background:transparent;color:var(--teal);font:700 .8rem var(--sans);cursor:pointer;
}
.more-edit:hover{background:var(--teal);color:#fff;}
.more-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:11px;margin-bottom:18px;}
.more-tile{
  background:var(--surface);border:1px solid var(--paper-3);border-radius:14px;
  padding:16px 8px;display:flex;flex-direction:column;align-items:center;gap:9px;
  cursor:pointer;transition:.15s;text-align:center;font:600 .76rem var(--sans);color:var(--ink-2);
}
.more-tile:hover{transform:translateY(-2px);box-shadow:var(--shadow-md);}
.more-tico{width:42px;height:42px;border-radius:12px;display:flex;align-items:center;justify-content:center;font-size:1.2rem;}
.more-list{background:var(--surface);border:1px solid var(--paper-3);border-radius:14px;overflow:hidden;margin-bottom:18px;}
.more-row{display:flex;align-items:center;gap:12px;padding:14px 16px;cursor:pointer;border-bottom:1px solid var(--rule);font:600 .88rem var(--sans);color:var(--ink-2);}
.more-row:last-child{border-bottom:none;}
.more-row:hover{background:var(--paper-2);}
.more-ric{font-size:1.1rem;width:22px;text-align:center;}
.more-rarr{margin-left:auto;color:var(--ink-4);font-size:1.1rem;}
.more-logout{
  width:100%;padding:13px;border-radius:12px;border:1.5px solid var(--red-pale);
  background:var(--red-pale);color:var(--red);font:700 .88rem var(--sans);cursor:pointer;margin-bottom:20px;
}
.more-logout:hover{background:var(--red);color:#fff;}

/* ---------- PARTY DETAIL SHEET ---------- */
.sxpd-back{
  position:fixed;inset:0;z-index:400;background:rgba(10,11,20,.5);backdrop-filter:blur(3px);
  display:flex;align-items:flex-end;justify-content:center;opacity:0;pointer-events:none;transition:.2s;
}
.sxpd-back.open{opacity:1;pointer-events:auto;}
.sxpd{
  width:100%;max-width:480px;background:var(--surface);border-radius:22px 22px 0 0;
  padding:10px 20px 22px;box-shadow:var(--shadow-lg);max-height:90vh;overflow-y:auto;
  transform:translateY(40px);transition:transform .28s cubic-bezier(.22,.8,.3,1);
}
.sxpd-back.open .sxpd{transform:none;}
@media(min-width:700px){.sxpd-back{align-items:center;}.sxpd{border-radius:20px;}}
.sxpd-grip{width:40px;height:4px;border-radius:4px;background:var(--paper-3);margin:4px auto 12px;}
.sxpd-top{display:flex;align-items:center;gap:13px;margin-bottom:14px;}
.sxpd-ava{width:50px;height:50px;border-radius:14px;color:#fff;display:flex;align-items:center;justify-content:center;font:700 1.3rem var(--serif);flex-shrink:0;}
.sxpd-name{font:700 1.08rem var(--sans);color:var(--ink);}
.sxpd-sub{font:500 .8rem var(--sans);color:var(--ink-3);}
.sxpd-x{width:32px;height:32px;border-radius:9px;background:var(--paper-2);border:none;font-size:1.1rem;cursor:pointer;color:var(--ink-2);flex-shrink:0;}
.sxpd-quick{display:flex;gap:9px;margin-bottom:14px;flex-wrap:wrap;}
.sxpd-q{
  flex:1;text-align:center;padding:11px;border-radius:11px;background:var(--paper-2);
  border:1.5px solid var(--paper-3);color:var(--ink-2);font:700 .82rem var(--sans);text-decoration:none;min-width:120px;
}
.sxpd-q.wa{background:#E9FBF1;border-color:#B7EFD1;color:#00795A;}
.sxpd-q.nophone{flex:1;background:var(--amber-pale);border:1px dashed var(--amber);color:var(--amber-dark);font:600 .8rem var(--sans);padding:11px;border-radius:11px;text-align:center;}
.sxpd-q.nophone button{color:var(--teal);font-weight:800;text-decoration:underline;background:none;border:none;cursor:pointer;font-size:.8rem;}
.sxpd-bal{background:var(--paper-2);border-radius:14px;padding:16px;text-align:center;margin-bottom:16px;}
.sxpd-bal-l{font:600 .74rem var(--sans);color:var(--ink-3);text-transform:uppercase;letter-spacing:.5px;}
.sxpd-bal-v{font:800 1.7rem var(--mono);margin-top:4px;}
.sxpd-actions{display:grid;grid-template-columns:repeat(4,1fr);gap:9px;margin-bottom:20px;}
.sxpd-act{
  display:flex;flex-direction:column;align-items:center;gap:5px;padding:11px 4px;
  border-radius:12px;border:1.5px solid var(--paper-3);background:var(--paper-2);
  cursor:pointer;font-size:1.1rem;color:var(--ink-2);
}
.sxpd-act span{font-size:.66rem;font-weight:700;}
.sxpd-act:hover{background:var(--paper-3);}
.sxpd-act.warn:hover{background:var(--red-pale);border-color:var(--red);color:var(--red);}
.sxpd-hist-h{font:700 .78rem var(--sans);text-transform:uppercase;letter-spacing:.5px;color:var(--ink-3);margin-bottom:9px;}
.sxpd-hist{display:flex;flex-direction:column;gap:8px;}
.sxpd-h-row{display:flex;align-items:center;gap:11px;padding:10px 12px;background:var(--paper-2);border-radius:11px;}
.sxpd-h-ico{width:32px;height:32px;border-radius:9px;display:flex;align-items:center;justify-content:center;font-weight:800;flex-shrink:0;}
.sxpd-h-note{font:600 .82rem var(--sans);color:var(--ink);}
.sxpd-h-date{font:500 .68rem var(--mono);color:var(--ink-4);margin-top:1px;}
.sxpd-h-amt{font:700 .86rem var(--mono);flex-shrink:0;}
.sxpd-h-empty{text-align:center;padding:24px;color:var(--ink-4);font-size:.82rem;}

/* ---------- CUSTOMER PICKER DROPDOWN (replaces broken native datalist) ---------- */
.sxcp-drop{
  display:none;position:absolute;left:0;right:0;top:calc(100% + 4px);z-index:60;
  background:var(--surface);border:1.5px solid var(--paper-3);border-radius:12px;
  box-shadow:var(--shadow-lg);max-height:260px;overflow-y:auto;padding:6px;
}
.sxcp-item{
  display:flex;align-items:center;gap:10px;padding:9px 10px;border-radius:9px;cursor:pointer;
}
.sxcp-item:hover,.sxcp-item.on{background:var(--teal-light);}
.sxcp-ava{width:26px;height:26px;border-radius:8px;color:#fff;display:flex;align-items:center;justify-content:center;font:700 .74rem var(--sans);flex-shrink:0;}
.sxcp-n{flex:1;font:600 .84rem var(--sans);color:var(--ink);min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
.sxcp-c{display:block;font:500 .68rem var(--sans);color:var(--ink-4);font-weight:500;}
.sxcp-bal{font:700 .74rem var(--mono);flex-shrink:0;}
.sxcp-add{border-top:1px solid var(--rule);margin-top:4px;padding-top:10px;}
.sxcp-add .sxcp-n b{color:var(--teal);}

/* ---------- DASHBOARD hero graphic ---------- */
.dash-hero{position:relative;overflow:hidden;border-radius:18px;margin-bottom:18px;
  background:linear-gradient(120deg,var(--paper-2),var(--paper));}
.dash-hero-svg{position:absolute;right:0;top:0;height:100%;width:60%;pointer-events:none;}
.dash-hero .phead{position:relative;z-index:1;padding:20px 22px;margin-bottom:0;}
@media(max-width:640px){.dash-hero-svg{width:80%;opacity:.7;}}

/* ---------- QUICK ACTIONS — colorful tiles ---------- */
.qa-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(140px,1fr));gap:11px;}
.qa-tile{
  display:flex;flex-direction:column;align-items:center;gap:9px;padding:18px 10px;
  border:1px solid var(--paper-3);border-radius:14px;background:var(--surface);
  font:600 .8rem var(--sans);color:var(--ink-2);cursor:pointer;transition:.18s;text-align:center;
}
.qa-tile:hover{transform:translateY(-3px);box-shadow:var(--shadow-md);border-color:var(--ink-4);}
.qa-tile:active{transform:translateY(0) scale(.97);}
.qa-ico{width:44px;height:44px;border-radius:13px;display:flex;align-items:center;justify-content:center;font-size:1.3rem;}

/* ---------- FLOATING SIDE DOCK (Voice · Theme · Plans) ---------- */
.sxdock{
  position:fixed;right:18px;bottom:150px;z-index:380;
  display:flex;flex-direction:column;align-items:center;gap:13px;
}
@media(min-width:901px){.sxdock{bottom:26px;right:26px;}}
.sxdock-btn{
  border:none;cursor:pointer;color:#fff;position:relative;
  display:flex;align-items:center;justify-content:center;
  transition:transform .15s ease,box-shadow .15s ease,filter .15s ease;
}
.sxdock-btn:hover{transform:scale(1.08);filter:brightness(1.08);}
.sxdock-btn:active{transform:scale(.93);}
.sxdock-mic{
  width:56px;height:56px;border-radius:50%;font-size:1.5rem;
  background:linear-gradient(140deg,var(--amber),#FF8A50);
  box-shadow:0 10px 26px rgba(255,92,53,.45);
}
.sxdock-ring{position:absolute;inset:0;border-radius:50%;border:1.5px solid var(--amber);opacity:0;
  animation:sxdockPulse 2.6s ease-out infinite;}
@keyframes sxdockPulse{0%{opacity:.7;transform:scale(1);}100%{opacity:0;transform:scale(1.7);}}
.sxdock-theme{
  width:44px;height:44px;border-radius:50%;font-size:1.05rem;
  background:var(--teal);box-shadow:0 8px 18px rgba(24,26,46,.3);
}
.sxdock-plan{
  width:44px;height:44px;border-radius:50%;font-size:1.05rem;
  background:linear-gradient(140deg,#7A3DF5,#A78BFA);
  box-shadow:0 8px 18px rgba(122,61,245,.35);
}
@media (prefers-reduced-motion:reduce){.sxdock-ring{animation:none;}}

/* ---------- TOPBAR BRAND — unique premium look ---------- */
.tb-brand{
  display:flex;align-items:center;gap:11px;cursor:pointer;min-width:0;
  padding:6px 14px 6px 6px;border-radius:30px;transition:.18s;
  background:var(--paper-2);border:1px solid var(--paper-3);
}
.tb-brand:hover{background:var(--paper-3);box-shadow:var(--shadow-sm);}
.tb-brand-logo{
  width:36px;height:36px;border-radius:50%;color:#fff;flex-shrink:0;
  display:flex;align-items:center;justify-content:center;overflow:hidden;
  font-family:var(--serif);font-weight:700;font-size:1rem;position:relative;
  background:linear-gradient(140deg,var(--teal-mid),var(--teal));
  box-shadow:0 0 0 2px var(--surface),0 0 0 3.5px var(--amber);
}
.tb-brand-logo img{width:100%;height:100%;object-fit:cover;}
.tb-brand-txt{min-width:0;display:flex;flex-direction:column;line-height:1.2;}
.tb-brand-name{
  font-family:var(--serif);font-weight:800;font-size:1.02rem;color:var(--ink);letter-spacing:-.01em;
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:46vw;
}
.tb-brand-sub{
  font-size:.64rem;font-weight:700;color:var(--amber-dark);letter-spacing:.4px;text-transform:uppercase;
}
@media(max-width:480px){.tb-brand{padding:4px 10px 4px 4px;}.tb-brand-logo{width:32px;height:32px;}
  .tb-brand-name{max-width:36vw;font-size:.9rem;}.tb-brand-sub{display:none;}}


/* ---------- DATA BACKUP CARD ---------- */
.sxb-status{display:flex;gap:12px;align-items:flex-start;background:var(--green-pale);
  border:1px solid var(--green);border-radius:12px;padding:13px 15px;margin-bottom:15px;}
.sxb-dot{width:10px;height:10px;border-radius:50%;background:var(--green);margin-top:5px;flex-shrink:0;
  box-shadow:0 0 0 4px rgba(0,179,126,.18);}
.sxb-status b{font:700 .9rem var(--sans);color:var(--ink);}
.sxb-sub{font:500 .78rem var(--sans);color:var(--ink-3);margin-top:3px;line-height:1.5;}
.sxb-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:10px;}
.sxb-btn{display:flex;flex-direction:column;align-items:center;gap:8px;padding:15px 8px;
  border:1.5px solid var(--paper-3);border-radius:13px;background:var(--paper-2);cursor:pointer;
  font:700 .8rem var(--sans);color:var(--ink-2);transition:.15s;}
.sxb-btn span{font-size:1.4rem;}
.sxb-btn:hover{transform:translateY(-2px);box-shadow:var(--shadow-md);border-color:var(--teal);color:var(--teal);}
.sxb-last{font:500 .74rem var(--sans);color:var(--ink-4);margin-top:12px;text-align:center;}

/* ═══════════════════════════════════════════════════════════
   SMART DASHBOARD — health score, trends, insights
═══════════════════════════════════════════════════════════ */
.sxs{margin-bottom:20px;}
.sxs-row{display:grid;grid-template-columns:340px 1fr;gap:14px;margin-bottom:20px;}
@media(max-width:900px){.sxs-row{grid-template-columns:1fr;}}

.sxs-card{
  background:var(--surface);border:1px solid var(--paper-3);border-radius:18px;
  padding:18px 20px;position:relative;overflow:hidden;
}
.sxs-card::before{
  content:'';position:absolute;right:-60px;top:-60px;width:180px;height:180px;border-radius:50%;
  background:radial-gradient(closest-side,var(--paper-2),transparent);pointer-events:none;
}
.sxs-h{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-bottom:14px;position:relative;}
.sxs-t{font:700 .9rem var(--sans);color:var(--ink);}
.sxs-sub{font:700 .78rem var(--mono);color:var(--ink-3);}
.sxs-badge{
  font:800 .56rem var(--sans);letter-spacing:1px;padding:3px 9px;border-radius:20px;
  background:var(--green-pale);color:var(--green);position:relative;
}
.sxs-badge::before{
  content:'';display:inline-block;width:5px;height:5px;border-radius:50%;background:var(--green);
  margin-right:5px;vertical-align:middle;animation:sxsBlink 1.8s ease-in-out infinite;
}
@keyframes sxsBlink{0%,100%{opacity:1;}50%{opacity:.25;}}

/* ── gauge ── */
.sxg{position:relative;width:150px;height:150px;margin:0 auto 16px;}
.sxg-svg{width:100%;height:100%;transform:rotate(-90deg);}
.sxg-track{fill:none;stroke:var(--paper-3);stroke-width:9;}
.sxg-fill{fill:none;stroke-width:9;stroke-linecap:round;
  transition:stroke-dashoffset 1.4s cubic-bezier(.22,.8,.3,1);}
.sxg-mid{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;}
.sxg-num{font:800 2.5rem var(--serif);color:var(--ink);letter-spacing:-.04em;line-height:1;}
.sxg-band{font:800 .72rem var(--sans);margin-top:3px;letter-spacing:.3px;}
.sxg-parts{display:flex;flex-direction:column;gap:11px;position:relative;}
.sxg-p-top{display:flex;justify-content:space-between;font:600 .76rem var(--sans);color:var(--ink-2);}
.sxg-p-top b{font-family:var(--mono);color:var(--ink);}
.sxg-p-track{height:5px;border-radius:5px;background:var(--paper-3);overflow:hidden;margin-top:4px;}
.sxg-p-track i{display:block;height:100%;width:var(--w);border-radius:5px;
  background:linear-gradient(90deg,var(--teal),var(--teal-mid));
  animation:sxsGrow 1s cubic-bezier(.22,.8,.3,1) both;}
@keyframes sxsGrow{from{width:0;}}
.sxg-p-tip{font:500 .68rem var(--sans);color:var(--ink-4);margin-top:3px;}

/* ── bar chart ── */
.sxc{display:flex;align-items:flex-end;gap:7px;height:130px;margin-bottom:16px;position:relative;}
.sxc-col{flex:1;display:flex;flex-direction:column;align-items:center;gap:6px;height:100%;}
.sxc-bar-wrap{flex:1;width:100%;display:flex;align-items:flex-end;}
.sxc-bar{
  width:100%;border-radius:7px 7px 3px 3px;height:var(--h);
  background:linear-gradient(180deg,var(--amber),#FF8A50);
  animation:sxcRise .8s cubic-bezier(.22,.8,.3,1) both;animation-delay:var(--d);
  transition:filter .15s;
}
.sxc-col:hover .sxc-bar{filter:brightness(1.15);}
@keyframes sxcRise{from{height:0;opacity:.3;}}
.sxc-lbl{font:700 .66rem var(--sans);color:var(--ink-4);}

.sxs-split{display:grid;grid-template-columns:1fr 1fr;gap:10px;position:relative;}
.sxs-money{
  display:flex;flex-direction:column;gap:3px;padding:12px 14px;border-radius:13px;
  border:1.5px solid var(--paper-3);background:var(--paper-2);cursor:pointer;
  text-align:left;transition:.16s;
}
.sxs-money:hover{transform:translateY(-2px);box-shadow:var(--shadow-md);}
.sxs-m-l{font:700 .68rem var(--sans);text-transform:uppercase;letter-spacing:.5px;color:var(--ink-3);}
.sxs-m-v{font:800 1.2rem var(--mono);}
.sxs-money.in .sxs-m-v{color:var(--green);}
.sxs-money.out .sxs-m-v{color:var(--red);}

/* ── insights ── */
.sxs-ins-h{
  display:flex;align-items:center;gap:8px;font:700 .88rem var(--sans);
  color:var(--ink);margin-bottom:11px;flex-wrap:wrap;
}
.sxs-spark{color:var(--amber);animation:sxsSpin 6s linear infinite;display:inline-block;}
@keyframes sxsSpin{to{transform:rotate(360deg);}}
.sxs-auto{font:500 .7rem var(--sans);color:var(--ink-4);letter-spacing:.2px;}
.sxs-ins{display:flex;flex-direction:column;gap:10px;}
.sxs-i{
  display:flex;align-items:center;gap:13px;padding:14px 16px;
  background:var(--surface);border:1px solid var(--paper-3);border-radius:14px;
  border-left:3px solid var(--tone);
  animation:sxsIn .5s cubic-bezier(.22,.8,.3,1) both;animation-delay:var(--d);
  transition:.16s;
}
.sxs-i:hover{transform:translateX(3px);box-shadow:var(--shadow-md);}
@keyframes sxsIn{from{opacity:0;transform:translateY(10px);}}
.sxs-i-ico{
  width:40px;height:40px;border-radius:12px;background:var(--pale);
  display:flex;align-items:center;justify-content:center;font-size:1.2rem;flex-shrink:0;
}
.sxs-i-body{flex:1;min-width:0;}
.sxs-i-t{font:700 .88rem var(--sans);color:var(--ink);}
.sxs-i-d{font:500 .78rem var(--sans);color:var(--ink-3);margin-top:2px;line-height:1.5;}
.sxs-i-cta{
  flex-shrink:0;padding:8px 14px;border-radius:10px;border:1.5px solid var(--tone);
  background:transparent;color:var(--tone);font:700 .76rem var(--sans);cursor:pointer;
  white-space:nowrap;transition:.15s;
}
.sxs-i-cta:hover{background:var(--tone);color:#fff;}
@media(max-width:640px){
  .sxs-i{flex-wrap:wrap;}
  .sxs-i-cta{width:100%;margin-top:4px;}
}
@media (prefers-reduced-motion:reduce){
  .sxs-i,.sxc-bar,.sxg-p-track i,.sxs-spark,.sxs-badge::before{animation:none !important;}
}

/* ═══════════════════════════════════════════════════════════
   RECYCLE BIN + COLLECTIONS
═══════════════════════════════════════════════════════════ */
.sxbin-count,.sxcoll-total{
  font:700 .82rem var(--sans);color:var(--ink-3);margin-bottom:12px;
}
.sxbin-empty{
  background:var(--surface);border:1px solid var(--paper-3);border-radius:16px;
  padding:44px 22px;text-align:center;
}
.sxbin-empty h3{font:700 1.05rem var(--sans);color:var(--ink);margin:10px 0 6px;}
.sxbin-empty p{font:500 .84rem var(--sans);color:var(--ink-3);max-width:380px;margin:0 auto;line-height:1.6;}

.sxbin-row{
  display:flex;align-items:center;gap:13px;background:var(--surface);
  border:1px solid var(--paper-3);border-radius:14px;padding:14px 16px;margin-bottom:10px;
  transition:.15s;
}
.sxbin-row:hover{box-shadow:var(--shadow-md);}
.sxbin-ico{
  width:40px;height:40px;border-radius:12px;background:var(--paper-2);
  display:flex;align-items:center;justify-content:center;font-size:1.15rem;flex-shrink:0;
}
.sxbin-body{flex:1;min-width:0;}
.sxbin-title{font:700 .9rem var(--sans);color:var(--ink);}
.sxbin-meta{font:500 .75rem var(--sans);color:var(--ink-3);margin-top:2px;}
.sxbin-left{font:600 .7rem var(--mono);color:var(--amber-dark);margin-top:3px;}
.sxbin-acts{display:flex;gap:8px;flex-shrink:0;}
.sxbin-undo,.sxbin-del{
  padding:8px 14px;border-radius:10px;font:700 .76rem var(--sans);cursor:pointer;
  border:1.5px solid var(--paper-3);background:var(--paper-2);transition:.15s;
}
.sxbin-undo{color:var(--teal);border-color:var(--teal);}
.sxbin-undo:hover{background:var(--teal);color:#fff;}
.sxbin-del{color:var(--red);}
.sxbin-del:hover{background:var(--red);color:#fff;border-color:var(--red);}
@media(max-width:640px){
  .sxbin-row{flex-wrap:wrap;}
  .sxbin-acts{width:100%;}
  .sxbin-undo,.sxbin-del{flex:1;}
}

/* collections list */
.sxcoll-row{
  display:flex;align-items:center;gap:13px;background:var(--surface);
  border:1px solid var(--paper-3);border-radius:14px;padding:13px 16px;margin-bottom:10px;
}
.sxcoll-row:hover{box-shadow:var(--shadow-md);}
.sxcoll-ava{
  width:38px;height:38px;border-radius:11px;background:var(--teal);color:#fff;
  display:flex;align-items:center;justify-content:center;font:700 1rem var(--sans);flex-shrink:0;
}
.sxcoll-body{flex:1;min-width:0;}
.sxcoll-name{font:700 .9rem var(--sans);color:var(--ink);}
.sxcoll-state{font:600 .74rem var(--sans);margin-top:2px;}
.sxcoll-state.over{color:var(--red);}
.sxcoll-state.today{color:var(--amber-dark);}
.sxcoll-state.soon{color:var(--green);}
.sxcoll-state.none{color:var(--ink-4);font-weight:500;}
.sxcoll-right{display:flex;flex-direction:column;align-items:flex-end;gap:6px;flex-shrink:0;}
.sxcoll-amt{font:800 .95rem var(--mono);color:var(--red);}
.sxcoll-date{
  border:1.5px solid var(--paper-3);border-radius:9px;padding:5px 9px;
  font:600 .74rem var(--sans);background:var(--paper-2);color:var(--ink);cursor:pointer;
}
.sxcoll-date:focus{border-color:var(--teal);outline:none;}
@media(max-width:640px){
  .sxcoll-row{flex-wrap:wrap;}
  .sxcoll-right{width:100%;flex-direction:row;justify-content:space-between;align-items:center;}
}

/* dashboard due strip */
.sxdue{
  background:linear-gradient(100deg,var(--gold-pale),var(--amber-pale));
  border:1px solid var(--gold);border-radius:16px;padding:15px 18px;margin-bottom:18px;
}
.sxdue-top{display:flex;align-items:center;gap:12px;flex-wrap:wrap;}
.sxdue-ico{font-size:1.5rem;}
.sxdue-top b{font:700 .95rem var(--sans);color:var(--ink);}
.sxdue-sub{font:500 .78rem var(--sans);color:var(--ink-2);}
.sxdue-all{
  margin-left:auto;padding:8px 15px;border-radius:10px;border:1.5px solid var(--ink);
  background:transparent;color:var(--ink);font:700 .78rem var(--sans);cursor:pointer;
}
.sxdue-all:hover{background:var(--ink);color:var(--paper);}
.sxdue-chips{display:flex;gap:8px;flex-wrap:wrap;margin-top:12px;}
.sxdue-chip{
  padding:7px 13px;border-radius:20px;border:1px solid rgba(0,0,0,.12);
  background:rgba(255,255,255,.75);color:var(--ink-2);
  font:600 .76rem var(--sans);cursor:pointer;transition:.15s;
}
.sxdue-chip:hover{background:#fff;transform:translateY(-1px);}
.sxdue-chip.over{border-color:var(--red);color:var(--red);}

/* ═══════════════════════════════════════════════════════════
   SHEENIX INTELLIGENCE
═══════════════════════════════════════════════════════════ */
.sxi-hero{
  background:linear-gradient(125deg,var(--teal),var(--teal-mid));
  border-radius:20px;padding:26px 28px;margin-bottom:18px;color:#fff;
  display:flex;gap:24px;align-items:center;flex-wrap:wrap;position:relative;overflow:hidden;
}
.sxi-hero::before{
  content:'';position:absolute;right:-70px;top:-70px;width:260px;height:260px;border-radius:50%;
  background:radial-gradient(closest-side,rgba(255,255,255,.13),transparent);pointer-events:none;
}
.sxi-hero-l{flex:1;min-width:250px;position:relative;}
.sxi-tag{
  font:800 .62rem var(--sans);letter-spacing:1.6px;color:var(--gold);margin-bottom:9px;
}
.sxi-hero h2{
  font-family:var(--serif);font-weight:800;font-size:clamp(1.7rem,3.6vw,2.5rem);
  letter-spacing:-.03em;line-height:1.1;
}
.sxi-hero h2 span{font-size:.5em;font-weight:600;opacity:.72;display:block;margin-top:4px;letter-spacing:0;}
.sxi-hero p{font:500 .84rem var(--sans);color:rgba(255,255,255,.72);margin-top:10px;max-width:46ch;line-height:1.6;}
.sxi-hero-r{display:flex;gap:14px;position:relative;}
.sxi-stat{
  background:rgba(255,255,255,.1);border:1px solid rgba(255,255,255,.16);
  border-radius:14px;padding:14px 18px;text-align:center;min-width:104px;backdrop-filter:blur(6px);
}
.sxi-stat b{display:block;font:800 1.5rem var(--mono);letter-spacing:-.03em;}
.sxi-stat span{font:600 .66rem var(--sans);opacity:.7;text-transform:uppercase;letter-spacing:.5px;}

.sxi-card{
  background:var(--surface);border:1px solid var(--paper-3);border-radius:18px;
  padding:20px 22px;margin-bottom:16px;
}
.sxi-h{margin-bottom:16px;}
.sxi-h b{font:700 1rem var(--sans);color:var(--ink);display:block;}
.sxi-h span{font:500 .78rem var(--sans);color:var(--ink-3);display:block;margin-top:2px;}
.sxi-empty{text-align:center;padding:28px;color:var(--ink-3);font-size:.86rem;}

/* forecast */
.sxi-fc-row{display:flex;align-items:center;gap:14px;margin-bottom:12px;}
.sxi-fc-label{width:130px;flex-shrink:0;font:700 .8rem var(--sans);color:var(--ink-2);}
.sxi-fc-label span{display:block;font:500 .68rem var(--sans);color:var(--ink-4);}
.sxi-fc-track{flex:1;height:24px;background:var(--paper-2);border-radius:8px;overflow:hidden;}
.sxi-fc-bar{
  height:100%;width:var(--w);border-radius:8px;
  background:linear-gradient(90deg,var(--teal),var(--teal-mid));
  animation:sxiGrow .8s cubic-bezier(.22,.8,.3,1) both;
}
@keyframes sxiGrow{from{width:0;}}
.sxi-fc-amt{width:78px;text-align:right;font:800 .9rem var(--mono);color:var(--ink);flex-shrink:0;}
.sxi-warn{
  background:var(--red-pale);border:1px solid var(--red);border-radius:11px;
  padding:11px 14px;font:600 .78rem var(--sans);color:var(--red);margin-top:14px;line-height:1.5;
}

/* chase list */
.sxi-chase{
  display:flex;align-items:center;gap:13px;padding:14px 0;
  border-bottom:1px solid var(--rule);
}
.sxi-chase:last-child{border-bottom:none;}
.sxi-rank{
  width:28px;height:28px;border-radius:9px;background:var(--paper-2);color:var(--ink-3);
  display:flex;align-items:center;justify-content:center;font:800 .8rem var(--mono);flex-shrink:0;
}
.sxi-chase-body{flex:1;min-width:0;}
.sxi-chase-top{display:flex;align-items:center;gap:9px;flex-wrap:wrap;}
.sxi-chase-name{font:700 .9rem var(--sans);color:var(--ink);}
.sxi-badge{
  font:700 .64rem var(--sans);padding:2px 9px;border-radius:20px;
  border:1px solid;background:transparent;
}
.sxi-chase-meta{font:500 .76rem var(--sans);color:var(--ink-3);margin-top:3px;}
.sxi-chase-meta b{color:var(--ink-2);font-family:var(--mono);}
.sxi-likely{height:5px;border-radius:5px;background:var(--paper-3);margin-top:7px;overflow:hidden;}
.sxi-likely span{
  display:block;height:100%;border-radius:5px;
  background:linear-gradient(90deg,var(--amber),var(--gold));
  animation:sxiGrow .9s cubic-bezier(.22,.8,.3,1) both;
}
.sxi-likely-t{font:600 .68rem var(--mono);color:var(--ink-4);margin-top:4px;}
.sxi-chase-btn{
  flex-shrink:0;padding:9px 15px;border-radius:10px;border:1.5px solid var(--amber);
  background:transparent;color:var(--amber-dark);font:700 .77rem var(--sans);cursor:pointer;transition:.15s;
}
.sxi-chase-btn:hover{background:var(--amber);color:#fff;}
@media(max-width:640px){
  .sxi-chase{flex-wrap:wrap;}
  .sxi-chase-btn{width:100%;}
  .sxi-fc-label{width:100px;}
  .sxi-hero-r{width:100%;}
  .sxi-stat{flex:1;}
}

/* Payment DNA card inside the party sheet */
.sxi-dna{
  background:linear-gradient(135deg,var(--violet-pale),var(--teal-light));
  border:1px solid var(--paper-3);border-radius:15px;padding:16px 18px;margin-bottom:18px;
}
.sxi-dna-h{
  font:800 .68rem var(--sans);letter-spacing:1.2px;color:var(--violet);
  display:flex;align-items:center;justify-content:space-between;
}
.sxi-conf{
  font:700 .6rem var(--sans);letter-spacing:.4px;text-transform:uppercase;
  background:rgba(255,255,255,.6);color:var(--ink-3);padding:2px 8px;border-radius:12px;
}
.sxi-dna-top{display:flex;align-items:baseline;gap:12px;margin-top:8px;}
.sxi-dna-score{font:800 2.1rem var(--serif);letter-spacing:-.04em;line-height:1;}
.sxi-dna-score span{font-size:.42em;font-family:var(--sans);opacity:.6;}
.sxi-dna-band{font:800 .88rem var(--sans);}
.sxi-dna-tip{font:500 .78rem var(--sans);color:var(--ink-2);margin-top:7px;line-height:1.55;}
.sxi-dna-grid{
  display:grid;grid-template-columns:repeat(2,1fr);gap:10px;margin-top:14px;
}
.sxi-dna-grid > div{
  background:rgba(255,255,255,.65);border-radius:11px;padding:9px 12px;
}
.sxi-dna-grid b{display:block;font:800 .92rem var(--mono);color:var(--ink);}
.sxi-dna-grid span{font:600 .66rem var(--sans);color:var(--ink-3);}
.sxi-dna-alert{
  margin-top:12px;background:var(--amber-pale);border:1px solid var(--amber);
  border-radius:10px;padding:10px 13px;font:600 .75rem var(--sans);color:var(--amber-dark);line-height:1.5;
}
@media (prefers-reduced-motion:reduce){ .sxi-fc-bar,.sxi-likely span{animation:none;} }

/* ═══════════ INVOICE FORM: customer details ═══════════ */
.inv-more{
  border:1.5px solid var(--paper-3);border-radius:12px;background:var(--paper-2);
  padding:0 14px;margin-bottom:14px;
}
.inv-more summary{
  cursor:pointer;padding:12px 0;font:700 .85rem var(--sans);color:var(--ink-2);
  list-style:none;display:flex;align-items:center;gap:7px;
}
.inv-more summary::-webkit-details-marker{display:none;}
.inv-more summary::after{content:'▾';margin-left:auto;color:var(--ink-4);transition:.2s;}
.inv-more[open] summary::after{transform:rotate(180deg);}
.inv-more summary span{font-weight:500;color:var(--ink-4);font-size:.78rem;}
.inv-more-grid{
  display:grid;grid-template-columns:1fr 1fr;gap:10px;padding:4px 0 14px;
}
@media(max-width:560px){ .inv-more-grid{grid-template-columns:1fr;} }

/* ═══════════ INVITE & SHARE ═══════════ */
.sxinv-card{
  display:flex;align-items:center;gap:12px;justify-content:space-between;
  background:linear-gradient(120deg,var(--gold-pale),var(--amber-pale));
  border:1px solid var(--gold);border-radius:15px;padding:15px 17px;margin-bottom:16px;
}
.sxinv-card-l{display:flex;align-items:center;gap:12px;cursor:pointer;min-width:0;}
.sxinv-card-emoji{font-size:1.7rem;}
.sxinv-card b{font:700 .92rem var(--sans);color:var(--ink);}
.sxinv-card-l div div{font:500 .77rem var(--sans);color:var(--ink-2);margin-top:1px;}
.sxinv-card-btn{
  flex-shrink:0;padding:9px 18px;border-radius:10px;border:none;cursor:pointer;
  background:var(--ink);color:var(--paper);font:700 .8rem var(--sans);
}
.sxinv-card-btn:hover{filter:brightness(1.2);}

.sxinv-back{
  position:fixed;inset:0;z-index:440;background:rgba(10,11,20,.55);backdrop-filter:blur(3px);
  display:flex;align-items:flex-end;justify-content:center;opacity:0;pointer-events:none;transition:.2s;
}
.sxinv-back.open{opacity:1;pointer-events:auto;}
.sxinv{
  width:100%;max-width:420px;background:var(--surface);border-radius:22px 22px 0 0;
  padding:10px 22px 24px;box-shadow:var(--shadow-lg);position:relative;
  transform:translateY(40px);transition:transform .28s cubic-bezier(.22,.8,.3,1);
  max-height:92vh;overflow-y:auto;
}
.sxinv-back.open .sxinv{transform:none;}
@media(min-width:700px){ .sxinv-back{align-items:center;} .sxinv{border-radius:20px;} }
.sxinv-grip{width:40px;height:4px;border-radius:4px;background:var(--paper-3);margin:4px auto 10px;}
.sxinv-x{
  position:absolute;right:16px;top:16px;width:30px;height:30px;border-radius:9px;
  background:var(--paper-2);border:none;font-size:1.05rem;cursor:pointer;color:var(--ink-2);
}
.sxinv-head{text-align:center;padding:6px 0 16px;}
.sxinv-emoji{font-size:2.6rem;}
.sxinv-head h3{font:700 1.15rem var(--sans);color:var(--ink);margin-top:6px;}
.sxinv-head p{font:500 .82rem var(--sans);color:var(--ink-3);margin-top:5px;line-height:1.55;}
.sxinv-qr-wrap{text-align:center;margin-bottom:18px;}
.sxinv-qr{
  display:inline-block;background:#fff;padding:12px;border-radius:14px;
  border:1px solid var(--paper-3);box-shadow:var(--shadow-sm);min-height:132px;min-width:132px;
}
.sxinv-qr-t{font:600 .72rem var(--sans);color:var(--ink-4);margin-top:8px;}
.sxinv-btns{display:flex;flex-direction:column;gap:9px;}
.sxinv-b{
  width:100%;padding:13px;border-radius:12px;border:none;cursor:pointer;
  font:700 .88rem var(--sans);transition:.15s;
}
.sxinv-b:active{transform:scale(.98);}
.sxinv-b.wa{background:#25D366;color:#fff;box-shadow:0 6px 16px rgba(37,211,102,.32);}
.sxinv-b.sys{background:var(--teal);color:#fff;}
.sxinv-b.copy{background:var(--paper-2);color:var(--ink-2);border:1.5px solid var(--paper-3);}
.sxinv-b:hover{filter:brightness(1.08);}
.sxinv-link{
  text-align:center;margin-top:14px;font:600 .74rem var(--mono);color:var(--ink-4);
  background:var(--paper-2);border-radius:9px;padding:9px;word-break:break-all;
}

/* ═══════════ REFER & EARN ═══════════ */
.sxrw-hero{
  background:linear-gradient(125deg,#7A3DF5,#3D5AFE);border-radius:20px;
  padding:26px 28px;margin-bottom:16px;color:#fff;
  display:flex;gap:22px;align-items:center;flex-wrap:wrap;position:relative;overflow:hidden;
}
.sxrw-hero::before{
  content:'🎁';position:absolute;right:18px;bottom:-18px;font-size:7rem;opacity:.13;pointer-events:none;
}
.sxrw-hero-in{flex:1;min-width:230px;position:relative;}
.sxrw-tag{font:800 .62rem var(--sans);letter-spacing:1.6px;color:var(--gold);margin-bottom:8px;}
.sxrw-hero h2{font-family:var(--serif);font-weight:800;font-size:clamp(1.5rem,3.4vw,2.2rem);letter-spacing:-.03em;line-height:1.12;}
.sxrw-hero p{font:500 .84rem var(--sans);color:rgba(255,255,255,.78);margin-top:9px;max-width:44ch;line-height:1.6;}
.sxrw-stats{display:flex;gap:12px;position:relative;}
.sxrw-stat{
  background:rgba(255,255,255,.13);border:1px solid rgba(255,255,255,.2);border-radius:14px;
  padding:14px 18px;text-align:center;min-width:92px;backdrop-filter:blur(6px);
}
.sxrw-stat b{display:block;font:800 1.6rem var(--mono);letter-spacing:-.03em;}
.sxrw-stat span{font:600 .64rem var(--sans);opacity:.75;text-transform:uppercase;letter-spacing:.5px;}

.sxrw-card{
  background:var(--surface);border:1px solid var(--paper-3);border-radius:18px;
  padding:20px 22px;margin-bottom:14px;
}
.sxrw-h{font:700 .95rem var(--sans);color:var(--ink);margin-bottom:13px;}
.sxrw-code{
  text-align:center;font:800 1.7rem var(--mono);letter-spacing:3px;color:var(--violet);
  background:var(--violet-pale);border:2px dashed var(--violet);border-radius:14px;
  padding:18px;cursor:pointer;transition:.15s;
}
.sxrw-code:hover{filter:brightness(1.04);}
.sxrw-code span{
  display:block;font:600 .62rem var(--sans);letter-spacing:.6px;
  color:var(--ink-4);text-transform:uppercase;margin-top:6px;
}
.sxrw-linkrow{display:flex;gap:8px;margin-top:12px;}
.sxrw-link{
  flex:1;min-width:0;padding:11px 13px;border:1.5px solid var(--paper-3);border-radius:10px;
  background:var(--paper-2);color:var(--ink-2);font:600 .74rem var(--mono);
}
.sxrw-copy{
  padding:0 18px;border-radius:10px;border:1.5px solid var(--paper-3);background:var(--paper-2);
  font:700 .78rem var(--sans);color:var(--ink-2);cursor:pointer;
}
.sxrw-copy:hover{background:var(--paper-3);}
.sxrw-btns{display:flex;gap:9px;margin-top:12px;flex-wrap:wrap;}
.sxrw-b{
  flex:1;min-width:150px;padding:13px;border-radius:12px;border:none;cursor:pointer;
  font:700 .85rem var(--sans);color:#fff;transition:.15s;
}
.sxrw-b.wa{background:#25D366;box-shadow:0 6px 16px rgba(37,211,102,.3);}
.sxrw-b.sys{background:var(--teal);}
.sxrw-b:hover{filter:brightness(1.08);}
.sxrw-b:active{transform:scale(.98);}

.sxrw-steps{display:flex;flex-direction:column;gap:13px;}
.sxrw-step{display:flex;gap:13px;align-items:flex-start;}
.sxrw-step > b{
  width:28px;height:28px;border-radius:50%;background:var(--violet);color:#fff;flex-shrink:0;
  display:flex;align-items:center;justify-content:center;font:800 .8rem var(--mono);
}
.sxrw-step div b{display:block;font:700 .86rem var(--sans);color:var(--ink);}
.sxrw-step div span{font:500 .78rem var(--sans);color:var(--ink-3);}
.sxrw-note{
  margin-top:14px;background:var(--gold-pale);border:1px solid var(--gold);border-radius:11px;
  padding:11px 14px;font:600 .76rem var(--sans);color:var(--ink-2);line-height:1.55;
}
@media(max-width:640px){ .sxrw-stats{width:100%;} .sxrw-stat{flex:1;} }

/* ═══════════ PAYPAL CHECKOUT ═══════════ */
.sxpp-back{
  position:fixed;inset:0;z-index:460;background:rgba(10,11,20,.6);backdrop-filter:blur(4px);
  display:flex;align-items:center;justify-content:center;padding:18px;
  opacity:0;pointer-events:none;transition:.2s;
}
.sxpp-back.open{opacity:1;pointer-events:auto;}
.sxpp{
  width:100%;max-width:390px;background:var(--surface);border-radius:20px;
  padding:26px 24px 22px;box-shadow:var(--shadow-lg);position:relative;
  max-height:92vh;overflow-y:auto;
}
.sxpp-x{
  position:absolute;right:14px;top:14px;width:30px;height:30px;border-radius:9px;
  background:var(--paper-2);border:none;font-size:1.05rem;cursor:pointer;color:var(--ink-2);
}
.sxpp-h{font:600 .92rem var(--sans);color:var(--ink-3);text-align:center;}
.sxpp-h b{color:var(--ink);font-weight:800;}
.sxpp-amt{
  text-align:center;font:800 2.1rem var(--mono);color:var(--ink);
  letter-spacing:-.03em;margin:6px 0 20px;
}
.sxpp-amt span{
  display:block;font:600 .7rem var(--sans);color:var(--ink-4);
  letter-spacing:.4px;text-transform:uppercase;margin-top:4px;
}
.sxpp-btns{min-height:60px;}
.sxpp-note{
  text-align:center;font:500 .72rem var(--sans);color:var(--ink-4);
  margin-top:14px;line-height:1.5;
}

/* ═══════════════════════════════════════════════════════════
   RIGHT-TO-LEFT LAYOUT (Arabic, Urdu)
   The whole shell mirrors. Numbers, money, invoice numbers and
   tax IDs stay left-to-right because that is how they are
   genuinely written on an Arabic invoice.
═══════════════════════════════════════════════════════════ */
html.sx-rtl body{ direction:rtl; text-align:right; }

/* sidebar swaps sides */
html.sx-rtl .sidebar{ left:auto; right:0; }
html.sx-rtl .main{ margin-left:0; margin-right:var(--sw,236px); }
@media(max-width:860px){
  html.sx-rtl .main{ margin-right:0; }
  html.sx-rtl .sidebar{ transform:translateX(100%); }
  html.sx-rtl .sidebar.open{ transform:none; }
}
html.sx-rtl .sb-item.active::before{ left:auto; right:0; border-radius:3px 0 0 3px; }
html.sx-rtl .sb-item.active::after{ left:auto; right:-10px; }

/* numbers and identifiers must not mirror */
html.sx-rtl .mono,
html.sx-rtl .stat-val,
html.sx-rtl .sxg-num,
html.sx-rtl .sxi-dna-score,
html.sx-rtl .sxrw-code,
html.sx-rtl input[type="tel"],
html.sx-rtl input[type="number"],
html.sx-rtl input[type="date"]{
  direction:ltr;
  unicode-bidi:isolate;
}
/* keep money right-aligned in RTL tables while staying LTR internally */
html.sx-rtl td.r, html.sx-rtl th.r{ text-align:left; }

/* flip directional padding/margins that were hardcoded */
html.sx-rtl .sxpd-x,
html.sx-rtl .sxinv-x,
html.sx-rtl .sxpp-x{ right:auto; left:14px; }
html.sx-rtl .sxdue-all{ margin-left:0; margin-right:auto; }
html.sx-rtl .more-rarr{ transform:scaleX(-1); }
html.sx-rtl .sxlang-tick{ margin-left:0; margin-right:auto; }

/* the printed bill itself stays LTR — GST/VAT documents are
   read left-to-right even in Gulf countries */
html.sx-rtl .ewdoc,
html.sx-rtl #sxTplDoc,
html.sx-rtl #billBody{ direction:ltr; text-align:left; }

/* ═══════════ LANGUAGE PICKER ═══════════ */
.sxlang-back{
  position:fixed;inset:0;z-index:450;background:rgba(10,11,20,.55);backdrop-filter:blur(3px);
  display:flex;align-items:flex-end;justify-content:center;opacity:0;pointer-events:none;transition:.2s;
}
.sxlang-back.open{opacity:1;pointer-events:auto;}
.sxlang{
  width:100%;max-width:440px;background:var(--surface);border-radius:22px 22px 0 0;
  padding:10px 20px 24px;box-shadow:var(--shadow-lg);max-height:90vh;overflow-y:auto;
  transform:translateY(40px);transition:transform .28s cubic-bezier(.22,.8,.3,1);
}
.sxlang-back.open .sxlang{transform:none;}
@media(min-width:700px){ .sxlang-back{align-items:center;} .sxlang{border-radius:20px;} }
.sxlang-grip{width:40px;height:4px;border-radius:4px;background:var(--paper-3);margin:4px auto 14px;}
.sxlang-h{font:600 1rem var(--sans);color:var(--ink-3);text-align:center;margin-bottom:16px;}
.sxlang-h b{color:var(--ink);font-weight:800;}
.sxlang-grid{display:grid;grid-template-columns:1fr 1fr;gap:10px;}
@media(max-width:420px){ .sxlang-grid{grid-template-columns:1fr;} }
.sxlang-b{
  display:flex;align-items:center;gap:11px;padding:13px 14px;border-radius:13px;
  border:1.5px solid var(--paper-3);background:var(--paper-2);cursor:pointer;
  text-align:start;transition:.15s;position:relative;
}
.sxlang-b:hover{border-color:var(--teal);}
.sxlang-b.on{border-color:var(--teal);background:var(--teal-light);}
.sxlang-flag{font-size:1.5rem;flex-shrink:0;}
.sxlang-native{font:700 .95rem var(--sans);color:var(--ink);display:block;}
.sxlang-en{font:500 .7rem var(--sans);color:var(--ink-4);display:block;}
.sxlang-b > span:nth-child(2){flex:1;min-width:0;}
.sxlang-tick{margin-inline-start:auto;color:var(--teal);font-weight:800;}
.sxlang-note{
  margin-top:16px;background:var(--teal-light);border-radius:11px;padding:11px 14px;
  font:600 .76rem var(--sans);color:var(--ink-2);text-align:center;line-height:1.5;
}

/* ═══════════════════════════════════════════════════════════
   APP LOCK — fingerprint / face / PIN
═══════════════════════════════════════════════════════════ */
.sxlock{
  position:fixed;inset:0;z-index:9999;display:none;
  align-items:center;justify-content:center;padding:24px;
  background:linear-gradient(160deg,var(--teal),var(--teal-mid));
}
.sxlock.on{display:flex;animation:sxlockIn .25s ease;}
@keyframes sxlockIn{from{opacity:0;}}
.sxlock-in{text-align:center;max-width:320px;width:100%;}
.sxlock-logo{width:64px;height:64px;object-fit:contain;background:#fff;border-radius:18px;padding:8px;}
.sxlock-biz{
  font:800 1.05rem var(--serif);color:#fff;margin-top:12px;
  overflow:hidden;text-overflow:ellipsis;white-space:nowrap;
}
.sxlock-ico{
  font-size:3rem;margin:22px 0 10px;
  animation:sxlockPulse 2s ease-in-out infinite;
}
@keyframes sxlockPulse{0%,100%{transform:scale(1);opacity:.9;}50%{transform:scale(1.08);opacity:1;}}
.sxlock-msg{
  font:600 .9rem var(--sans);color:rgba(255,255,255,.85);
  min-height:2.6em;line-height:1.5;padding:0 8px;
}
.sxlock-btn{
  width:100%;margin-top:14px;padding:15px;border:none;border-radius:14px;cursor:pointer;
  background:var(--amber);color:#fff;font:700 .92rem var(--sans);
  box-shadow:0 8px 22px rgba(0,0,0,.28);transition:.15s;
}
.sxlock-btn:hover{filter:brightness(1.08);}
.sxlock-btn:active{transform:scale(.98);}
.sxlock-btn.alt{background:rgba(255,255,255,.16);border:1px solid rgba(255,255,255,.25);margin-top:0;}
.sxlock-pin{display:flex;flex-direction:column;gap:10px;margin-top:14px;}
.sxlock-pinin{
  width:100%;padding:15px;border-radius:14px;border:1px solid rgba(255,255,255,.25);
  background:rgba(255,255,255,.12);color:#fff;text-align:center;
  font:700 1.4rem var(--mono);letter-spacing:8px;outline:none;
}
.sxlock-pinin::placeholder{color:rgba(255,255,255,.45);letter-spacing:normal;font-size:.9rem;font-weight:500;}
.sxlock-pinin:focus{border-color:var(--amber);background:rgba(255,255,255,.18);}
.sxlock-alt{
  margin-top:16px;background:none;border:none;cursor:pointer;
  color:rgba(255,255,255,.7);font:600 .82rem var(--sans);text-decoration:underline;
}
.sxlock-out{
  display:block;margin:24px auto 0;background:none;border:none;cursor:pointer;
  color:rgba(255,255,255,.45);font:600 .78rem var(--sans);
}
.sxlock-out:hover{color:rgba(255,255,255,.8);}

/* settings card */
.sxlk-row{display:flex;align-items:center;justify-content:space-between;gap:14px;}
.sxlk-row b{font:700 .9rem var(--sans);color:var(--ink);}
.sxlk-sub{font:500 .78rem var(--sans);color:var(--ink-3);margin-top:2px;}
.sxlk-methods{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-top:16px;}
@media(max-width:480px){ .sxlk-methods{grid-template-columns:1fr;} }
.sxlk-m{
  display:flex;flex-direction:column;align-items:center;gap:5px;padding:16px 10px;
  border:1.5px solid var(--paper-3);border-radius:13px;background:var(--paper-2);
  cursor:pointer;transition:.15s;text-align:center;
}
.sxlk-m:hover{border-color:var(--teal);}
.sxlk-m span{font-size:1.6rem;}
.sxlk-m b{font:700 .82rem var(--sans);color:var(--ink);}
.sxlk-m i{font:600 .7rem var(--sans);color:var(--ink-4);font-style:normal;}
.sxlk-m.off{opacity:.5;cursor:not-allowed;}
.sxlk-note{
  margin-top:14px;background:var(--teal-light);border-radius:11px;padding:11px 14px;
  font:600 .74rem var(--sans);color:var(--ink-2);line-height:1.55;
}

/* ═══════════════════════════════════════════════════════════
   BUSINESS CARD
═══════════════════════════════════════════════════════════ */
.sxcard-empty,.sxteam-empty{
  background:var(--surface);border:1px solid var(--paper-3);border-radius:16px;
  padding:44px 24px;text-align:center;
}
.sxcard-empty h3,.sxteam-empty h3{font:700 1.06rem var(--sans);color:var(--ink);margin:10px 0 6px;}
.sxcard-empty p,.sxteam-empty p{font:500 .85rem var(--sans);color:var(--ink-3);max-width:420px;margin:0 auto 16px;line-height:1.65;}
.sxcard-lock{
  background:var(--gold-pale);border:1px solid var(--gold);border-radius:12px;
  padding:12px 15px;font:500 .82rem var(--sans);color:var(--ink-2);margin-bottom:16px;line-height:1.6;
}
.sxcard-lock button{
  margin-inline-start:6px;background:var(--ink);color:var(--paper);border:none;
  border-radius:8px;padding:5px 12px;font:700 .74rem var(--sans);cursor:pointer;
}
.sxcard-wrap{display:flex;justify-content:center;margin-bottom:18px;}
.sxcard-wrap.locked{opacity:.85;}
.sxcard-face{
  width:100%;max-width:400px;aspect-ratio:1.75;border-radius:18px;padding:20px 22px;
  display:flex;flex-direction:column;box-shadow:0 18px 44px rgba(24,26,46,.28);
  position:relative;overflow:hidden;
}
.sxcard-top{display:flex;align-items:center;gap:12px;}
.sxcard-logo{
  width:46px;height:46px;border-radius:12px;flex-shrink:0;overflow:hidden;
  display:flex;align-items:center;justify-content:center;
  font:800 1.3rem var(--serif);color:#0F2542;
}
.sxcard-logo img{width:100%;height:100%;object-fit:contain;}
.sxcard-id{min-width:0;}
.sxcard-biz{font:800 1.1rem var(--serif);letter-spacing:-.01em;line-height:1.15;
  overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
.sxcard-owner{font:600 .78rem var(--sans);opacity:.72;margin-top:1px;}
.sxcard-rule{height:2px;border-radius:2px;margin:12px 0 10px;width:52px;}
.sxcard-rows{flex:1;display:flex;flex-direction:column;gap:4px;min-height:0;}
.sxcard-row{font:500 .76rem var(--sans);opacity:.9;display:flex;gap:7px;align-items:center;
  overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
.sxcard-row span{opacity:.8;flex-shrink:0;}
.sxcard-bottom{display:flex;align-items:flex-end;justify-content:flex-end;gap:9px;}
.sxcard-qr{background:#fff;padding:4px;border-radius:7px;line-height:0;}
.sxcard-qr img,.sxcard-qr canvas{display:block;}
.sxcard-scan{font:700 .6rem var(--sans);text-align:right;line-height:1.35;letter-spacing:.3px;}
.sxcard-designs{display:flex;gap:9px;justify-content:center;flex-wrap:wrap;margin-bottom:16px;}
.sxcard-d{
  border:2px solid transparent;border-radius:11px;padding:11px 16px;cursor:pointer;
  font:700 .78rem var(--sans);transition:.15s;
}
.sxcard-d.on{border-color:var(--amber);transform:translateY(-2px);}
.sxcard-acts{display:flex;gap:10px;flex-wrap:wrap;margin-bottom:12px;}
.sxcard-b{
  flex:1;min-width:160px;padding:13px;border-radius:12px;border:none;cursor:pointer;
  font:700 .86rem var(--sans);color:#fff;transition:.15s;
}
.sxcard-b.wa{background:#25D366;}
.sxcard-b.dl{background:var(--teal);}
.sxcard-b:hover:not(:disabled){filter:brightness(1.08);}
.sxcard-b:disabled{opacity:.45;cursor:not-allowed;}
.sxcard-note{font:500 .76rem var(--sans);color:var(--ink-3);line-height:1.6;text-align:center;}

/* ═══════════════════════════════════════════════════════════
   TEAM
═══════════════════════════════════════════════════════════ */
.sxteam-count{font:700 .82rem var(--sans);color:var(--ink-3);margin-bottom:14px;}
.sxteam-group{margin-bottom:20px;}
.sxteam-gh{
  font:800 .72rem var(--sans);text-transform:uppercase;letter-spacing:.8px;
  color:var(--ink-3);margin-bottom:9px;
}
.sxteam-row{
  display:flex;align-items:center;gap:13px;background:var(--surface);
  border:1px solid var(--paper-3);border-radius:14px;padding:13px 15px;
  margin-bottom:9px;cursor:pointer;transition:.15s;
}
.sxteam-row:hover{box-shadow:var(--shadow-md);border-color:var(--ink-4);}
.sxteam-ava{
  width:40px;height:40px;border-radius:12px;background:var(--teal);color:#fff;flex-shrink:0;
  display:flex;align-items:center;justify-content:center;font:700 1rem var(--sans);
}
.sxteam-body{flex:1;min-width:0;}
.sxteam-name{font:700 .92rem var(--sans);color:var(--ink);}
.sxteam-meta{font:500 .76rem var(--sans);color:var(--ink-3);margin-top:2px;
  overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
.sxteam-acts{display:flex;gap:7px;flex-shrink:0;}
.sxteam-ic{
  width:36px;height:36px;border-radius:10px;background:var(--paper-2);
  border:1px solid var(--paper-3);display:flex;align-items:center;justify-content:center;
  font-size:1rem;text-decoration:none;transition:.15s;
}
.sxteam-ic:hover{background:var(--paper-3);}
.sxteam-ic.wa{background:#E9FBF1;border-color:#B7EFD1;}
.sxteam-note{
  background:var(--teal-light);border-radius:11px;padding:12px 15px;
  font:500 .78rem var(--sans);color:var(--ink-2);line-height:1.6;margin-top:6px;
}
.sxteam-back{
  position:fixed;inset:0;z-index:430;background:rgba(10,11,20,.55);backdrop-filter:blur(3px);
  display:flex;align-items:flex-end;justify-content:center;opacity:0;pointer-events:none;transition:.2s;
}
.sxteam-back.open{opacity:1;pointer-events:auto;}
.sxteam{
  width:100%;max-width:440px;background:var(--surface);border-radius:22px 22px 0 0;
  padding:10px 20px 24px;box-shadow:var(--shadow-lg);max-height:92vh;overflow-y:auto;
  transform:translateY(40px);transition:transform .28s cubic-bezier(.22,.8,.3,1);
}
.sxteam-back.open .sxteam{transform:none;}
@media(min-width:700px){ .sxteam-back{align-items:center;} .sxteam{border-radius:20px;} }
.sxteam-grip{width:40px;height:4px;border-radius:4px;background:var(--paper-3);margin:4px auto 12px;}
.sxteam-h{display:flex;align-items:center;margin-bottom:14px;}
.sxteam-h b{font:700 1.02rem var(--sans);color:var(--ink);flex:1;}
.sxteam-x{width:32px;height:32px;border-radius:9px;background:var(--paper-2);border:none;
  font-size:1.1rem;cursor:pointer;color:var(--ink-2);}
.sxteam-roles{display:grid;grid-template-columns:1fr 1fr;gap:8px;}
.sxteam-role{
  display:flex;align-items:center;gap:8px;padding:10px 12px;border-radius:11px;
  border:1.5px solid var(--paper-3);background:var(--paper-2);cursor:pointer;
  font:600 .78rem var(--sans);color:var(--ink-2);text-align:left;transition:.14s;
}
.sxteam-role.on{border-color:var(--teal);background:var(--teal-light);color:var(--ink);}
.sxteam-del{
  width:100%;margin-top:10px;padding:12px;border-radius:11px;cursor:pointer;
  border:1.5px solid var(--red-pale);background:var(--red-pale);color:var(--red);
  font:700 .82rem var(--sans);
}
.sxteam-del:hover{background:var(--red);color:#fff;}

/* ═══════════════════════════════════════════════════════════
   MULTI-ITEM INVOICE CART
═══════════════════════════════════════════════════════════ */
.invc{margin-bottom:16px;}
.invc-head{display:flex;align-items:center;justify-content:space-between;margin-bottom:9px;}
.invc-add{
  padding:7px 14px;border-radius:9px;border:1.5px solid var(--teal);
  background:transparent;color:var(--teal);font:700 .78rem var(--sans);cursor:pointer;transition:.15s;
}
.invc-add:hover{background:var(--teal);color:#fff;}
.invc-row{
  display:flex;align-items:center;gap:7px;padding:9px;margin-bottom:7px;
  background:var(--paper-2);border:1px solid var(--paper-3);border-radius:11px;
}
.invc-main{flex:1;min-width:0;}
.invc-name{
  width:100%;border:none;background:transparent;outline:none;
  font:600 .88rem var(--sans);color:var(--ink);padding:2px 0;
}
.invc-name::placeholder{color:var(--ink-4);font-weight:500;}
.invc-sub{font:500 .68rem var(--mono);color:var(--ink-4);margin-top:1px;}
.invc-qty,.invc-rate{
  width:66px;flex-shrink:0;padding:8px 9px;border:1.5px solid var(--paper-3);
  border-radius:8px;background:var(--surface);color:var(--ink);
  font:600 .84rem var(--mono);text-align:center;outline:none;
}
.invc-qty:focus,.invc-rate:focus{border-color:var(--teal);}
.invc-rate{width:82px;}
.invc-x{color:var(--ink-4);font-size:.8rem;flex-shrink:0;}
.invc-total{
  width:92px;flex-shrink:0;text-align:right;
  font:700 .9rem var(--mono);color:var(--ink);
}
.invc-del{
  width:28px;height:28px;flex-shrink:0;border-radius:8px;border:none;cursor:pointer;
  background:transparent;color:var(--ink-4);font-size:1.2rem;line-height:1;transition:.15s;
}
.invc-del:hover{background:var(--red-pale);color:var(--red);}
.invc-disc{display:flex;align-items:center;gap:10px;margin:12px 0 10px;}
.invc-disc .flabel{margin:0;white-space:nowrap;}
.invc-disc input{max-width:130px;}
.invc-totals{
  background:var(--surface);border:1.5px solid var(--paper-3);
  border-radius:12px;padding:13px 16px;
}
.invc-t-row{
  display:flex;justify-content:space-between;align-items:center;
  padding:5px 0;font:500 .84rem var(--sans);color:var(--ink-3);
}
.invc-t-row b{font-family:var(--mono);color:var(--ink-2);font-weight:600;}
.invc-t-row.disc b{color:var(--green);}
.invc-t-row.grand{
  border-top:2px solid var(--paper-3);margin-top:6px;padding-top:10px;
  font:700 1rem var(--sans);color:var(--ink);
}
.invc-t-row.grand b{font-size:1.25rem;font-weight:800;color:var(--ink);}
@media(max-width:560px){
  .invc-row{flex-wrap:wrap;}
  .invc-main{flex:1 1 100%;order:1;}
  .invc-qty{order:2;} .invc-x{order:3;} .invc-rate{order:4;}
  .invc-total{order:5;flex:1;} .invc-del{order:6;}
}

/* ═══════════════════════════════════════════════════════════
   KHATA STATEMENT
═══════════════════════════════════════════════════════════ */
.sxks-back{
  position:fixed;inset:0;z-index:445;background:rgba(10,11,20,.6);backdrop-filter:blur(3px);
  display:flex;align-items:center;justify-content:center;padding:16px;
  opacity:0;pointer-events:none;transition:.2s;
}
.sxks-back.open{opacity:1;pointer-events:auto;}
.sxks{
  width:100%;max-width:820px;max-height:94vh;background:var(--surface);
  border-radius:18px;display:flex;flex-direction:column;box-shadow:var(--shadow-lg);overflow:hidden;
}
.sxks-h{display:flex;align-items:center;padding:15px 20px;border-bottom:1px solid var(--rule);}
.sxks-h b{flex:1;font:700 1rem var(--sans);color:var(--ink);}
.sxks-x{width:32px;height:32px;border-radius:9px;background:var(--paper-2);border:none;
  font-size:1.1rem;cursor:pointer;color:var(--ink-2);}
.sxks-range{display:flex;gap:7px;padding:12px 20px;border-bottom:1px solid var(--rule);flex-wrap:wrap;}
.sxks-r{
  padding:7px 14px;border-radius:20px;border:1.5px solid var(--paper-3);
  background:var(--paper-2);color:var(--ink-3);font:700 .76rem var(--sans);cursor:pointer;transition:.15s;
}
.sxks-r.on{background:var(--teal);border-color:var(--teal);color:#fff;}
.sxks-body{flex:1;overflow-y:auto;padding:18px 20px;background:var(--paper-2);}
.sxks-acts{display:flex;gap:9px;padding:13px 20px;border-top:1px solid var(--rule);flex-wrap:wrap;}
.sxks-b{
  flex:1;min-width:140px;padding:12px;border-radius:11px;border:none;cursor:pointer;
  font:700 .84rem var(--sans);color:#fff;transition:.15s;
}
.sxks-b.wa{background:#25D366;}
.sxks-b.dl{background:var(--teal);}
.sxks-b.pr{background:var(--ink-2);}
.sxks-b:hover{filter:brightness(1.09);}

/* the printable document — always light, never themed */
.ksdoc{
  background:#fff;color:#1B1C28;padding:26px 28px;border-radius:10px;
  font-family:Inter,system-ui,sans-serif;font-size:.86rem;
  box-shadow:0 4px 20px rgba(24,26,46,.1);
}
.ks-head{display:flex;justify-content:space-between;gap:18px;align-items:flex-start;
  padding-bottom:14px;border-bottom:2px solid #0F2542;flex-wrap:wrap;}
.ks-biz{font:800 1.35rem Georgia,serif;color:#0F2542;letter-spacing:-.01em;}
.ks-sub{font-size:.78rem;color:#666;margin-top:2px;}
.ks-title{text-align:right;font:800 1.1rem Georgia,serif;color:#0F2542;}
.ks-title span{display:block;font:600 .74rem Inter,sans-serif;color:#666;margin-top:3px;}
.ks-party{display:flex;justify-content:space-between;gap:18px;flex-wrap:wrap;
  padding:14px 0;border-bottom:1px solid #E4DDD2;}
.ks-party span{display:block;font:700 .66rem Inter,sans-serif;text-transform:uppercase;
  letter-spacing:.7px;color:#999;}
.ks-party b{display:block;font:800 1.05rem Inter,sans-serif;color:#1B1C28;margin-top:2px;}
.ks-party i{font-style:normal;font-size:.78rem;color:#666;margin-right:10px;}
.ks-open{text-align:right;}
.ks-open b{font-family:'JetBrains Mono',monospace;font-size:.95rem;}
.ks-tbl{width:100%;border-collapse:collapse;margin-top:14px;font-size:.82rem;}
.ks-tbl th{background:#F3EFE9;text-align:left;padding:9px 10px;font-weight:700;
  color:#1B1C28;border-bottom:2px solid #0F2542;font-size:.74rem;}
.ks-tbl th small{font-weight:500;color:#888;font-size:.66rem;}
.ks-tbl td{padding:9px 10px;border-bottom:1px solid #EFE9E0;color:#3A3B4C;vertical-align:top;}
.ks-tbl .r{text-align:right;font-family:'JetBrains Mono',monospace;}
.ks-tbl .nm{font-weight:600;color:#1B1C28;}
.ks-tbl .vch{display:block;font:500 .66rem 'JetBrains Mono',monospace;color:#A2A4B8;}
.ks-tbl .dr{color:#F0356B;}
.ks-tbl .cr{color:#00B37E;}
.ks-tbl .bal{font-weight:700;color:#1B1C28;}
.ks-tbl .bal i{font-style:normal;font-size:.68rem;color:#888;margin-left:3px;}
.ks-tbl tfoot td{background:#F3EFE9;font-weight:800;color:#1B1C28;
  border-top:2px solid #0F2542;border-bottom:none;font-family:'JetBrains Mono',monospace;}
.ks-tbl tfoot td:first-child{font-family:Inter,sans-serif;}
.ks-none{text-align:center;color:#999;padding:22px !important;}
.ks-final{margin-top:16px;padding:14px 18px;border-radius:11px;
  display:flex;justify-content:space-between;align-items:center;gap:12px;flex-wrap:wrap;}
.ks-final b{font:800 1rem Inter,sans-serif;}
.ks-final span{font:600 .8rem 'JetBrains Mono',monospace;}
.ks-final.owe{background:#FFE7EE;color:#B01B44;}
.ks-final.adv{background:#DFF7EE;color:#00795A;}
.ks-final.nil{background:#F3EFE9;color:#3A3B4C;}
.ks-bank{margin-top:9px;font-size:.76rem;color:#666;}
.ks-foot{margin-top:16px;padding-top:10px;border-top:1px dashed #E4DDD2;
  font-size:.7rem;color:#A2A4B8;text-align:center;}
@media(max-width:600px){
  .ksdoc{padding:18px;}
  .ks-title{text-align:left;}
  .sxks-b{min-width:100%;}
}

/* ═══════════ PARTY TABS ═══════════ */
.pty-tabs{display:grid;grid-template-columns:repeat(3,1fr);gap:11px;margin-bottom:16px;}
.pty-tab{
  background:var(--surface);border:1.5px solid var(--paper-3);border-radius:14px;
  padding:14px 16px;cursor:pointer;text-align:left;transition:.16s;
}
.pty-tab:hover{border-color:var(--ink-4);}
.pty-tab.on{border-color:var(--teal);background:var(--teal-light);}
.pty-tab span{display:block;font:700 .8rem var(--sans);color:var(--ink-2);}
.pty-tab b{display:block;font:800 1.35rem var(--mono);color:var(--ink);margin:3px 0 1px;letter-spacing:-.03em;}
.pty-tab i{font-style:normal;font:600 .66rem var(--sans);color:var(--ink-4);
  text-transform:uppercase;letter-spacing:.5px;}
@media(max-width:640px){.pty-tabs{grid-template-columns:1fr;gap:8px;}
  .pty-tab{display:flex;align-items:center;gap:10px;padding:11px 14px;}
  .pty-tab span{flex:1;} .pty-tab b{margin:0;font-size:1.05rem;} .pty-tab i{display:none;}}

/* per-item discount box */
.invc-disc-in{
  width:64px;flex-shrink:0;padding:8px 7px;border:1.5px solid var(--paper-3);
  border-radius:8px;background:var(--surface);color:var(--green);
  font:600 .78rem var(--mono);text-align:center;outline:none;
}
.invc-disc-in:focus{border-color:var(--green);}
.invc-total i{display:block;font-style:normal;font:600 .66rem var(--mono);color:var(--green);}
@media(max-width:560px){.invc-disc-in{order:5;} .invc-total{order:6;} .invc-del{order:7;}}

/* ═══════════ PURCHASES & SUPPLIER PAYMENT ═══════════ */
.sxpur-back{
  position:fixed;inset:0;z-index:435;background:rgba(10,11,20,.55);backdrop-filter:blur(3px);
  display:flex;align-items:flex-end;justify-content:center;opacity:0;pointer-events:none;transition:.2s;
}
.sxpur-back.open{opacity:1;pointer-events:auto;}
.sxpur{
  width:100%;max-width:560px;background:var(--surface);border-radius:22px 22px 0 0;
  padding:10px 20px 24px;box-shadow:var(--shadow-lg);max-height:92vh;overflow-y:auto;
  transform:translateY(40px);transition:transform .28s cubic-bezier(.22,.8,.3,1);
}
.sxpur-back.open .sxpur{transform:none;}
@media(min-width:700px){.sxpur-back{align-items:center;}.sxpur{border-radius:20px;}}
.sxpur-grip{width:40px;height:4px;border-radius:4px;background:var(--paper-3);margin:4px auto 12px;}
.sxpur-h{display:flex;align-items:center;margin-bottom:14px;}
.sxpur-h b{flex:1;font:700 1.02rem var(--sans);color:var(--ink);}
.sxpur-x{width:32px;height:32px;border-radius:9px;background:var(--paper-2);border:none;
  font-size:1.1rem;cursor:pointer;color:var(--ink-2);}
.sxpur-note{background:var(--green-pale);border-radius:11px;padding:11px 14px;
  font:500 .77rem var(--sans);color:var(--ink-2);line-height:1.55;margin-top:12px;}
.sxsp-who{background:var(--paper-2);border-radius:12px;padding:13px 16px;margin-bottom:14px;}
.sxsp-who b{display:block;font:800 1rem var(--sans);color:var(--ink);}
.sxsp-who span{font:600 .8rem var(--sans);color:var(--ink-3);}
.sxsp-rcpt{margin-top:16px;}

/* receipt document */
.rcpt{background:#fff;color:#1B1C28;border:1px solid #E4DDD2;border-radius:12px;
  padding:22px;font-family:Inter,system-ui,sans-serif;}
.rcpt-h{display:flex;justify-content:space-between;gap:16px;align-items:flex-start;
  padding-bottom:13px;border-bottom:2px solid #0F2542;flex-wrap:wrap;}
.rcpt-biz{font:800 1.15rem Georgia,serif;color:#0F2542;}
.rcpt-sub{font-size:.76rem;color:#666;}
.rcpt-t{text-align:right;font:800 .82rem Inter,sans-serif;color:#0F2542;letter-spacing:1px;}
.rcpt-t span{display:block;font:600 .74rem Inter,sans-serif;color:#666;letter-spacing:0;margin-top:2px;}
.rcpt-amt{background:#DFF7EE;border-radius:11px;padding:15px 18px;margin:14px 0;
  display:flex;justify-content:space-between;align-items:center;}
.rcpt-amt span{font:700 .72rem Inter,sans-serif;color:#00795A;
  text-transform:uppercase;letter-spacing:.8px;}
.rcpt-amt b{font:800 1.5rem 'JetBrains Mono',monospace;color:#00795A;}
.rcpt-tbl{width:100%;border-collapse:collapse;font-size:.84rem;}
.rcpt-tbl td{padding:8px 0;border-bottom:1px solid #EFE9E0;color:#3A3B4C;}
.rcpt-tbl td:first-child{color:#888;width:38%;}
.rcpt-tbl b{color:#1B1C28;}
.rcpt-f{margin-top:14px;padding-top:10px;border-top:1px dashed #E4DDD2;
  font-size:.7rem;color:#A2A4B8;text-align:center;}

/* ═══════════ OFFLINE / SYNC BAR ═══════════ */
.sxnet{
  position:fixed;left:0;right:0;bottom:0;z-index:9000;
  padding:11px 18px;text-align:center;
  font:500 .82rem var(--sans);line-height:1.5;
  transform:translateY(100%);transition:transform .3s cubic-bezier(.22,.8,.3,1);
  display:flex;align-items:center;justify-content:center;gap:9px;flex-wrap:wrap;
}
.sxnet.on{transform:none;}
.sxnet b{font-weight:800;}
.sxnet.off{background:var(--gold-pale);border-top:2px solid var(--gold);color:var(--ink-2);}
.sxnet.on-ok{background:var(--green-pale);border-top:2px solid var(--green);color:#00795A;}
.sxnet-dot{
  width:9px;height:9px;border-radius:50%;flex-shrink:0;
}
.sxnet.off .sxnet-dot{background:var(--gold);animation:sxnetPulse 1.8s ease-in-out infinite;}
.sxnet.on-ok .sxnet-dot{background:var(--green);}
@keyframes sxnetPulse{0%,100%{opacity:1;}50%{opacity:.3;}}
/* keep it clear of the mobile bottom navigation */
@media(max-width:860px){ .sxnet{bottom:64px;} }
@media (prefers-reduced-motion:reduce){ .sxnet{transition:none;} .sxnet-dot{animation:none;} }