/* KhataPlus theme - AM Digital
   blue #14489F, orange #F7931E, red = money out, green = money in */
@font-face{font-family:"Vazirmatn";src:url("../fonts/Vazirmatn.woff2") format("woff2-variations"),url("../fonts/Vazirmatn.woff2") format("woff2");font-weight:100 900;font-display:swap}

:root{
  --ink:#14489F; --ink-2:#0F3A85; --ink-3:#0B2C66; --ink-soft:#E7EEFB;
  --saffron:#F7931E; --saffron-2:#E9830C; --saffron-soft:#FFF1DF;
  --bg:#F3F6FB; --card:#FFFFFF; --text:#13213F; --muted:#66728C; --line:#E2E8F3; --soft:#EEF2F9;
  --red:#D23B3B; --green:#16935A; --red-bg:#FCEEEE; --green-bg:#E7F5EE;
  --o1:#14489F; --o2:#14489F; --orange:#E9830C; --accent:#F7931E;
  --shadow:0 1px 2px rgba(19,33,63,.05),0 6px 18px rgba(19,33,63,.05);
  --r-s:10px; --r:14px; --r-l:20px;
  --font:"Vazirmatn",-apple-system,"Segoe UI",Roboto,"Noto Sans Arabic",Tahoma,sans-serif;
}
body.dark{
  --ink:#5B8DEB; --ink-2:#123A80; --ink-3:#0C2654; --ink-soft:#18284A;
  --saffron-soft:#3A2A12; --bg:#0C1424; --card:#131F35; --text:#E6ECF8; --muted:#94A1BA; --line:#22314D; --soft:#1A2843;
  --red:#F06A6A; --green:#3CC285; --red-bg:#3A1C22; --green-bg:#123224;
  --shadow:0 1px 2px rgba(0,0,0,.3),0 6px 18px rgba(0,0,0,.25);
}
body.dark .topbar{background:#0F2550}

html,body{background:var(--bg)}
body,button,input,select,textarea{font-family:var(--font)}
body{color:var(--text);font-size:15px;line-height:1.5;-webkit-font-smoothing:antialiased}
[dir=rtl] body{font-family:var(--font);font-size:15.5px}
b,strong{font-weight:700}
.amt,.v,.pos-val,.bal-amt,.rp-amt,.kh-a,.ln-row b,.num,td.num,td.r,.tbl td.r{font-variant-numeric:tabular-nums}
.pos{color:var(--green)} .neg{color:var(--red)}
.muted{color:var(--muted)}
a{color:inherit}
:focus-visible{outline:2px solid var(--saffron);outline-offset:2px}
@media (prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}}

/* header */
.topbar{background:var(--ink);background-image:none;padding:calc(12px + env(safe-area-inset-top)) 16px 16px;border-radius:0 0 var(--r-l) var(--r-l);color:#fff}
.topbar.with-tabs{padding-bottom:12px}
.topbar-row{gap:10px;min-height:46px}
.topbar h1{font-size:21px;font-weight:800;letter-spacing:-.2px}
[dir=rtl] .topbar h1{line-height:1.5}
.topbar .sub{font-size:13px;opacity:.8;margin-top:0}
.round-btn{width:42px;height:42px;border-radius:12px;box-shadow:none;background:#fff;color:var(--ink)}
.round-btn.ghost{background:rgba(255,255,255,.14);color:#fff}
.round-btn.ghost:hover{background:rgba(255,255,255,.22)}
.topbar .back{width:42px;height:42px;border-radius:12px;background:rgba(255,255,255,.14);align-items:center;justify-content:center;margin:0}
.biz-title{display:flex;align-items:center;gap:6px;background:transparent;border:0;color:#fff;font-size:19px;font-weight:800;cursor:pointer;min-width:0;padding:4px 2px}
.biz-title .bt-name{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:56vw}
.biz-title .ic{width:18px;height:18px;opacity:.85}
.biz-switch,.biz-name{display:none}

/* header tabs (Bills / Counter Sale) as a segmented control on ink */
.topbar .tabs{display:flex;gap:4px;background:rgba(255,255,255,.12);padding:4px;border-radius:12px;margin-top:12px;overflow-x:auto}
.topbar .tabs a{flex:1;text-align:center;padding:8px 12px;border-radius:9px;opacity:1;color:rgba(255,255,255,.85);font-weight:600}
.topbar .tabs a.on{background:#fff;color:var(--ink)}
.topbar .tabs a.on:after{display:none}

/* content sits under the header, never on top of it */
.content{padding:0 14px}
.overlap{margin-top:14px!important}
.content > :first-child{margin-top:14px}

/* surfaces */
.card{background:var(--card);border:1px solid var(--line);border-radius:var(--r);box-shadow:none;padding:16px}
.sheet-sec,.position,.bal-panel,.kh-page,.result-panel{background:var(--card);border:1px solid var(--line);border-radius:var(--r);margin:0 0 12px}
.sheet-sec{padding:6px 16px 12px}
.sec-title{font-size:15px;font-weight:700;margin:14px 0 6px;color:var(--text)}
.sec-title-row{display:flex;align-items:center;justify-content:space-between}
.sec-title-row .go{width:34px;height:34px;border-radius:10px;background:var(--soft);color:var(--ink);display:flex;align-items:center;justify-content:center}
[dir=rtl] .sec-title-row .go .ic{transform:scaleX(-1)}

/* home: money position */
.position{display:grid;grid-template-columns:1fr 1fr;margin-top:14px;overflow:hidden}
.pos-col{padding:14px 16px;display:flex;flex-direction:column;gap:2px;text-decoration:none}
.pos-col+.pos-col{border-inline-start:1px solid var(--line)}
.pos-lab{font-size:13px;color:var(--muted);font-weight:600}
.pos-val{font-size:22px;font-weight:800;letter-spacing:-.3px;line-height:1.3}
.pos-net{grid-column:1/-1;border-top:1px dashed var(--line);padding:9px 16px;font-size:13.5px;color:var(--muted);display:flex;justify-content:space-between;gap:8px;background:var(--soft)}
.pos-net.neg b{color:var(--red)} .pos-net.pos b{color:var(--green)}

/* segmented tabs in the page */
.seg-tabs{display:flex;gap:6px;overflow-x:auto;margin:0 0 12px;padding:2px;scrollbar-width:none}
.seg-tabs::-webkit-scrollbar{display:none}
.seg-tabs a{flex:1 0 auto;display:flex;align-items:center;justify-content:center;gap:6px;padding:9px 14px;border-radius:12px;border:1px solid var(--line);background:var(--card);color:var(--muted);font-weight:600;font-size:14px;white-space:nowrap}
.seg-tabs a .ic{width:17px;height:17px}
.seg-tabs a.on{background:var(--ink);border-color:var(--ink);color:#fff}

/* search */
.search-row{gap:8px;margin:0 0 10px}
.search{background:var(--card);border:1px solid var(--line);border-radius:12px;box-shadow:none;padding:0 12px;min-height:46px}
.search input{font-size:15px}
.icon-btn{width:46px;height:46px;border-radius:12px;background:var(--card);border:1px solid var(--line);color:var(--ink)}

/* lists */
.list.flat{background:var(--card);border:1px solid var(--line);border-radius:var(--r);overflow:hidden}
.list.flat .item{padding:12px 14px;border-bottom:1px solid var(--line);gap:12px;background:transparent}
.list.flat .item:last-child{border-bottom:0}
.item .name{font-size:16px;font-weight:700}
.item .meta{font-size:12.5px;color:var(--muted)}
.item .amt{font-size:17px;font-weight:800}
.item .lab{font-size:12px;color:var(--muted)}
.avatar{width:44px;height:44px;border-radius:13px;background:var(--ink-soft);color:var(--ink);font-weight:800;font-size:15px}
.avatar.green{background:var(--green-bg);color:var(--green)}
.avatar.sq{border-radius:13px}
.list.flat .empty{border:0}

/* add buttons that live with the list (no floating pills) */
.add-row,.fab{position:static!important;display:flex;align-items:center;justify-content:center;gap:8px;width:100%;margin:12px 0;padding:14px;border-radius:var(--r);border:1.5px dashed #AFC0DD;background:transparent;color:var(--ink);font-weight:700;font-size:15px;box-shadow:none!important;transform:none!important;text-decoration:none}
.add-row:hover,.fab:hover{background:var(--ink-soft)}
.add-row.green,.fab.btn-green{border-color:#9FD3B8;color:var(--green);background:transparent}
.add-row.slim{margin:10px 0 2px;padding:10px}
.add-row .ic,.fab .ic{width:19px;height:19px}
.add-two{display:grid;grid-template-columns:1fr 1fr;gap:8px}
.add-two .add-row{margin:12px 0}
body.dark .add-row,body.dark .fab{border-color:#34507F}

/* bottom bar */
.bottom-nav{left:0;right:0;transform:none;margin:0 auto!important;bottom:0!important;width:100%!important;max-width:760px;border-radius:18px 18px 0 0;padding:6px 6px calc(6px + env(safe-area-inset-bottom));background:var(--card);border:1px solid var(--line);border-bottom:0;box-shadow:0 -4px 18px rgba(19,33,63,.06);display:grid;grid-template-columns:1fr 1fr 76px 1fr 1fr;align-items:end}
.bottom-nav a{display:flex;flex-direction:column;align-items:center;gap:2px;padding:6px 2px;font-size:11.5px;font-weight:600;color:var(--muted)}
.bottom-nav a .ic{width:23px;height:23px}
.bottom-nav a.on{color:var(--ink)}
.bottom-nav a.on .ic{stroke-width:2.3}
.nav-add{justify-self:center;width:58px;height:58px;margin-top:-26px;margin-bottom:4px;border-radius:18px;border:4px solid var(--bg);background:var(--saffron);color:#fff;display:flex;align-items:center;justify-content:center;cursor:pointer;box-shadow:0 6px 16px rgba(233,131,12,.35)}
.nav-add .ic{width:26px;height:26px;stroke-width:2.6}
.fab-quick{display:none!important}
.app.has-nav{padding-bottom:calc(96px + env(safe-area-inset-bottom))}
@media (min-width:1100px){.bottom-nav{max-width:1040px}}

/* buttons & forms */
.btn{background:var(--ink);background-image:none;border-radius:12px;font-weight:700;box-shadow:none}
.btn:hover{background:var(--ink-2)}
.btn-green{background:var(--green)} .btn-red{background:var(--red)}
.btn-light{background:var(--soft);color:var(--text)}
.btn-outline{background:transparent;border:1.5px solid var(--ink);color:var(--ink)}
.btn-sm{border-radius:10px}
.input,select.input,textarea.input{border:1px solid #D5DDEA;border-radius:12px;background:var(--card)}
.input:focus{border-color:var(--ink);box-shadow:0 0 0 3px rgba(20,72,159,.12)}
body.dark .input{border-color:#2B3C5C}
.lbl{font-weight:600;font-size:13.5px;color:var(--muted)}
.seg{background:var(--soft);border-radius:12px}
.seg label:has(input:checked){background:var(--card);color:var(--ink);box-shadow:var(--shadow)}
.seg input:checked+span{color:inherit}
.seg label.r:has(input:checked){color:var(--red)} .seg label.g:has(input:checked){color:var(--green)}

/* party ledger */
.bal-panel{padding:16px 18px;margin-top:14px;border-inline-start:5px solid var(--muted)}
.bal-panel.is-rec{border-inline-start-color:var(--red)} .bal-panel.is-pay{border-inline-start-color:var(--green)}
.bal-who{font-size:14px;color:var(--muted);font-weight:600}
.bal-amt{font-size:30px;font-weight:800;letter-spacing:-.5px;line-height:1.25}
.is-rec .bal-amt{color:var(--red)} .is-pay .bal-amt{color:var(--green)}
.bal-due{display:flex;align-items:center;flex-wrap:wrap;gap:6px;font-size:13px;margin-top:6px;color:var(--muted)}
.bal-due .ic{width:16px;height:16px}
.bal-due.late{color:var(--red)}

.quick-chips{display:flex;gap:8px;overflow-x:auto;margin:0 0 12px;padding:2px;scrollbar-width:none}
.quick-chips::-webkit-scrollbar{display:none}
.quick-chips a,.quick-chips button{flex:0 0 auto;display:flex;align-items:center;gap:7px;padding:9px 14px;border-radius:12px;border:1px solid var(--line);background:var(--card);color:var(--text);font-weight:600;font-size:14px;cursor:pointer;font-family:inherit}
.quick-chips .ic{width:18px;height:18px;color:var(--ink)}
.quick-chips .off{opacity:.45;pointer-events:none}

.kh-page{overflow:hidden;padding:0}
.kh-tools{display:flex;align-items:center;gap:10px;padding:10px 12px;border-bottom:1px solid var(--line)}
.kh-tools .search{flex:1;min-height:40px;border-radius:10px;background:var(--soft);border-color:transparent}
.kh-count{font-size:12.5px;color:var(--muted);white-space:nowrap}
.kh-head,.kh-row{display:grid;grid-template-columns:58px 1fr auto;align-items:start}
.kh-head{font-size:12px;font-weight:700;color:var(--muted);background:var(--soft);border-bottom:1px solid var(--line)}
.kh-head span{padding:7px 12px}
.kh-m{border-inline-end:2px solid rgba(247,147,30,.55);align-self:stretch;text-align:center}
.kh-head .kh-m{border-inline-end-color:rgba(247,147,30,.55)}
.kh-row{border-bottom:1px solid var(--line);text-decoration:none;background:repeating-linear-gradient(transparent 0 31px,transparent 31px 32px)}
.kh-row:hover{background:var(--soft)}
.kh-row .kh-m{padding:10px 4px;display:flex;flex-direction:column;align-items:center;line-height:1.1}
.kh-row .kh-m b{font-size:19px;font-weight:800;color:var(--ink)}
.kh-row .kh-m small{font-size:11px;color:var(--muted);margin-top:2px}
.kh-row.new-day{border-top:1px solid #CBD6EA}
.kh-d{padding:10px 12px;display:flex;flex-direction:column;gap:1px;min-width:0}
.kh-note{font-weight:700;font-size:15px;unicode-bidi:plaintext;overflow-wrap:anywhere}
[dir=rtl] .kh-note{text-align:right}
.kh-meta{font-size:12px;color:var(--muted)}
.kh-meta .src{display:inline-block;font-size:11px;font-weight:700;color:var(--ink);background:var(--ink-soft);padding:0 6px;border-radius:6px;margin-inline-start:4px}
.kh-meta .src.bank{color:var(--green);background:var(--green-bg)}
.kh-run{font-size:12px;color:var(--muted)}
.kh-a{padding:10px 14px;font-size:17px;font-weight:800;white-space:nowrap;direction:ltr}
.kh-a.gave{color:var(--red)} .kh-a.got{color:var(--green)}
.kh-page .empty{padding:36px 20px}

/* the two big entry buttons */
.split-btns{background:linear-gradient(transparent,var(--bg) 35%);padding-bottom:calc(14px + env(safe-area-inset-bottom))}
.entry-bar{gap:10px}
.entry-bar .eb{flex:1;display:flex;align-items:center;gap:10px;padding:12px 14px;border-radius:14px;color:#fff;text-decoration:none;box-shadow:0 6px 16px rgba(19,33,63,.14)}
.entry-bar .eb .ic{width:26px;height:26px;flex:none;background:rgba(255,255,255,.18);border-radius:9px;padding:3px;stroke-width:2.4}
.entry-bar .eb span{display:flex;flex-direction:column;line-height:1.25}
.entry-bar .eb b{font-size:16px}
.entry-bar .eb small{font-size:11.5px;opacity:.85}
.entry-bar .gave{background:var(--red)} .entry-bar .got{background:var(--green)}

/* older ledgers (bank, cash) keep their columns but with the new colours */
.ledger-head{background:var(--soft);border-radius:10px 10px 0 0}
.lrow{border-bottom:1px solid var(--line)}
.lrow .c2{background:transparent!important;color:var(--red)} .lrow .c3{color:var(--green)}
.chip{border-radius:7px;background:var(--red-bg);color:var(--red)} .chip.g{background:var(--green-bg);color:var(--green)}

/* generic summary card (bank, cash, bills pages) */
.sum-card{border:1px solid var(--line);box-shadow:none;border-radius:var(--r)}
.sum-card .v{font-weight:800}
.action-tiles a,.action-tiles button{border:1px solid var(--line);box-shadow:none;border-radius:12px;font-weight:600}
.action-tiles .ic{color:var(--ink)}
.action-tiles .pdf-btn .ic{color:var(--green)}

/* reports */
.period-chips{display:flex;gap:6px;overflow-x:auto;margin:14px 0 12px;padding:2px;scrollbar-width:none}
.period-chips::-webkit-scrollbar{display:none}
.period-chips a,.period-chips select{flex:0 0 auto;padding:8px 14px;border-radius:12px;border:1px solid var(--line);background:var(--card);color:var(--muted);font-weight:600;font-size:14px;font-family:inherit;white-space:nowrap}
.period-chips select{appearance:auto;padding-inline-end:8px;max-width:150px}
.period-chips .on{background:var(--ink);border-color:var(--ink);color:#fff}
.result-panel{padding:16px 18px}
.rp-lab{display:flex;justify-content:space-between;gap:8px;font-weight:700;color:var(--muted);font-size:14px}
.is-profit .rp-lab span:first-child{color:var(--green)} .is-loss .rp-lab span:first-child{color:var(--red)}
.rp-amt{font-size:32px;font-weight:800;letter-spacing:-.6px;line-height:1.25;margin:2px 0 10px}
.is-profit .rp-amt{color:var(--green)} .is-loss .rp-amt{color:var(--red)}
.rp-bar{display:flex;height:10px;border-radius:6px;overflow:hidden;background:var(--soft);gap:2px}
.rp-bar i{display:block;height:100%}
.rp-bar .in,.rp-legend .in{background:var(--ink)} .rp-bar .out,.rp-legend .out{background:var(--saffron)}
.rp-legend{display:flex;justify-content:space-between;gap:10px;flex-wrap:wrap;margin-top:10px;font-size:13px;color:var(--muted)}
.rp-legend > span{display:flex;align-items:center;gap:6px}
.rp-legend i{width:10px;height:10px;border-radius:3px;display:inline-block}
.rp-legend b{color:var(--text)}
.ln-row{display:flex;align-items:center;gap:10px;padding:11px 0;border-bottom:1px solid var(--line);text-decoration:none}
.ln-row:last-of-type{border-bottom:0}
.ln-row span{flex:1}
.ln-row b{font-weight:800}
.ln-row .chev{width:18px;height:18px;color:var(--muted)}
.chart{color:var(--text)}
.legend span{font-size:13px;color:var(--muted)}
.legend i{border-radius:3px}
.kpis .kpi{border:1px solid var(--line);border-radius:12px;background:var(--soft)}
.kpi.solid{background:var(--ink)!important;border-color:var(--ink)}
.toplist{border-color:var(--line);border-radius:12px}

/* drawer, sheets, menus */
.drawer-panel{border-radius:0 22px 22px 0}
.drawer-sec{letter-spacing:0;text-transform:none;font-size:13px;font-weight:700;color:var(--muted);margin:20px 6px 6px}
.drawer-panel a{border-radius:12px}
.drawer-panel a .ic{color:var(--ink)}
.drawer-panel a:hover{background:var(--soft)}
.sheet-card{border-radius:24px 24px 0 0}
.sheet-card h3{font-weight:800}
.menu{border:1px solid var(--line);box-shadow:none;border-radius:var(--r)}
.menu .ic{color:var(--ink)}
.menu .neg .ic{color:var(--red)}
.quick-grid a{border:1px solid var(--line);border-radius:14px;background:var(--card)}
.quick-grid a .ic{color:var(--ink)}
.tiles3 a{border:1px solid var(--line);box-shadow:none;border-radius:var(--r)}
.tiles3 a .ic{color:var(--ink)}
.toast{border-radius:12px;font-weight:600}

/* login, register, lock */
.auth{background:var(--bg)}
.auth .form{background:var(--card);border:1px solid var(--line);border-radius:var(--r-l);padding:20px;max-width:440px;width:100%}
.auth .logo b{font-weight:800;letter-spacing:-.3px}
.auth .install-card{border:1px solid var(--line);box-shadow:none}
.lang-switch a{box-shadow:none;border:1px solid var(--line);font-weight:600}
.lang-switch a.on{background:var(--ink);border-color:var(--ink)}
.lock-ic{color:var(--ink)}
.pin-boxes span{border-radius:12px;border:1.5px solid #C6D2E6}
.pin-boxes span.f{background:var(--ink);border-color:var(--ink)}
.keypad button{border-radius:16px;font-weight:700}
.keypad button:active{background:var(--ink-soft)}
.bio-btn{border-color:var(--ink);color:var(--ink);border-radius:12px}
.install-card .btn{background:var(--saffron)}

/* RTL */
[dir=rtl] .kh-a{text-align:left}
[dir=rtl] .pos-net{flex-direction:row}
[dir=rtl] .entry-bar .eb span{text-align:right}

/* print / pdf keep the light page */
@media print{.bottom-nav,.nav-add,.quick-chips,.kh-tools,.entry-bar,.seg-tabs,.period-chips,.add-row{display:none!important}.topbar{display:none!important}.kh-page,.bal-panel,.sheet-sec,.result-panel{border-color:#ccc}}

/* refinements */
.seg-tabs{display:grid;grid-template-columns:repeat(4,1fr);overflow:visible}
.seg-tabs a{flex-direction:column;gap:2px;padding:8px 4px;font-size:13px}
.seg-tabs a .ic{width:20px;height:20px}
.date-wrap input::-webkit-calendar-picker-indicator{position:absolute;inset:0;width:auto;height:auto;opacity:0;cursor:pointer}
.tiles3 a{text-transform:none;font-size:13.5px;font-weight:600;letter-spacing:0}
.period-chips select{max-width:132px}
.topbar h1,.title-wrap h1{line-height:1.4}
.item .name,.pcard .pn,.sum-card .v,.kh-note{line-height:1.45}

/* logo */
.wm{font-weight:800;letter-spacing:-.3px;unicode-bidi:isolate}
.wm-my{color:#14489F} .wm-plus{color:#F7931E}
body.dark .wm-my{color:#fff}
.mh-symbol,.mh-wordmark,.mh-stacked{display:block;height:auto;max-width:100%}
.mh-wordmark{width:auto}
.topbar .mh-symbol{width:34px;flex:none}
.auth .logo{gap:6px;margin-bottom:6px}
.auth .logo .mh-stacked{width:170px;margin-bottom:4px}
.auth .logo .mh-wordmark{height:40px;margin-bottom:6px}
.drawer-head{display:block;padding:0 6px 14px;border-bottom:1px solid var(--line)}
.drawer-head .mh-wordmark{height:34px;margin-bottom:6px}
.drawer-head small{color:var(--muted)}
.splash .mh-stacked{width:200px}
.foot .mh-wordmark,.about .mh-wordmark{margin:0 auto}
.sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
body.dark .mh-wordmark:not(.keep){content:url(../img/logo-wordmark-white.png)}
body.dark .mh-stacked,body.dark .ab-logo{content:url(../img/logo-stacked-white.png)}
body.dark .card .mh-symbol,body.dark .drawer .mh-symbol{content:url(../img/kp-symbol-white.png)}

/* "Made with KhataPlus" strip */
.promo-strip{display:flex;align-items:center;gap:10px;margin:14px 0 0;padding:8px 10px;border:1px solid #E2E8F3;border-radius:12px;background:#F7F9FD;color:#13213F;break-inside:avoid;-webkit-print-color-adjust:exact;print-color-adjust:exact;font-size:12px;line-height:1.35}
.ps-qr{width:44px;height:44px;flex:none;background:#fff;border-radius:6px;padding:2px;border:1px solid #E2E8F3}
.ps-qr svg{width:100%;height:100%;display:block}
.ps-txt{flex:1;min-width:0;display:flex;flex-direction:column;gap:1px}
.ps-line{display:flex;align-items:center;gap:6px;font-weight:600;color:#66728C;white-space:nowrap}
.ps-line img{height:18px;width:auto;display:inline-block}
.ps-sub{color:#66728C;font-size:11.5px;display:flex;flex-direction:column;min-width:0}
.ps-sub .ps-dot{display:none}
.ps-url{direction:ltr;unicode-bidi:isolate;color:#14489F;font-weight:600;font-size:10.5px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.rm-seg label:has(input[value=whatsapp]:checked){color:#16A34A}
.ps-btn{flex:none;text-decoration:none;background:#F7931E;color:#fff;font-weight:700;border-radius:8px;padding:6px 12px;font-size:12.5px}
.promo-strip.compact{margin:0;border:0;background:transparent;padding:0;flex:1 1 280px;justify-content:flex-end;max-width:420px}
.promo-strip.compact .ps-qr{width:40px;height:40px}
@media print{.ps-btn{display:none!important}}
body.pdf-mode .ps-btn{display:none}
body.dark .promo-strip{background:var(--soft);border-color:var(--line);color:var(--text)}
body.dark .ps-line img{content:url(../img/logo-wordmark-white.png)}
body.pdf-mode .promo-strip{background:#F7F9FD;border-color:#E2E8F3}
body.pdf-mode .ps-line img{content:url(../img/logo-wordmark.png)}
.remind-form .rm-text{font-size:14.5px;line-height:1.6;min-height:220px;unicode-bidi:plaintext}
.rm-seg{margin:8px 0 10px}
.rm-count{text-align:end;margin:4px 0 0}

/* bill / purchase items on phones */
input[type=date],input[type=datetime-local],input[type=month],input[type=time]{min-width:0;max-width:100%;width:100%;display:block;-webkit-appearance:none;appearance:none;text-align:start}
input[type=datetime-local]::-webkit-date-and-time-value,input[type=date]::-webkit-date-and-time-value{text-align:start}
.items-tbl select{width:100%;padding:9px 10px;border:1.5px solid var(--line);border-radius:10px;background:var(--card);color:var(--text);font:inherit}
.items-tbl .il{display:none}
.items-tbl td.ltc{white-space:nowrap;font-weight:700}
@media (max-width:600px){
  .row2:has(input[type=datetime-local]){grid-template-columns:1fr}
  .table-wrap:has(.items-tbl){overflow:visible}
  .items-tbl,.items-tbl tbody{display:block;width:100%;min-width:0}
  .items-tbl thead{display:none}
  .items-tbl tr{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.3fr) minmax(0,1.3fr) 36px;gap:8px;align-items:end;padding:10px;margin:0 0 8px;border:1px solid var(--line);border-radius:14px;background:var(--soft)}
  .items-tbl td{padding:0!important;border:0!important;min-width:0}
  .items-tbl td:first-child{grid-column:1/-1}
  .items-tbl .il{display:block;font-size:11.5px;font-weight:600;color:var(--muted);margin:0 0 3px}
  .items-tbl input{padding:9px 8px;font-size:16px;text-align:center}
  .items-tbl td:first-child input{text-align:start}
  .items-tbl td.ltc{text-align:end;align-self:stretch;display:flex;flex-direction:column;justify-content:flex-end;padding-bottom:9px!important;font-size:15px}
  .items-tbl td.ltc .il{text-align:end}
  .items-tbl .del{width:36px;height:40px}
}
.card-title .em .ic{width:30px;height:30px;color:var(--ink)}
.seg label.g:has(input:checked),.seg label.r:has(input:checked){background:var(--card)}
.btn.btn-danger-text{background:transparent;color:var(--red);border:1.5px solid var(--red);box-shadow:none}
.btn.btn-danger-text .ic{color:var(--red)}
.okbox{background:var(--green-bg);color:var(--green);padding:10px 14px;border-radius:10px;margin-bottom:10px;font-weight:600}
.otp-input{font-size:26px;letter-spacing:10px;text-align:center;font-weight:700;font-variant-numeric:tabular-nums}
.otp-input::placeholder{letter-spacing:10px;color:var(--line)}
.linkbtn{background:none;border:0;color:var(--ink);font:inherit;font-weight:700;padding:8px;cursor:pointer}
.linkbtn:disabled{color:var(--muted);cursor:default;font-weight:600}
.otp-resend{margin-top:6px}
.auth .tabs2{display:flex;background:var(--soft);border-radius:12px;padding:4px;gap:4px;margin:0 0 12px}
.auth .tabs2 label{flex:1;text-align:center;padding:9px;border-radius:9px;font-weight:700;color:var(--muted);cursor:pointer}
.auth .tabs2 input{display:none}
.auth .tabs2 label:has(input:checked){background:var(--card);color:var(--ink);box-shadow:var(--shadow)}
.auth .forgot{display:block;text-align:end;margin:6px 0 0;font-size:13.5px;font-weight:600}
.auth .back-link{display:inline-block;margin-top:8px;font-size:14px}
.auth .forgot{color:var(--ink)}
.pw-wrap{position:relative;display:block}
.pw-wrap input{width:100%;padding-inline-end:46px}
.pw-eye{position:absolute;inset-inline-end:4px;top:50%;transform:translateY(-50%);width:40px;height:40px;display:flex;align-items:center;justify-content:center;background:none;border:0;border-radius:10px;color:var(--muted);cursor:pointer}
.pw-eye:hover,.pw-eye:focus-visible{color:var(--ink);background:var(--soft)}
.about-card{text-align:start}
.about-head{text-align:center;padding:4px 0 6px}
.about-head .mh-wordmark{height:34px}
.about-head p{margin:6px 0 0;color:var(--muted);font-weight:600;font-size:14px}
.about-txt{margin:10px 0 14px;font-size:14.5px;line-height:1.65;color:var(--text)}
.about-info{display:grid;grid-template-columns:auto 1fr;margin:0 0 12px;border:1px solid var(--line);border-radius:12px;overflow:hidden;font-size:14px}
.about-info dt,.about-info dd{margin:0;padding:9px 12px;border-bottom:1px solid var(--line)}
.about-info dt{color:var(--muted);font-weight:600;background:var(--soft)}
.about-info dd{font-weight:600;overflow-wrap:anywhere}
.about-info dt:nth-last-of-type(1),.about-info dd:last-child{border-bottom:0}
.about-info a{color:var(--ink)}
.about-note{display:flex;gap:8px;align-items:flex-start;margin:0 0 8px;font-size:13px;color:var(--muted)}
.about-note .ic{width:16px;height:16px;flex:none;margin-top:2px;color:var(--green)}
.about-copy{margin:0 0 12px;font-size:12.5px;color:var(--muted);text-align:center}
.about-info dd.one-line{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;font-size:13px}
.auth .by-switch{margin:10px 0 0}.auth .by-switch label{color:var(--ink);font-weight:600;cursor:pointer}
.menu a .mail-val{min-width:0;flex:1 1 auto;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.amt-cur{display:grid;grid-template-columns:minmax(0,1.4fr) minmax(0,1fr);gap:10px}
.amt-cur .cur-sel{font-size:16px;padding-inline:10px}
.fx-note{background:var(--ink-soft);color:var(--ink);padding:8px 12px;border-radius:10px;margin:8px 0 0}
.cur-tabs{display:flex;gap:8px;overflow-x:auto;margin:10px 0 2px;padding:2px;scrollbar-width:none}
.cur-tabs::-webkit-scrollbar{display:none}
.cur-tabs a{flex:0 0 auto;display:flex;flex-direction:column;align-items:center;gap:1px;min-width:84px;padding:7px 14px;border:1px solid var(--line);border-radius:12px;background:var(--card);color:var(--text)}
.cur-tabs a b{font-size:15px}
.cur-tabs a span{font-size:12.5px;font-weight:700;font-variant-numeric:tabular-nums}
.cur-tabs a.on{border-color:var(--ink);box-shadow:0 0 0 1px var(--ink) inset;background:var(--ink-soft)}
.fx-line{display:flex;flex-wrap:wrap;gap:4px;margin-top:3px}
.fx-chip{font-size:11.5px;font-weight:700;padding:1px 7px;border-radius:999px;background:var(--soft);font-variant-numeric:tabular-nums}
.fx-chip.neg{color:var(--red)} .fx-chip.pos{color:var(--green)}
/* about page */
.ab-hero{text-align:center;padding:22px 16px 18px}
.ab-logo{width:150px;height:auto;display:block;margin:0 auto}
.ab-tag{margin:8px 0 6px;color:var(--muted);font-weight:600}
.ab-ver{display:inline-flex;gap:6px;margin:0;padding:4px 12px;border-radius:999px;background:var(--ink-soft);color:var(--ink);font-size:13px}
.ab-h{margin:0 0 8px;font-size:16px}
.ab-p{margin:0 0 10px;line-height:1.7;font-size:14.5px}
.ab-p:last-child{margin-bottom:0}
.ab-feat{list-style:none;margin:0;padding:0;display:grid;gap:12px}
.ab-feat li{display:flex;gap:12px;align-items:flex-start}
.ab-feat b{display:block;font-size:14.5px}
.ab-feat span:not(.ab-ic){display:block;color:var(--muted);font-size:13.5px;line-height:1.55}
.ab-ic{flex:none;width:36px;height:36px;border-radius:10px;background:var(--ink-soft);color:var(--ink);display:flex;align-items:center;justify-content:center}
.ab-ic .ic{width:19px;height:19px}
.ab-dev{display:flex;gap:12px;align-items:center;margin:0 0 12px}
.ab-am{flex:none;width:44px;height:44px;border-radius:12px;background:var(--ink);color:#fff;font-weight:800;display:flex;align-items:center;justify-content:center;letter-spacing:.5px}
.ab-am+div b{display:block}
.ab-am+div span{display:block;color:var(--muted);font-size:13px}
.ab-list{display:grid;grid-template-columns:auto 1fr;margin:0;border:1px solid var(--line);border-radius:12px;overflow:hidden;font-size:14px}
.ab-list dt,.ab-list dd{margin:0;padding:9px 12px;border-bottom:1px solid var(--line)}
.ab-list dt{color:var(--muted);font-weight:600;background:var(--soft)}
.ab-list dd{font-weight:600;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.ab-list dt:nth-last-of-type(1),.ab-list dd:last-child{border-bottom:0}
.ab-list a{color:var(--ink)}
.ab-actions{display:grid;gap:10px;margin:4px 0 14px}
.ab-actions .btn{display:flex;align-items:center;justify-content:center;gap:8px}
.ab-copy{text-align:center;color:var(--muted);font-size:12.5px;margin:0 0 8px}
@media (min-width:700px){.ab-actions{grid-template-columns:repeat(3,1fr)}}
.ab-list dd{white-space:normal;overflow:visible;overflow-wrap:anywhere}
.amt-cur{grid-template-columns:minmax(0,1fr) minmax(0,1fr)}.ab-list dd a{font-size:13px}

/* side menu */
.drawer-panel{width:min(310px,86vw);padding:calc(14px + env(safe-area-inset-top)) 12px calc(16px + env(safe-area-inset-bottom));display:flex;flex-direction:column}
.dr-top{display:flex;align-items:center;justify-content:space-between;padding:2px 4px 12px}
.dr-top .mh-wordmark{height:42px;margin:0}
.dr-close{width:36px;height:36px;border:0;border-radius:10px;background:var(--soft);color:var(--muted);display:flex;align-items:center;justify-content:center;cursor:pointer}
.dr-close .ic{width:18px;height:18px}
.drawer-panel a.dr-biz{display:flex;align-items:center;gap:10px;padding:10px;margin:0 0 6px;border-radius:14px;background:var(--ink);color:#fff;font-size:15px}
.dr-av{flex:none;width:40px;height:40px;border-radius:12px;background:rgba(255,255,255,.16);display:flex;align-items:center;justify-content:center;font-weight:800}
.dr-bt{flex:1;min-width:0;display:flex;flex-direction:column}
.dr-bt b,.dr-bt small{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.dr-bt small{opacity:.8;font-size:12px}
.drawer-panel a.dr-biz .ic{color:#fff;width:18px;height:18px}
.dr-sw{flex:none;width:32px;height:32px;border-radius:10px;background:rgba(255,255,255,.14);display:flex;align-items:center;justify-content:center}
.drawer-sec{margin:14px 8px 4px;font-size:12px;font-weight:700;color:var(--muted);letter-spacing:0;text-transform:none}
.drawer-panel a.dr-i{display:flex;align-items:center;gap:12px;padding:7px 8px;font-size:15px;font-weight:600;color:var(--text);border-radius:12px}
.dr-ic{flex:none;width:34px;height:34px;border-radius:10px;background:var(--ink-soft);display:flex;align-items:center;justify-content:center}
.drawer-panel a.dr-i .ic{width:18px;height:18px;color:var(--ink)}
.drawer-panel a.dr-i:hover{background:var(--soft)}
.drawer-panel a.dr-i.on{background:var(--ink-soft);color:var(--ink)}
.drawer-panel a.dr-i.on .dr-ic{background:var(--ink)}
.drawer-panel a.dr-i.on .ic{color:#fff}
.drawer-panel a.dr-out{color:var(--red);margin-top:6px}
.drawer-panel a.dr-out .dr-ic{background:var(--red-bg)}
.drawer-panel a.dr-out .ic{color:var(--red)}
.dr-foot{margin-top:auto;padding:14px 8px 0;border-top:1px solid var(--line);font-size:12px;color:var(--muted);line-height:1.6}
[dir=rtl] .drawer-panel{left:auto;right:0;border-radius:22px 0 0 22px}

/* settings */
.sprof{display:flex;align-items:center;gap:12px;background:var(--card);border:1px solid var(--line);border-radius:var(--r-l);padding:14px;margin-bottom:16px}
.sp-av{flex:none;width:50px;height:50px;border-radius:14px;background:var(--ink);color:#fff;font-weight:800;font-size:18px;display:flex;align-items:center;justify-content:center}
.sp-t{flex:1;min-width:0;display:flex;flex-direction:column}
.sp-t b{font-size:16.5px}
.sp-t small{color:var(--muted);font-size:12.5px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.sprof .btn{flex:none;display:flex;align-items:center;gap:6px}
.sprof .btn .ic{width:16px;height:16px}
.sgroup{margin:0 0 14px}
.sgroup h4{margin:0 6px 6px;font-size:12.5px;font-weight:700;color:var(--muted)}
.slist{background:var(--card);border:1px solid var(--line);border-radius:var(--r);overflow:hidden}
.srow{display:flex;align-items:center;gap:12px;padding:11px 14px;border-bottom:1px solid var(--line);color:var(--text);margin:0;min-height:58px}
.srow:last-child{border-bottom:0}
.si{flex:none;width:36px;height:36px;border-radius:10px;background:var(--ink-soft);color:var(--ink);display:flex;align-items:center;justify-content:center}
.si .ic{width:19px;height:19px}
.st{flex:1;min-width:0;display:flex;flex-direction:column}
.st b{font-size:15px;font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.st small{color:var(--muted);font-size:12.5px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.sv{flex:none;font-size:13.5px;color:var(--muted);max-width:45%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.sv b{color:var(--text)}
.srow .ic.chev{flex:none;width:18px;height:18px;color:var(--muted)}
.srow .switch{margin-inline-start:auto}
.srow.neg b{color:var(--red)}
.srow.neg .si{background:var(--red-bg);color:var(--red)}
.pill{display:inline-block;padding:2px 10px;border-radius:999px;font-size:12px;font-weight:700;background:var(--soft);color:var(--muted)}
.pill.on{background:var(--green-bg);color:var(--green)}
.slogout{display:flex;align-items:center;justify-content:center;gap:8px;margin:4px 0 10px}
.or-line{display:flex;align-items:center;gap:10px;margin:14px 0 10px;color:var(--muted);font-size:13px}
.or-line::before,.or-line::after{content:"";flex:1;height:1px;background:var(--line)}
.btn-google{display:flex;align-items:center;justify-content:center;gap:10px;width:100%;min-height:48px;padding:10px 14px;border:1.5px solid var(--line);border-radius:12px;background:#fff;color:#1f1f1f;font-weight:700;font-size:15px}
.btn-google:hover{border-color:#c9d2e3;background:#fafbfd}
.btn-google svg{flex:none}
body.dark .btn-google{background:#fff;color:#1f1f1f}

/* owner dashboard */
.ad-kpis{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;margin:0 0 12px}
@media (min-width:700px){.ad-kpis{grid-template-columns:repeat(4,minmax(0,1fr))}}
.ad-k{background:var(--card);border:1px solid var(--line);border-radius:14px;padding:10px 12px;min-width:0}
.ad-k small{display:block;color:var(--muted);font-size:12px;font-weight:600}
.ad-k b{display:block;font-size:22px;line-height:1.3;font-variant-numeric:tabular-nums}
.ad-k span{display:block;color:var(--muted);font-size:11.5px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.ad-k.hl{background:var(--ink);border-color:var(--ink);color:#fff}
.ad-k.hl small,.ad-k.hl span{color:rgba(255,255,255,.8)}
.ad-card h3{margin:0 0 8px;font-size:15px}
.ad-card .cc{width:100%;height:auto;display:block;color:var(--text)}
.ad-leg{display:flex;flex-wrap:wrap;gap:4px 14px;font-size:12px;color:var(--muted);margin:0 0 6px}
.ad-leg i{display:inline-block;width:9px;height:9px;border-radius:3px;margin-inline-end:5px}
.ad-grid{display:grid;grid-template-columns:1fr;gap:0 12px}
@media (min-width:700px){.ad-grid{grid-template-columns:1fr 1fr}}
.hb{display:grid;grid-template-columns:minmax(70px,30%) 1fr auto;align-items:center;gap:8px;padding:4px 0;font-size:13px}
.hb-l{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;font-weight:600}
.hb-b{height:8px;border-radius:99px;background:var(--soft);overflow:hidden}
.hb-b i{display:block;height:100%;background:var(--ink);border-radius:99px}
.hb-v{font-weight:700;font-variant-numeric:tabular-nums;white-space:nowrap}
.hb-v small{color:var(--muted);font-weight:600}
.ad-uh{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:8px;margin-bottom:6px}
.ad-uh h3{margin:0}
.ad-uh form{flex:1 1 220px;max-width:340px}
.ad-users{display:flex;flex-direction:column}
.ad-u{display:flex;align-items:center;gap:10px;padding:9px 0;border-bottom:1px solid var(--line)}
.ad-u:last-child{border-bottom:0}
.ad-ut{flex:1;min-width:0;display:flex;flex-direction:column}
.ad-ut b{font-size:14.5px}
.ad-ut small{color:var(--muted);font-size:12px;overflow:hidden;text-overflow:ellipsis}
.ad-seen{flex:none;font-size:12px;font-weight:700;color:var(--muted);background:var(--soft);padding:3px 9px;border-radius:99px;white-space:nowrap}
.ad-seen.on{color:var(--green);background:var(--green-bg)}
/* date range picker (owner dashboard) */
.rng{padding:12px}
.rng-chips{display:flex;gap:6px;overflow-x:auto;scrollbar-width:none;padding:1px}
.rng-chips::-webkit-scrollbar{display:none}
.rng-chips a{flex:none;display:flex;align-items:center;gap:6px;padding:7px 13px;border-radius:999px;border:1px solid var(--line);background:var(--card);color:var(--text);font-size:13.5px;font-weight:600;white-space:nowrap}
.rng-chips a .ic{width:15px;height:15px;color:var(--ink)}
.rng-chips a.on{background:var(--ink);border-color:var(--ink);color:#fff}
.rng-chips a.on .ic{color:#fff}
.rng-form{display:grid;grid-template-columns:1fr 1fr auto;gap:8px;align-items:end;margin:10px 0 0;padding:10px;border-radius:12px;background:var(--soft)}
.rng-form[hidden]{display:none}
.rng-form label{display:flex;flex-direction:column;gap:3px;min-width:0}
.rng-form small{font-size:12px;font-weight:600;color:var(--muted)}
.rng-form .input{min-height:42px;background:var(--card)}
.rng-form .btn{min-height:42px;padding:0 18px}
.rng-now{display:flex;align-items:center;gap:6px;margin:10px 2px 0;font-size:13px;font-weight:700;color:var(--ink)}
.rng-now .ic{width:16px;height:16px}
@media (max-width:420px){.rng-form{grid-template-columns:1fr 1fr}.rng-form .btn{grid-column:1/-1}}
.rng-chips{flex-wrap:wrap;overflow:visible}.rng-chips a{padding:6px 12px;font-size:13px}
/* bills and purchases stay white like paper, also in dark mode */
body.dark #receipt{
  --ink:#14489F; --ink-soft:#E7EEFB; --card:#FFFFFF; --text:#13213F; --muted:#66728C; --line:#E2E8F3; --soft:#EEF2F9;
  --red:#D23B3B; --green:#16935A; --red-bg:#FCEEEE; --green-bg:#E7F5EE;
  background:#fff; color:#13213F; border-color:#E2E8F3; color-scheme:light;
}
body.dark #receipt .mh-wordmark,body.dark #receipt .ps-line img{content:url(../img/logo-wordmark.png)}
body.dark #receipt .mh-symbol{content:url(../img/kp-symbol.png)}
body.dark #receipt .promo-strip{background:#F7F9FD;border-color:#E2E8F3;color:#13213F}
/* ad space: quiet, at the end of the page, never printed */
.ad-slot{margin:16px 0 8px;padding:8px 10px 10px;border:1px dashed var(--line);border-radius:12px;background:var(--card);min-height:90px;overflow:hidden}
.ad-slot small{display:block;font-size:10.5px;color:var(--muted);margin:0 0 4px;letter-spacing:.2px}
.ad-slot ins{min-height:60px}
@media print{.ad-slot{display:none!important}}
body.pdf-mode .ad-slot{display:none!important}

/* feedback */
.fb-stars{display:flex;flex-direction:row-reverse;justify-content:center;gap:6px;margin:6px 0 4px}
[dir=rtl] .fb-stars{flex-direction:row}
.fb-stars input{display:none}
.fb-stars label{cursor:pointer;color:#C9D2E3;padding:2px}
.fb-stars label .ic{width:36px;height:36px;fill:currentColor;stroke:currentColor}
.fb-stars input:checked~label,.fb-stars label:hover,.fb-stars label:hover~label{color:#F7B500}
[dir=rtl] .fb-stars input:checked~label{color:#C9D2E3}
.fb-kind{margin-bottom:4px}
.fb-form .btn .ic{width:18px;height:18px;vertical-align:-3px;margin-inline-end:6px}
.fb-mine{padding:8px 0;border-bottom:1px solid var(--line)}
.fb-mine:last-child{border-bottom:0}
.fb-mine small{color:var(--muted);margin-inline-start:6px}
.fb-mine p{margin:3px 0 4px;font-size:13.5px}
.fb-r{color:#F7B500;letter-spacing:1px;font-size:13px}
.fb-r i{color:#D5DCE8;font-style:normal}
.fb-item{border:1px solid var(--line);border-radius:12px;padding:10px 12px;margin:0 0 8px}
.fb-item.new{border-color:var(--saffron);background:var(--saffron-soft)}
.fb-item.done{opacity:.7}
.fb-top{display:flex;flex-wrap:wrap;align-items:center;gap:4px 8px}
.fb-top small{color:var(--muted)}
.fb-k{font-size:11.5px;font-weight:700;padding:1px 8px;border-radius:99px;background:var(--soft)}
.fb-k.problem{background:var(--red-bg);color:var(--red)} .fb-k.praise{background:var(--green-bg);color:var(--green)} .fb-k.idea{background:var(--ink-soft);color:var(--ink)}
.fb-item p{margin:6px 0;font-size:14px;line-height:1.55;overflow-wrap:anywhere}
.fb-meta{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:6px}
.fb-meta small{color:var(--muted);font-size:11.5px}
.fb-meta form{display:flex;gap:6px}
.ad-preview div{display:flex;flex-direction:column;align-items:center;justify-content:center;min-height:64px;border-radius:8px;background:var(--soft);color:var(--muted);font-weight:700;font-size:14px;text-align:center}
.ad-preview div span{font-weight:500;font-size:11.5px;margin-top:2px}
body:has(.bottom-nav) .ad-slot{margin-bottom:calc(96px + env(safe-area-inset-bottom))}
.menu a.wa-i .ic:first-child{color:#1FA855}
.srow.wa-i .si{background:#E5F7EC;color:#1FA855}
.drawer-panel a.dr-i[href^="https://wa.me"] .dr-ic{background:#E5F7EC}
.drawer-panel a.dr-i[href^="https://wa.me"] .ic{color:#1FA855}
body.dark .srow.wa-i .si,body.dark .drawer-panel a.dr-i[href^="https://wa.me"] .dr-ic{background:#123224}
.install-card.in-app{position:relative;margin:0 0 12px;padding-inline-end:44px;border:1px solid var(--line);box-shadow:none;background:var(--card)}
.install-card.in-app[hidden]{display:none}
.install-card.in-app .btn{background:var(--saffron)}
.inst-x{position:absolute;top:6px;inset-inline-end:6px;width:30px;height:30px;border:0;border-radius:9px;background:transparent;color:var(--muted);display:flex;align-items:center;justify-content:center;cursor:pointer}
.inst-x:hover{background:var(--soft)}
.inst-x .ic{width:16px;height:16px}

/* without internet: bar on top, entries waiting to send, lock on saved pages */
.netbar[hidden]{display:none}
.netbar{margin:0 0 10px;padding:9px 12px;border-radius:12px;background:#EEF3FB;color:#14335F;font-size:13px;line-height:1.45;display:flex;flex-direction:column;gap:6px}
.netbar.is-off{background:#FFF4DC;color:#5C4200}
.netbar .nb-off{display:flex;align-items:center;gap:7px}
.netbar .nb-dot{display:inline-block;width:8px;height:8px;border-radius:50%;background:#D99A00;flex:none}
.netbar .nb-row{display:flex;align-items:center;justify-content:space-between;gap:10px;font-weight:600}
.netbar button,.netbar a{border:0;border-radius:8px;padding:5px 11px;background:#14489F;color:#fff;font:inherit;font-size:12.5px;font-weight:600;text-decoration:none;cursor:pointer;white-space:nowrap}
.netbar.is-off>button{align-self:flex-start}
body.dark .off-lock .keypad button{color:var(--text)}
.netbar .nb-sub{font-size:12px;opacity:.85}
.netbar .nb-bad{color:#B42318}
.netbar .nb-item{display:flex;align-items:center;justify-content:space-between;gap:8px;font-size:12.5px;padding-top:4px;border-top:1px solid rgba(0,0,0,.06)}
.netbar .nb-item small{opacity:.75}
.netbar .nb-item button{background:transparent;color:#B42318;border:1px solid currentColor;padding:3px 9px}
body.dark .netbar{background:#1D2A40;color:#DCE6F7}
body.dark .netbar.is-off{background:#3A2F12;color:#F7E3B0}
.pend-box{border-bottom:2px dashed var(--line,#e3e6ee)}
.kh-row.pend{background:#FFFBEF}
body.dark .kh-row.pend{background:#2B2614}
.kh-row.pend.bad{background:#FDEEEE}
.src.wait{background:#FFF0C2;color:#6B4E00}
.kh-row.pend.bad .src.wait{background:#FAD4D4;color:#8A1C1C}
.pend-note{margin:6px 12px 8px}
.off-lock{position:fixed;inset:0;z-index:9999;background:var(--bg,#fff);display:flex;flex-direction:column;align-items:center;padding:40px 20px calc(20px + env(safe-area-inset-bottom));text-align:center;overflow:auto}

.off-lock h2{margin:14px 0 0;font-size:20px}
.off-lock .ol-msg{margin:6px 0 14px}
.off-lock .keypad span{display:block}
body.is-off-locked{overflow:hidden}

/* test version note (home) */
.test-note{position:relative;display:flex;gap:12px;align-items:flex-start;margin:0 0 12px;padding:14px 44px 14px 14px;border-radius:14px;background:#EEF3FB;border:1px solid #D5E1F5;color:#1B2B4A}
[dir=rtl] .test-note{padding:14px 14px 14px 44px}
.test-note[hidden]{display:none}
.test-note .tn-ic{flex:none;width:36px;height:36px;border-radius:10px;background:#14489F;color:#fff;display:flex;align-items:center;justify-content:center}
.test-note .tn-ic .ic{width:20px;height:20px}
.test-note .tn-txt b{display:block;font-size:15px}
.test-note .tn-txt p{margin:3px 0 10px;font-size:13px;line-height:1.55;color:#3A4A66}
.test-note .btn{background:#14489F}
.test-note .inst-x{position:absolute;top:8px;inset-inline-end:8px}
body.dark .test-note{background:#1B2638;border-color:#2A3A55;color:#E3EAF6}
body.dark .test-note .tn-txt p{color:#B8C4D8}

/* PIN keypad: fast tapping must not zoom the page (iPhone double tap) */
.keypad,.keypad button,.pin-boxes,.off-lock{touch-action:manipulation;-webkit-user-select:none;user-select:none;-webkit-tap-highlight-color:transparent}
button,a,.btn,label{touch-action:manipulation}
body.no-zoom,body.no-zoom .auth{touch-action:manipulation}

/* backup page */
.bk-hero{display:flex;align-items:center;gap:14px;background:var(--card);border:1px solid var(--line);border-radius:var(--r);padding:16px;margin-bottom:16px}
.bk-ic{flex:none;width:48px;height:48px;border-radius:14px;display:flex;align-items:center;justify-content:center;background:var(--green-bg);color:var(--green)}
.bk-ic .ic{width:26px;height:26px}
.bk-hero.is-old .bk-ic,.bk-hero.is-none .bk-ic{background:#FFF1DE;color:#B86E00}
.bk-ht{min-width:0;display:flex;flex-direction:column;gap:2px}
.bk-ht b{font-size:16px}
.bk-ht>span{color:var(--muted);font-size:13px;line-height:1.5}
.bk-note{margin:6px 6px 0;line-height:1.55}
.bk-sel{flex:none;width:auto;min-width:118px;height:40px;padding:0 10px;font-size:14px}
.bk-every .st small{white-space:normal}
.srow .btn-sm{flex:none}
.bk-up input[type=file]{padding:10px}
.bk-confirm h3{margin:0 0 10px}
.bk-dl{display:grid;grid-template-columns:auto 1fr;gap:6px 14px;margin:0 0 12px;font-size:14px}
.bk-dl dt{color:var(--muted)}
.bk-dl dd{margin:0;font-weight:600;text-align:end}
.bk-warn{background:var(--red-bg);color:var(--text);border-radius:12px;padding:10px 12px;font-size:13.5px;line-height:1.55;margin:0 0 12px}
.slist.mt{margin-top:8px}
.bk-file .st b{font-size:13.5px;font-weight:600}
.bk-help{margin-top:10px;font-size:14px}
.bk-help summary{cursor:pointer;font-weight:600}
.bk-help ol{margin:10px 0;padding-inline-start:20px;line-height:1.7}
.bk-code{display:block;background:var(--soft);border:1px solid var(--line);border-radius:10px;padding:10px;font-size:12.5px;word-break:break-all;margin:0 0 8px;user-select:all}
.bk-page .st b,.bk-page .st small{white-space:normal}

/* phones: no zoom when a field is tapped (iPhone zooms on text smaller than 16px) and no zoom on fast taps */
html{-webkit-text-size-adjust:100%;text-size-adjust:100%;touch-action:manipulation}
body,body *{touch-action:manipulation}
@media (pointer:coarse){
  input:not([type=checkbox]):not([type=radio]):not([type=range]):not([type=file]):not(.big):not(.otp-input),select,textarea{font-size:16px !important}
}

/* public share page (get.php) */
.get-page{background:var(--bg)}
.get{max-width:460px;margin:0 auto;padding:0 16px 30px}
.get-hero{text-align:center;color:#fff;margin:0 -16px 16px;padding:30px 22px 44px;background:radial-gradient(120% 90% at 80% 0%,#1F6BE6 0,#014FCB 45%,#0A2E78 100%);border-radius:0 0 28px 28px}
@media (min-width:492px){.get-hero{margin-top:16px;border-radius:28px}}
.get-logo{display:block;width:150px;height:auto;margin:0 auto 14px}
.get-hero h1{margin:0;font-size:27px;line-height:1.3;font-weight:800}
.get-hero p{margin:8px 0 12px;color:#D7E3FF;font-size:15px;line-height:1.55}
.get-free{display:inline-block;background:#FC850A;color:#fff;border-radius:999px;padding:4px 16px;font-weight:700;font-size:14px}
.get-card{background:var(--card);border-radius:var(--r);box-shadow:var(--shadow);padding:18px;margin-bottom:14px}
.get-hero+.get-card{margin-top:-34px;position:relative}
.get-card .install-card{margin:14px 0 0;border:1px solid var(--line);box-shadow:none}
.get-feat{list-style:none;margin:0 0 14px;padding:6px 16px;background:var(--card);border-radius:var(--r);box-shadow:var(--shadow)}
.get-feat li{display:flex;gap:12px;padding:12px 0;border-bottom:1px solid var(--line)}
.get-feat li:last-child{border-bottom:0}
.get-feat b{display:block;font-size:15px}
.get-feat span span,.get-feat div span{display:block;color:var(--muted);font-size:13px;line-height:1.5}
.get-share h2{margin:0 0 12px;font-size:18px;text-align:center}
.get-qr{width:170px;height:170px;margin:0 auto 6px}
.get-qr svg{width:100%;height:100%;display:block}
.get-share .btn .ic{width:18px;height:18px}
.get-two{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-top:10px}
.get-two .btn{display:flex;align-items:center;justify-content:center;gap:6px}

[data-secret]{-webkit-user-select:none;user-select:none;cursor:default}
.ver-tap{display:inline-block;padding:8px 14px}
