/* Kasir Zela Dashboard UI v5.5 — presentation-only override */
:root{
  --red:#5B9EA4;--red2:#39757B;--redl:#E3F2F1;--redm:#BFDDDB;
  --orange:#F59E0B;--green:#138A62;--greenl:#E8F7F1;
  --blue:#5599A1;--bluel:#E2F1F1;
  --t1:#17201D;--t2:#59645F;--t3:#89938F;
  --bg:#EAF4F3;--card:#FFFFFF;--border:#D8E6E4;--border-soft:#E8F0EF;
  --font:'Inter','Segoe UI',system-ui,-apple-system,sans-serif;
  --mono:'JetBrains Mono','Roboto Mono',Consolas,monospace;
  --sw:264px;--th:68px;
  --shadow-sm:0 1px 2px rgba(20,35,29,.04),0 4px 14px rgba(20,35,29,.04);
  --shadow-md:0 12px 32px rgba(20,35,29,.09);
  --ring:0 0 0 4px rgba(91,158,164,.16);
}
html{scroll-behavior:smooth}
body{
  background:
    radial-gradient(circle at 100% 0,rgba(91,158,164,.22),transparent 34rem),
    radial-gradient(circle at 20% 100%,rgba(117,181,176,.16),transparent 36rem),#CFE3E1;
  color:var(--t1);font-family:var(--font);font-size:14px;line-height:1.5;
  -webkit-font-smoothing:antialiased;
}
button,input,select,textarea{font-family:inherit}
button:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible{outline:none;box-shadow:var(--ring)}

/* Navigation */
.sb{
  background:rgba(255,255,255,.94);border-right:1px solid rgba(218,226,222,.9);
  box-shadow:8px 0 30px rgba(25,42,34,.035);backdrop-filter:blur(18px);
}
.sb-head{height:72px;padding:0 18px;background:transparent;border:0}
.sb-logo{width:38px;height:38px;border-radius:13px;background:#DCEDEC;box-shadow:inset 0 0 0 1px #CBE1DF}
.sb-brand{font-size:15px;letter-spacing:-.2px;color:var(--t1)}.sb-ver{opacity:.85;letter-spacing:.4px;color:#5B9EA4}
.sb-user{padding:16px;border-color:var(--border-soft)}
.sb-av{width:40px;height:40px;border-radius:13px;background:linear-gradient(135deg,#78B5B8,#4B8A91);box-shadow:0 5px 13px rgba(63,119,125,.2)}
.sb-uname{font-size:13.5px}.sb-urole{margin-top:1px}
.sb-bal{margin-top:12px;padding:11px 12px;border-radius:13px;background:linear-gradient(135deg,#E6F4F3,#D8ECEA);border:1px solid #C7E0DE;box-shadow:none}
.sb-bal:hover{border-color:#78AFB2;transform:translateY(-1px)}
.sb-sec{padding:18px 18px 7px;font-size:9.5px;color:#9AA39F;letter-spacing:1.35px}
.sb-item{min-height:40px;margin:2px 10px;padding:9px 12px;border-radius:11px;color:#5B6561;gap:11px;transition:background .16s,color .16s,transform .16s}
.sb-item:hover{background:#F1F5F3;color:#1D2924;transform:translateX(2px)}
.sb-item.on{background:linear-gradient(90deg,#DDEDEC,#EAF5F4);color:#39757B;box-shadow:inset 3px 0 #5B9EA4;font-weight:700}
.sb-ico{width:22px;font-size:17px;filter:saturate(.85)}
.sb-foot{padding:12px 10px;border-color:var(--border-soft);background:linear-gradient(0deg,#fff,rgba(255,255,255,.7))}
.sb-logout{border-radius:11px;min-height:40px}

/* Workspace */
.main{background:#EFF6F5}
.topbar{
  height:var(--th);padding:0 clamp(16px,2.4vw,32px);gap:10px;
  background:rgba(250,253,252,.9);border-bottom:1px solid rgba(207,224,221,.9);
  backdrop-filter:blur(16px);box-shadow:0 1px 0 rgba(255,255,255,.7);
}
.tb-title{font-size:18px;font-weight:750;letter-spacing:-.45px}
.tb-badge{padding:5px 10px;border:0;font-size:10px;letter-spacing:.15px}
.tb-online{background:#E8F7F1;color:#087854}.tb-branch{background:#E0F0EF;color:#39757B}
.live-dot{width:7px;height:7px;box-shadow:0 0 0 4px rgba(19,138,98,.11)}
.menu-toggle,.theme-toggle{
  width:38px;height:38px;border:1px solid var(--border);border-radius:11px;background:rgba(255,255,255,.8);
  color:var(--t2);display:inline-flex;align-items:center;justify-content:center;cursor:pointer;transition:.16s;
}
.menu-toggle:hover,.theme-toggle:hover{background:var(--redl);border-color:var(--redm);color:var(--red);transform:translateY(-1px)}
.content{width:100%;max-width:1680px;margin:0 auto;padding:clamp(18px,2.5vw,34px)}
.page.on{animation:pageIn .24s ease both}
@keyframes pageIn{from{opacity:0;transform:translateY(7px)}to{opacity:1;transform:none}}

/* Surfaces */
.card,.sc,.zstat-card{
  border:1px solid rgba(224,231,227,.9);border-radius:18px;background:rgba(255,255,255,.96);
  box-shadow:var(--shadow-sm);transition:border-color .18s,box-shadow .18s,transform .18s;
}
.card{padding:18px 20px;margin-bottom:18px}
.card:hover,.zstat-card:hover{border-color:#D8E0DC;box-shadow:0 10px 28px rgba(20,35,29,.07)}
.card-hd{margin-bottom:16px}.card-t{font-size:14px;font-weight:750;letter-spacing:-.2px}.card-a{color:var(--red);font-weight:650}
.sg{gap:16px;margin-bottom:18px}
.sc{min-height:112px;padding:18px 19px;overflow:hidden}
.sc::before{display:none}
.sc::after{width:92px;height:92px;top:-38px;right:-28px;opacity:.045}
.sc-ico{top:16px;right:17px;font-size:23px;opacity:.65}
.sc-lbl{font-size:10px;color:#84908B;letter-spacing:.65px;margin-bottom:8px}
.sc-val{font-family:var(--font);font-size:25px;font-weight:780;letter-spacing:-.8px}
.sc-chg{margin-top:7px}
.bal-card{border-radius:20px;padding:24px 26px;background:linear-gradient(135deg,#75B7BA 0%,#57979D 52%,#39757B 100%);box-shadow:0 14px 35px rgba(63,119,125,.22)}

/* Data tables */
.tw,.card[style*="overflow"]{border-radius:16px}
table{border-spacing:0}
table th,.tbl th{position:sticky;top:0;z-index:2;background:#F7F9F8;color:#7E8984;font-size:10px;letter-spacing:.62px;padding:11px 13px;border-bottom:1px solid #E3E9E6}
table td,.tbl td{padding:12px 13px;border-bottom:1px solid #EDF1EF;color:#4F5C56}
table tbody tr{transition:background .12s}
table tbody tr:hover td,.tbl tbody tr:hover td{background:#FAFCFB}

/* Unified table treatment: standard, WA logs, AI insights, and generated tables */
.content table{
  width:100%;border-collapse:separate!important;border-spacing:0!important;
  background:var(--card);border:1px solid var(--border);border-radius:14px;overflow:hidden;
}
.content table th,.content table thead td{
  padding:11px 13px!important;background:#F7F9F8!important;color:#74807A!important;
  border-bottom:1px solid #DEE6E2!important;font-size:10px!important;font-weight:750!important;
  letter-spacing:.58px;text-transform:uppercase;white-space:nowrap;
}
.content table tbody td{
  padding:12px 13px!important;border-bottom:1px solid var(--border-soft)!important;
  background:transparent;vertical-align:middle;
}
.content table tbody tr:last-child td{border-bottom:0!important}
.content table tbody tr:hover td{background:#F8FBF9!important}
.content .rk-table,.content .ai-mini-table{font-size:12.5px}
.content .rk-table td.num,.content .ai-mini-table td:last-child{font-variant-numeric:tabular-nums}
.content div[style*="overflow-x:auto"]{border-radius:14px;scrollbar-width:thin;scrollbar-color:#C8D2CD transparent}

/* Controls */
.btn,.btn-red,.btn-outline,.g-btn{border-radius:11px!important;font-weight:650!important;min-height:38px;transition:transform .15s,box-shadow .15s,background .15s!important}
.btn:hover,.btn-red:hover,.btn-outline:hover,.g-btn:hover{transform:translateY(-1px)}
.btn-r,.btn-red{background:linear-gradient(135deg,#69AAB0,#438087)!important;box-shadow:0 5px 13px rgba(63,119,125,.18)!important}
.btn-r:hover,.btn-red:hover{box-shadow:0 8px 18px rgba(63,119,125,.25)!important}
.fi,.fs,input:not([type="checkbox"]):not([type="radio"]),select,textarea{
  border:1px solid #DDE5E1;border-radius:11px;background:#FBFCFC;color:var(--t1);transition:border .15s,box-shadow .15s,background .15s;
}
.fi:focus,.fs:focus,input:focus,select:focus,textarea:focus{border-color:#EA865F;background:#fff;box-shadow:var(--ring)}
.b,.zbadge{padding:4px 10px;border:0;font-weight:650}
.modal,.g-modal,.topup-modal{border:1px solid rgba(255,255,255,.75);border-radius:22px!important;box-shadow:0 28px 80px rgba(24,37,31,.22)!important}
.mbg,.g-modal-bg,.topup-modal-overlay{backdrop-filter:blur(8px)}
.toast{top:18px;border-radius:13px;box-shadow:var(--shadow-md)}

/* Theme */
html[data-theme="dark"]{
  --bg:#101613;--card:#18201C;--border:#2A3530;--border-soft:#242E29;
  --t1:#EFF5F1;--t2:#B0BDB6;--t3:#7F8E87;--redl:#183437;--redm:#28535A;
  --greenl:#123328;--bluel:#182B4A;--shadow-sm:0 1px 2px rgba(0,0,0,.2),0 8px 22px rgba(0,0,0,.12);
}
html[data-theme="dark"] body{background:radial-gradient(circle at 90% 0,rgba(91,158,164,.14),transparent 30rem),#101817;color:var(--t1)}
html[data-theme="dark"] .sb,html[data-theme="dark"] .topbar{background:rgba(24,32,28,.94);border-color:#2A3530}
html[data-theme="dark"] .card,html[data-theme="dark"] .sc,html[data-theme="dark"] .zstat-card{background:#18201C;border-color:#2A3530}
html[data-theme="dark"] .sb-item:hover,html[data-theme="dark"] table tbody tr:hover td{background:#202A25}
html[data-theme="dark"] .sb-item.on{background:linear-gradient(90deg,#183437,#1B2D2E);color:#9ED2D3}
html[data-theme="dark"] .sb-bal{background:linear-gradient(135deg,#1B3435,#192C2D);border-color:#315456}
html[data-theme="dark"] table th,html[data-theme="dark"] .tbl th{background:#202823;color:#93A099;border-color:#303A35}
html[data-theme="dark"] table td,html[data-theme="dark"] .tbl td{color:#B8C3BD;border-color:#27312C}
html[data-theme="dark"] .content table{background:#18201C;border-color:#303B35}
html[data-theme="dark"] .content table th,html[data-theme="dark"] .content table thead td{background:#202923!important;color:#AAB6B0!important;border-color:#344039!important}
html[data-theme="dark"] .content table tbody td{border-color:#29332E!important}
html[data-theme="dark"] .content table tbody tr:hover td{background:#222C27!important}
html[data-theme="dark"] .fi,html[data-theme="dark"] .fs,html[data-theme="dark"] input,html[data-theme="dark"] select,html[data-theme="dark"] textarea{background:#141B18;border-color:#344039;color:#EDF3EF}
html[data-theme="dark"] .menu-toggle,html[data-theme="dark"] .theme-toggle{background:#202923;border-color:#344039;color:#CAD4CE}

/* Rounded application shell inspired by the supplied dashboard reference */
@media(min-width:761px){
  .sb{left:14px;top:14px;height:calc(100vh - 28px);border-radius:22px 0 0 22px}
  .main{margin:14px 14px 14px calc(var(--sw) + 14px);min-height:calc(100vh - 28px);border-radius:0 22px 22px 0;overflow:clip;box-shadow:0 18px 55px rgba(52,101,102,.12)}
  .topbar{height:72px}
}
.br,.sb-bal.locked{background:#FFF0F0!important;border-color:#F2C9C9!important;color:#C43D3D!important}
.sc-chg.dn{color:#C43D3D!important}
.sb-logout{color:#A65252}

/* Responsive */
@media(max-width:1100px){.content{padding:20px}.g4{grid-template-columns:repeat(2,minmax(0,1fr))}.g21{grid-template-columns:1fr}}
@media(max-width:760px){
  :root{--th:62px}.content{padding:14px}.topbar{padding:0 13px}.tb-title{font-size:16px}.tb-branch{display:none!important}
  .card{padding:15px;border-radius:15px}.sg{gap:10px}.g4,.g3,.g2,.g11,.fr2,.fr3{grid-template-columns:1fr!important}
  .sc{min-height:96px;padding:15px}.sc-val{font-size:22px}.modal,.g-modal,.topup-modal{width:calc(100% - 20px)!important;padding:20px!important;border-radius:18px!important}
  table th,table td,.tbl th,.tbl td{padding:10px;font-size:11.5px}.tb-badge{display:none}.live-dot{margin-left:auto}
}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{scroll-behavior:auto!important;animation-duration:.01ms!important;transition-duration:.01ms!important}}

/* ══════════════════════════════════════════════════════════════════════
   KasirZela Premium SaaS UI v5.7
   Styling only: no layout nodes, handlers, state, routes, or data hooks.
   ══════════════════════════════════════════════════════════════════════ */
:root{
  --kz-primary:#57979D;--kz-primary-strong:#356F76;--kz-primary-soft:#DCEFED;
  --kz-bg:#EDF6F5;--kz-surface:#FFFFFF;--kz-surface-soft:#F6FAF9;
  --kz-text:#182523;--kz-muted:#687773;--kz-line:#D8E6E3;
  --kz-success:#16865E;--kz-warning:#D78A13;--kz-danger:#D64B4B;
  --kz-radius:16px;--kz-shadow:0 1px 2px rgba(28,56,53,.025),0 8px 24px rgba(28,56,53,.045);
}
body{letter-spacing:-.005em}
*{scrollbar-width:thin;scrollbar-color:#B8CECB transparent}
*::-webkit-scrollbar{width:7px;height:7px}*::-webkit-scrollbar-thumb{background:#B8CECB;border-radius:99px;border:2px solid transparent;background-clip:padding-box}

/* Sidebar and navigation */
.sb{background:rgba(250,253,252,.96);border-color:#CEE0DD;box-shadow:0 20px 55px rgba(44,88,85,.1)}
.sb-head{padding-inline:20px}.sb-logo{color:#356F76}.sb-user{padding:14px 16px 16px}
.sb-uname{font-size:13px;font-weight:760}.sb-urole{font-size:10.5px;color:#80908C}
.sb-bal{padding:12px 13px}.sb-bal-lbl{font-weight:750;letter-spacing:.75px}.sb-bal-amt{font-family:var(--font);font-size:17px;letter-spacing:-.35px;color:#2F686E}
.sb-sec{padding:18px 20px 6px;color:#91A09C;font-weight:750}
.sb-item{min-height:42px;margin:2px 11px;padding:10px 12px;border-radius:12px;font-weight:560}
.sb-item:hover{background:#EAF3F2;color:#315E61;transform:none}.sb-item.on{box-shadow:none;background:#DDEDEC;color:#2E686E}
.sb-item.on::before{display:none}.sb-ico{font-size:16px;opacity:.9}.sb-badge{background:#57979D}
.sb-foot{background:transparent;padding:12px}.sb-logout:hover{background:#FBECEC}

/* Compact header */
.topbar{padding-inline:clamp(17px,2.2vw,30px);box-shadow:none}.tb-title{font-size:17px;font-weight:760;letter-spacing:-.35px}
.tb-badge{font-family:var(--font);font-size:10px;font-weight:750}.theme-toggle,.menu-toggle{border-color:#D4E3E0;background:#F8FBFA}

/* Page hierarchy */
.content{padding:clamp(18px,2.3vw,32px)}
.page>h1,.page>h2,.page>div>h2{letter-spacing:-.55px!important;color:var(--kz-text)!important}
.card-t{font-size:14px;font-weight:760}.card-a{color:var(--kz-primary-strong)}
.sub,.sc-chg,.lp-sum-lbl,.rk-sum-lbl{color:var(--kz-muted)}

/* Premium cards and KPIs */
.card,.sc,.zstat-card,.lp-sum-card,.rk-sum-card,.ai-sum-card,.ai-mini-card,.g-stat,.pr-sc,.bb-card{
  border:1px solid rgba(210,226,222,.94)!important;border-radius:var(--kz-radius)!important;
  background:rgba(255,255,255,.98)!important;box-shadow:var(--kz-shadow)!important;
}
.card{padding:20px 21px}.card-hd{margin-bottom:17px}
.sg{gap:15px}.sc{min-height:124px;padding:18px 19px}.sc:hover{transform:translateY(-2px);box-shadow:0 14px 30px rgba(35,72,68,.075)!important}
.sc-ico{top:16px;right:17px;width:35px;height:35px;display:grid;place-items:center;border-radius:11px;background:#E4F2F1;opacity:1;font-size:17px}
.sc-lbl{max-width:calc(100% - 42px);font-size:10.5px;color:#72817D;letter-spacing:.7px}
.sc-val{font-family:var(--font);font-size:25px;font-weight:790;color:var(--kz-text);letter-spacing:-.85px;line-height:1.15}
.sc-chg{margin-top:8px}.sc-chg.up{color:var(--kz-success)}.sc-chg.dn{color:var(--kz-danger)!important}
.sc-r .sc-ico,.sc-b .sc-ico{background:#E1F0EF}.sc-g .sc-ico{background:#E4F4ED}.sc-o .sc-ico{background:#FFF2DE}
.bal-card{border:0!important;color:#fff!important}.bal-card *{color:inherit}

/* Charts keep their existing datasets and calculations */
.card canvas{max-width:100%}.chart-wrap,.chart-container,[class*="chart-box"]{border-radius:14px;background:var(--kz-surface-soft)}

/* Tables */
.tw,.table-wrap,.content div[style*="overflow-x:auto"]{border:1px solid var(--kz-line);border-radius:14px;background:#fff;overflow:auto}
.content .tw table,.content .table-wrap table,.content div[style*="overflow-x:auto"] table{border:0;border-radius:0}
.content table th,.content table thead td{height:42px;background:#F2F7F6!important;color:#6E7E79!important;font-size:10.5px!important;letter-spacing:.62px}
.content table tbody td{height:45px;color:#465753}.content table tbody tr:nth-child(even) td{background:#FBFDFC}
.content table tbody tr:hover td{background:#EAF4F3!important}.content table .num{text-align:right;font-variant-numeric:tabular-nums}

/* Forms and filters */
.fg,.fg2,.g-field{gap:6px}.fl,.fg label,.fg2 label,.g-field label{font-size:11px!important;font-weight:720!important;color:#657570!important;letter-spacing:.35px}
.fi,.fs,.inp-sm,.pr-inp,input:not([type="checkbox"]):not([type="radio"]),select,textarea{
  min-height:40px;border:1px solid #CFDEDB!important;border-radius:11px!important;background:#FBFDFC!important;
  color:var(--kz-text)!important;padding-inline:12px;box-shadow:none!important;
}
.fi:hover,.fs:hover,input:hover,select:hover,textarea:hover{border-color:#AFC8C4!important}
.fi:focus,.fs:focus,input:focus,select:focus,textarea:focus{border-color:#57979D!important;background:#fff!important;box-shadow:0 0 0 4px rgba(87,151,157,.13)!important}
input::placeholder,textarea::placeholder{color:#9BA9A5}.fr,.fr2,.fr3{gap:13px}

/* Buttons, tabs, filters, status */
.btn,.btn-red,.btn-outline,.g-btn,.pr-btn,.pr-action-btn{border-radius:11px!important;min-height:39px;font-weight:700!important;letter-spacing:-.05px}
.btn-r,.btn-red,.g-btn.save,.pr-btn.save{background:linear-gradient(135deg,#68A8AD,#3D7A81)!important;color:#fff!important;border-color:transparent!important}
.btn-out,.btn-outline,.g-btn.cancel,.pr-btn.cancel{background:#fff!important;border:1px solid #D4E2DF!important;color:#52635F!important}
.btn-out:hover,.btn-outline:hover{background:#F0F6F5!important;border-color:#ACC7C3!important}
.btn-o{background:#D78A13}.btn-g{background:#16865E}.btn:disabled{filter:saturate(.25);opacity:.58}
.tab-btn,.lap-tab,.lp-tab,.sm-tab,.bb-tab,.ai-period-btn{border-radius:10px!important;transition:background .16s,color .16s,border .16s!important}
.tab-btn.on,.lap-tab.on,.lp-tab.on,.sm-tab.active,.bb-tab.active,.ai-period-btn.active{background:#DDEDEC!important;color:#356F76!important;border-color:#8DB9B7!important;box-shadow:none!important}
.b,.zbadge,.lp-badge,.s-badge{border-radius:99px!important;font-weight:720!important}
.bg{background:#E5F5ED;color:#147855;border-color:#C4E8D6}.bo{background:#FFF4E1;color:#A96A0B;border-color:#F0D6A9}.br{background:#FDECEC!important;color:#C33F3F!important;border-color:#F3C6C6!important}.bb{background:#E2F1F1;color:#39757B;border-color:#BFDDDB}

/* Modals, overlays, toasts and states */
.modal,.g-modal,.topup-modal{border-radius:18px!important;border:1px solid rgba(210,226,222,.95)!important;background:#fff!important;padding:22px!important;box-shadow:0 30px 90px rgba(24,49,46,.24)!important}
.mhd,.g-modal-header{padding-bottom:14px;margin-bottom:16px;border-bottom:1px solid #E7EFED}.mtitle{font-size:18px;font-weight:780;letter-spacing:-.35px}
.mbg,.g-modal-bg,.topup-modal-overlay{background:rgba(21,43,41,.42)!important;backdrop-filter:blur(7px)}
.toast{border:1px solid rgba(255,255,255,.25);font-weight:680}.alert{border-radius:12px!important;border-width:1px!important}
.empty{padding:38px 20px!important;color:#7C8D88!important}.empty-ico{opacity:.68;filter:saturate(.65)}
.spinner{border-color:#D6E5E2!important;border-top-color:#57979D!important}

/* Existing feature modules */
#pg-stok_menu .sm-stat,#pg-bahan_baku .bb-card{border-color:#D4E5E1!important;border-radius:16px!important;background:#fff!important;box-shadow:var(--kz-shadow)!important}
#pg-stok_menu .br-btn{border-color:#D0E0DD!important;border-radius:10px!important;background:#fff!important;color:#53635F!important}
#pg-stok_menu .br-btn.active{background:#57979D!important;color:#fff!important;border-color:#57979D!important}
#pg-bahan_baku>div[style*="background:#E8F5E9"]{background:#E2F1EF!important;color:#356F76!important;border:1px solid #C5DEDB;border-radius:12px!important}
#bb-panel-linked .lk-menu-list,#bb-panel-linked .lk-checklist,#bb-panel-linked .lk-active{border-color:#D5E3E0!important;border-radius:14px!important;background:#fff!important}
.fin-row,.fin-input-row,.bi-msg,.rk-cab-stat,.lp-cab-stat{border-radius:13px!important;border-color:#D8E6E3!important}

/* Dark mode: premium navy-teal version of the same UI */
html[data-theme="dark"]{
  --kz-bg:#091726;--kz-surface:#0F2133;--kz-surface-soft:#12283C;--kz-text:#F0F7FA;--kz-muted:#94A9B8;--kz-line:#233D52;
  --bg:#091726;--card:#0F2133;--border:#233D52;--border-soft:#1D3447;--t1:#F0F7FA;--t2:#BAC8D2;--t3:#8196A5;
}
html[data-theme="dark"] body{background:radial-gradient(circle at 82% 4%,rgba(61,122,129,.22),transparent 32rem),#071321}
html[data-theme="dark"] .main{background:#091726}html[data-theme="dark"] .sb,html[data-theme="dark"] .topbar{background:rgba(10,26,42,.96);border-color:#213B50}
html[data-theme="dark"] .card,html[data-theme="dark"] .sc,html[data-theme="dark"] .zstat-card,html[data-theme="dark"] .lp-sum-card,html[data-theme="dark"] .rk-sum-card,html[data-theme="dark"] .ai-sum-card,html[data-theme="dark"] .ai-mini-card,html[data-theme="dark"] .g-stat,html[data-theme="dark"] .pr-sc,html[data-theme="dark"] #pg-stok_menu .sm-stat,html[data-theme="dark"] #pg-bahan_baku .bb-card{background:#0F2133!important;border-color:#253F54!important;box-shadow:0 12px 30px rgba(0,0,0,.14)!important}
html[data-theme="dark"] .sc-val,html[data-theme="dark"] .card-t,html[data-theme="dark"] .page>h1,html[data-theme="dark"] .page>h2,html[data-theme="dark"] .page>div>h2{color:#F1F7FA!important}
html[data-theme="dark"] .sc-ico{background:#17364A}html[data-theme="dark"] .sb-item:hover{background:#132D40;color:#D8E8ED}html[data-theme="dark"] .sb-item.on{background:#17384A;color:#A7DBD9}
html[data-theme="dark"] .tw,html[data-theme="dark"] .table-wrap,html[data-theme="dark"] .content div[style*="overflow-x:auto"]{background:#0F2133;border-color:#263F53}
html[data-theme="dark"] .content table{background:#0F2133;border-color:#263F53}html[data-theme="dark"] .content table th,html[data-theme="dark"] .content table thead td{background:#142A3D!important;color:#9DB0BD!important;border-color:#294358!important}
html[data-theme="dark"] .content table tbody td{color:#C5D2DA!important;border-color:#1D3548!important}html[data-theme="dark"] .content table tbody tr:nth-child(even) td{background:#102538}html[data-theme="dark"] .content table tbody tr:hover td{background:#18344A!important}
html[data-theme="dark"] .fi,html[data-theme="dark"] .fs,html[data-theme="dark"] .inp-sm,html[data-theme="dark"] .pr-inp,html[data-theme="dark"] input,html[data-theme="dark"] select,html[data-theme="dark"] textarea{background:#0B1C2C!important;border-color:#294459!important;color:#EAF3F7!important}
html[data-theme="dark"] .modal,html[data-theme="dark"] .g-modal,html[data-theme="dark"] .topup-modal{background:#0F2133!important;border-color:#2A465C!important}

@media(max-width:1100px){.sg{gap:12px}.sc{min-height:112px}.card{padding:18px}}
@media(max-width:760px){
  .sb{border-radius:0}.main{border-radius:0}.content{padding:14px}.topbar{height:62px}.tb-title{font-size:15px}
  .card,.sc{border-radius:14px!important}.card{padding:16px}.sc{min-height:100px}.sc-val{font-size:22px}
  .content table{min-width:620px}.modal,.g-modal,.topup-modal{padding:18px!important}
}

/* Login and registration — same design language, original handlers preserved */
.kz-auth-login,.kz-auth-register{background:radial-gradient(circle at 12% 10%,rgba(120,184,183,.28),transparent 30rem),#D6EAE8!important;color:var(--kz-text)}
.kz-auth-login .left{background:linear-gradient(145deg,#173B43,#285E63 58%,#397A7D)!important}
.kz-auth-login .logo-mark{background:linear-gradient(135deg,#8FC7C7,#57979D)!important;box-shadow:0 10px 24px rgba(17,50,54,.2)}
.kz-auth-login .right{background:rgba(244,250,249,.92)!important}
.kz-auth-login .form-box,.kz-auth-register .box{background:rgba(255,255,255,.97);border:1px solid rgba(202,222,218,.95);border-radius:22px;padding:clamp(24px,4vw,42px);box-shadow:0 25px 70px rgba(48,94,90,.14)}
.kz-auth-login .input,.kz-auth-register input{border:1px solid #C9DDDA!important;border-radius:12px!important;background:#F9FCFB!important;min-height:46px;color:#182523!important}
.kz-auth-login .input:focus,.kz-auth-register input:focus{border-color:#57979D!important;box-shadow:0 0 0 4px rgba(87,151,157,.14)!important}
.kz-auth-login .btn-login,.kz-auth-register .btn{border-radius:12px!important;background:linear-gradient(135deg,#68A8AD,#3D7A81)!important;box-shadow:0 10px 22px rgba(61,122,129,.2)!important}
.kz-auth-register .gold-line{background:linear-gradient(90deg,#8FC7C7,#57979D,#356F76)!important}.kz-auth-register .eyebrow,.kz-auth-register a{color:#39757B!important}
.kz-auth-login .support{background:#57979D!important;box-shadow:0 10px 24px rgba(61,122,129,.22)!important}

/* WA Bot Console */
.kz-wa-admin{background:#EDF6F5!important;color:var(--kz-text)!important}
.kz-wa-admin .topbar{background:rgba(250,253,252,.94)!important;border-color:#D7E5E2!important;box-shadow:none!important}
.kz-wa-admin .brand-mark{background:linear-gradient(135deg,#75B7BA,#438087)!important}
.kz-wa-admin .tenant,.kz-wa-admin .gate-card{background:#fff!important;border:1px solid #D6E5E2!important;border-radius:16px!important;box-shadow:var(--kz-shadow)!important}
.kz-wa-admin .tenant:hover{border-color:#AFCBC7!important;box-shadow:0 14px 34px rgba(35,72,68,.08)!important}
.kz-wa-admin .btn-isi,.kz-wa-admin .chip:not(.bahaya){background:#E0EFEE!important;color:#356F76!important;border-color:#BBD9D6!important}
.kz-wa-admin .btn-isi:hover,.kz-wa-admin .chip:not(.bahaya):hover{background:#57979D!important;color:#fff!important}
.kz-wa-admin .detail,.kz-wa-admin .kupon{background:#F5F9F8!important;border-color:#D9E7E4!important;border-radius:13px!important}
.kz-wa-admin input,.kz-wa-admin select{background:#FBFDFC!important;border:1px solid #CDDEDB!important;border-radius:11px!important}
.kz-wa-admin .modal{border-radius:18px!important;background:#fff!important}

@media(max-width:760px){
  .kz-auth-login .form-box,.kz-auth-register .box{border-radius:18px;padding:24px 20px;box-shadow:0 16px 45px rgba(48,94,90,.12)}
  .kz-wa-admin .topbar{padding-inline:14px!important}.kz-wa-admin .tenant{border-radius:14px!important}
}

/* ══════════════════════════════════════════════════════════════════════
   Dark Fintech Theme v5.8 — default visual requested by the user
   ══════════════════════════════════════════════════════════════════════ */
html[data-theme="dark"]{
  color-scheme:dark;
  --red:#3B82F6;--red2:#2563EB;--redl:#102B53;--redm:#1E4C81;
  --blue:#22D3EE;--bluel:#0D3444;--green:#20C982;--greenl:#0D332A;
  --orange:#F59E0B;--bg:#071225;--card:#0D1C32;--border:#203854;--border-soft:#182E47;
  --t1:#F8FAFC;--t2:#C2CDDB;--t3:#8295AC;
  --kz-primary:#3B82F6;--kz-primary-strong:#60A5FA;--kz-primary-soft:#102B53;
  --kz-bg:#071225;--kz-surface:#0D1C32;--kz-surface-soft:#0B192D;
  --kz-text:#F8FAFC;--kz-muted:#94A3B8;--kz-line:rgba(148,163,184,.16);
  --ring:0 0 0 4px rgba(59,130,246,.2);
}
html[data-theme="dark"] body{
  background:
    radial-gradient(circle at 78% -8%,rgba(37,99,235,.28),transparent 36rem),
    radial-gradient(circle at 4% 92%,rgba(79,70,229,.2),transparent 34rem),
    linear-gradient(145deg,#06101F,#08162B 50%,#071225)!important;
  color:#F8FAFC;
}
html[data-theme="dark"] .sb{
  background:linear-gradient(180deg,rgba(8,25,45,.98),rgba(6,20,37,.98))!important;
  border-color:rgba(125,169,219,.15)!important;box-shadow:18px 0 55px rgba(1,8,20,.24)!important;
}
html[data-theme="dark"] .sb-head{background:transparent!important}
html[data-theme="dark"] .sb-logo{background:linear-gradient(135deg,#2563EB,#4F46E5)!important;color:#fff;box-shadow:0 8px 22px rgba(37,99,235,.32)}
html[data-theme="dark"] .sb-brand{color:#F8FAFC}html[data-theme="dark"] .sb-ver{color:#6EA8FF}

/* Official Kasir Zela identity */
.sb-logo.sb-logo-image{
  width:48px;
  height:48px;
  padding:0;
  overflow:hidden;
  flex:0 0 48px;
  background:transparent!important;
  border:0;
  border-radius:0;
  box-shadow:none!important;
}
.sb-logo.sb-logo-image img{display:block;width:100%;height:100%;object-fit:contain}
html[data-theme="dark"] .sb-logo.sb-logo-image{background:transparent!important}
.kz-mobile-brand-logo{display:none;width:36px;height:36px;object-fit:contain;padding:0;background:transparent;border:0;border-radius:0;box-shadow:none}
@media(max-width:900px){.kz-mobile-brand-logo{display:block}}

/* v5.14 — Motion and payment experience */
@keyframes kzSoftReveal{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}
@keyframes kzLegendReveal{from{opacity:0;transform:translateX(8px)}to{opacity:1;transform:translateX(0)}}
@keyframes kzLivePulse{0%,100%{opacity:1;box-shadow:0 0 0 0 rgba(52,211,153,.28)}50%{opacity:.78;box-shadow:0 0 0 5px rgba(52,211,153,0)}}

.page.on>.sg,.page.on>.card,.page.on>div:not(.modal){animation:kzSoftReveal .42s cubic-bezier(.22,.8,.32,1) both}
.page.on>.sg:nth-child(2),.page.on>.card:nth-child(2),.page.on>div:nth-child(2){animation-delay:.045s}
.page.on>.sg:nth-child(3),.page.on>.card:nth-child(3),.page.on>div:nth-child(3){animation-delay:.09s}
.card,.sc,.quick,.sb-item,.btn,.btn-red,.theme-toggle{transition:transform .22s ease,border-color .22s ease,background-color .22s ease,box-shadow .22s ease,color .22s ease}
.card:hover{border-color:rgba(96,165,250,.2);box-shadow:0 18px 42px rgba(0,5,20,.2)}
.sc:hover{transform:translateY(-2px);border-color:rgba(96,165,250,.2);box-shadow:0 15px 35px rgba(0,5,20,.18)}
.btn:hover,.btn-red:hover,.quick:hover{transform:translateY(-1px)}
.sb-item:active,.btn:active,.btn-red:active,.quick:active{transform:scale(.985)}

.kz-card-subtitle{display:block;margin-top:5px;color:#8295AC;font-size:10.5px;font-weight:500}
.kz-live-badge{display:inline-flex;align-items:center;gap:7px;padding:6px 9px;border:1px solid rgba(52,211,153,.16);border-radius:999px;background:rgba(52,211,153,.07);color:#6EE7B7;font-size:9px;font-weight:750;letter-spacing:.08em;text-transform:uppercase}
.kz-live-badge i{width:6px;height:6px;border-radius:50%;background:#34D399;animation:kzLivePulse 1.8s ease-in-out infinite}
.kz-payment-card{overflow:hidden}
.kz-payment-layout{display:grid;grid-template-columns:minmax(150px,.92fr) minmax(145px,1.08fr);align-items:center;gap:12px;min-height:252px;padding-top:5px}
.kz-payment-chart-wrap{position:relative;height:218px!important;min-width:0;padding:7px!important}
.kz-payment-chart-wrap::before{content:'';position:absolute;inset:26%;border-radius:50%;background:rgba(59,130,246,.14);filter:blur(24px);pointer-events:none}
.kz-payment-chart-wrap canvas{position:relative;z-index:1;transition:filter .25s ease}
.kz-payment-card:hover .kz-payment-chart-wrap canvas{filter:drop-shadow(0 9px 18px rgba(59,130,246,.16))}
.kz-donut-center{position:absolute;z-index:2;left:50%;top:50%;transform:translate(-50%,-50%);width:90px;text-align:center;pointer-events:none}
.kz-donut-center span{display:block;margin-bottom:4px;color:#8295AC;font-size:9px;font-weight:650;letter-spacing:.08em;text-transform:uppercase}
.kz-donut-center strong{display:block;color:#F8FAFC;font-size:16px;font-weight:800;letter-spacing:-.45px;white-space:nowrap}
.kz-pay-empty{position:absolute;z-index:3;inset:0;display:none;align-items:flex-end;justify-content:center;padding-bottom:4px;color:#8295AC;font-size:10px;pointer-events:none}.kz-pay-empty.on{display:flex}
.kz-pay-legend{display:grid;gap:8px;min-width:0}
.kz-pay-item{position:relative;display:grid;grid-template-columns:34px minmax(0,1fr) auto;grid-template-rows:auto auto;align-items:center;gap:3px 9px;padding:10px;border:1px solid rgba(148,163,184,.09);border-radius:12px;background:rgba(255,255,255,.025);animation:kzLegendReveal .38s cubic-bezier(.22,.8,.32,1) var(--pay-delay) both;transition:transform .2s ease,border-color .2s ease,background-color .2s ease}
.kz-pay-item:hover{transform:translateX(-2px);border-color:color-mix(in srgb,var(--pay-color) 30%,transparent);background:rgba(255,255,255,.045)}
.kz-pay-icon{grid-row:1/3;display:grid;place-items:center;width:34px;height:34px;border-radius:10px;background:color-mix(in srgb,var(--pay-color) 15%,transparent);color:var(--pay-color);font-size:14px}
.kz-pay-copy{min-width:0}.kz-pay-copy strong,.kz-pay-copy small{display:block}.kz-pay-copy strong{color:#DCE7F2;font-size:11.5px}.kz-pay-copy small{overflow:hidden;margin-top:3px;color:#8295AC;font-size:9.5px;text-overflow:ellipsis;white-space:nowrap}
.kz-pay-percent{align-self:start;color:#F8FAFC;font-size:11px;font-weight:750;font-variant-numeric:tabular-nums}
.kz-pay-track{grid-column:2/4;display:block;height:3px;border-radius:999px;background:rgba(148,163,184,.1);overflow:hidden}.kz-pay-track i{display:block;height:100%;border-radius:inherit;background:var(--pay-color);box-shadow:0 0 10px color-mix(in srgb,var(--pay-color) 45%,transparent);transition:width .75s cubic-bezier(.22,.8,.32,1)}

html:not([data-theme="dark"]) .kz-donut-center strong{color:#20312F}
html:not([data-theme="dark"]) .kz-pay-item{background:#F8FBFA;border-color:#E1ECEA}
html:not([data-theme="dark"]) .kz-pay-copy strong,html:not([data-theme="dark"]) .kz-pay-percent{color:#314542}

@media(max-width:1180px){.kz-payment-layout{grid-template-columns:1fr}.kz-payment-chart-wrap{height:180px!important}.kz-pay-legend{grid-template-columns:repeat(3,minmax(0,1fr))}.kz-pay-item{grid-template-columns:28px minmax(0,1fr);padding:8px}.kz-pay-percent{grid-column:2}.kz-pay-track{grid-column:1/3}.kz-pay-icon{width:28px;height:28px}}
@media(max-width:620px){.kz-payment-layout{gap:5px}.kz-payment-chart-wrap{height:205px!important}.kz-pay-legend{grid-template-columns:1fr}.kz-pay-item{grid-template-columns:34px minmax(0,1fr) auto;padding:10px}.kz-pay-percent{grid-column:3}.kz-pay-track{grid-column:2/4}.kz-pay-icon{width:34px;height:34px}}
@media(prefers-reduced-motion:reduce){.page.on>*,.kz-pay-item,.kz-live-badge i{animation:none!important}.card,.sc,.quick,.sb-item,.btn,.btn-red,.theme-toggle,.kz-pay-item,.kz-payment-chart-wrap canvas,.kz-pay-track i{transition:none!important}}
html[data-theme="dark"] .sb-user{border-color:rgba(148,163,184,.12)}html[data-theme="dark"] .sb-av{background:linear-gradient(135deg,#3B82F6,#7C3AED);box-shadow:0 8px 22px rgba(59,130,246,.26)}
html[data-theme="dark"] .sb-bal{background:linear-gradient(145deg,rgba(30,64,175,.3),rgba(37,99,235,.12))!important;border-color:rgba(96,165,250,.26)!important}
html[data-theme="dark"] .sb-bal-amt{color:#EAF2FF}html[data-theme="dark"] .sb-bal-lbl,html[data-theme="dark"] .sb-bal-trx{color:#94A9C2}
html[data-theme="dark"] .sb-item{color:#AEBED0}html[data-theme="dark"] .sb-item:hover{background:rgba(59,130,246,.11);color:#EAF2FF}
html[data-theme="dark"] .sb-item.on{background:linear-gradient(100deg,rgba(59,130,246,.92),rgba(79,70,229,.84))!important;color:#fff!important;box-shadow:0 10px 26px rgba(37,99,235,.25)!important}
html[data-theme="dark"] .sb-sec{color:#61758E}html[data-theme="dark"] .sb-foot{border-color:rgba(148,163,184,.12);background:transparent}

html[data-theme="dark"] .main{background:linear-gradient(145deg,rgba(7,18,37,.98),rgba(9,24,45,.98))!important;box-shadow:0 24px 80px rgba(0,5,18,.36)}
html[data-theme="dark"] .topbar{background:rgba(8,23,43,.78)!important;border-color:rgba(148,163,184,.13)!important;backdrop-filter:blur(20px) saturate(135%)}
html[data-theme="dark"] .tb-title{color:#F8FAFC}html[data-theme="dark"] .tb-online{background:rgba(32,201,130,.12);color:#55E6A8;border-color:rgba(32,201,130,.22)}
html[data-theme="dark"] .tb-branch{background:rgba(59,130,246,.14);color:#8BBCFF;border-color:rgba(96,165,250,.23)}
html[data-theme="dark"] .menu-toggle,html[data-theme="dark"] .theme-toggle{background:rgba(15,35,61,.72);border-color:rgba(148,163,184,.17);color:#BED0E4}

html[data-theme="dark"] .card,html[data-theme="dark"] .sc,html[data-theme="dark"] .zstat-card,
html[data-theme="dark"] .lp-sum-card,html[data-theme="dark"] .rk-sum-card,html[data-theme="dark"] .ai-sum-card,
html[data-theme="dark"] .ai-mini-card,html[data-theme="dark"] .g-stat,html[data-theme="dark"] .pr-sc,
html[data-theme="dark"] #pg-stok_menu .sm-stat,html[data-theme="dark"] #pg-bahan_baku .bb-card{
  background:linear-gradient(145deg,rgba(15,31,56,.88),rgba(10,25,46,.84))!important;
  border-color:rgba(126,164,207,.16)!important;box-shadow:0 16px 42px rgba(0,6,20,.2)!important;
  backdrop-filter:blur(16px) saturate(118%);
}
html[data-theme="dark"] .card:hover,html[data-theme="dark"] .sc:hover{border-color:rgba(96,165,250,.28)!important;box-shadow:0 18px 48px rgba(0,8,28,.3),0 0 28px rgba(37,99,235,.055)!important}
html[data-theme="dark"] .sc-r{box-shadow:inset 0 1px rgba(94,234,212,.07),0 16px 42px rgba(0,6,20,.2)!important}
html[data-theme="dark"] .sc-g{box-shadow:inset 0 1px rgba(34,197,94,.07),0 16px 42px rgba(0,6,20,.2)!important}
html[data-theme="dark"] .sc-o{box-shadow:inset 0 1px rgba(245,158,11,.07),0 16px 42px rgba(0,6,20,.2)!important}
html[data-theme="dark"] .sc-b{box-shadow:inset 0 1px rgba(139,92,246,.08),0 16px 42px rgba(0,6,20,.2)!important}
html[data-theme="dark"] .sc-ico{background:rgba(59,130,246,.14);color:#74ADFF;box-shadow:inset 0 0 0 1px rgba(96,165,250,.12),0 0 22px rgba(59,130,246,.08)}
html[data-theme="dark"] .sc-r .sc-ico{background:rgba(34,211,238,.12);color:#5EEAFF}html[data-theme="dark"] .sc-g .sc-ico{background:rgba(32,201,130,.12);color:#55E6A8}
html[data-theme="dark"] .sc-o .sc-ico{background:rgba(245,158,11,.12);color:#FBC35C}html[data-theme="dark"] .sc-b .sc-ico{background:rgba(139,92,246,.13);color:#B394FF}
html[data-theme="dark"] .sc-lbl{color:#91A3B8}html[data-theme="dark"] .sc-val{color:#F8FAFC!important;text-shadow:0 0 24px rgba(147,197,253,.05)}
html[data-theme="dark"] .bal-card{background:linear-gradient(135deg,#2563EB,#4F46E5 58%,#6D28D9)!important;box-shadow:0 18px 48px rgba(37,99,235,.26)!important}

html[data-theme="dark"] .tw,html[data-theme="dark"] .table-wrap,html[data-theme="dark"] .content div[style*="overflow-x:auto"]{background:rgba(10,25,46,.7);border-color:rgba(126,164,207,.16)}
html[data-theme="dark"] .content table{background:transparent!important;border-color:rgba(126,164,207,.16)}
html[data-theme="dark"] .content table th,html[data-theme="dark"] .content table thead td{background:rgba(18,39,67,.92)!important;color:#92A7BE!important;border-color:rgba(126,164,207,.14)!important}
html[data-theme="dark"] .content table tbody td{color:#CDD8E5!important;border-color:rgba(126,164,207,.1)!important;background:transparent}
html[data-theme="dark"] .content table tbody tr:nth-child(even) td{background:rgba(17,36,61,.38)}html[data-theme="dark"] .content table tbody tr:hover td{background:rgba(37,99,235,.12)!important}

html[data-theme="dark"] .fi,html[data-theme="dark"] .fs,html[data-theme="dark"] .inp-sm,html[data-theme="dark"] .pr-inp,
html[data-theme="dark"] input,html[data-theme="dark"] select,html[data-theme="dark"] textarea{
  background:rgba(8,24,45,.88)!important;border-color:rgba(125,164,205,.22)!important;color:#EEF5FA!important;
}
html[data-theme="dark"] .fi:hover,html[data-theme="dark"] .fs:hover,html[data-theme="dark"] input:hover,html[data-theme="dark"] select:hover,html[data-theme="dark"] textarea:hover{border-color:rgba(96,165,250,.42)!important}
html[data-theme="dark"] .fi:focus,html[data-theme="dark"] .fs:focus,html[data-theme="dark"] input:focus,html[data-theme="dark"] select:focus,html[data-theme="dark"] textarea:focus{background:#0A1C34!important;border-color:#3B82F6!important;box-shadow:0 0 0 4px rgba(59,130,246,.18),0 0 24px rgba(37,99,235,.08)!important}
html[data-theme="dark"] .btn-r,html[data-theme="dark"] .btn-red,html[data-theme="dark"] .g-btn.save,html[data-theme="dark"] .pr-btn.save{background:linear-gradient(135deg,#3B82F6,#4F46E5)!important;box-shadow:0 10px 25px rgba(37,99,235,.22)!important}
html[data-theme="dark"] .btn-out,html[data-theme="dark"] .btn-outline,html[data-theme="dark"] .g-btn.cancel,html[data-theme="dark"] .pr-btn.cancel{background:rgba(15,35,61,.7)!important;border-color:rgba(126,164,207,.2)!important;color:#BFD0E2!important}
html[data-theme="dark"] .tab-btn.on,html[data-theme="dark"] .lap-tab.on,html[data-theme="dark"] .lp-tab.on,html[data-theme="dark"] .sm-tab.active,html[data-theme="dark"] .bb-tab.active,html[data-theme="dark"] .ai-period-btn.active{background:rgba(59,130,246,.16)!important;color:#8FBCFF!important;border-color:rgba(96,165,250,.35)!important}
html[data-theme="dark"] .modal,html[data-theme="dark"] .g-modal,html[data-theme="dark"] .topup-modal{background:linear-gradient(145deg,#10233D,#0A1A30)!important;border-color:rgba(126,164,207,.23)!important;box-shadow:0 35px 100px rgba(0,3,14,.62)!important}
html[data-theme="dark"] .mhd,html[data-theme="dark"] .g-modal-header{border-color:rgba(126,164,207,.14)}
html[data-theme="dark"] #pg-bahan_baku>div[style*="background:#E8F5E9"]{background:rgba(34,211,238,.08)!important;color:#7FE9F5!important;border-color:rgba(34,211,238,.18)!important}
html[data-theme="dark"] #pg-stok_menu .br-btn{background:rgba(12,29,51,.85)!important;color:#AEBFD1!important;border-color:rgba(126,164,207,.2)!important}
html[data-theme="dark"] #pg-stok_menu .br-btn.active{background:linear-gradient(135deg,#3B82F6,#4F46E5)!important;color:#fff!important;border-color:#4E8EF8!important}
html[data-theme="dark"] #bb-panel-linked .lk-menu-list,html[data-theme="dark"] #bb-panel-linked .lk-checklist,html[data-theme="dark"] #bb-panel-linked .lk-active{background:#0C1C32!important;border-color:rgba(126,164,207,.18)!important}

/* Entry pages follow the same dark identity */
.kz-auth-login,.kz-auth-register{color-scheme:dark;background:radial-gradient(circle at 14% 10%,rgba(37,99,235,.25),transparent 32rem),linear-gradient(145deg,#06101F,#0A1A32)!important;color:#F8FAFC}
.kz-auth-login .left{background:linear-gradient(145deg,#07162A,#0C2544 58%,#102F55)!important}.kz-auth-login .right{background:rgba(7,18,37,.88)!important}
.kz-auth-login .form-box,.kz-auth-register .box{background:rgba(13,28,50,.9)!important;border-color:rgba(126,164,207,.2)!important;box-shadow:0 30px 90px rgba(0,4,18,.4)!important;color:#F8FAFC}
.kz-auth-login .input,.kz-auth-register input{background:#091A30!important;border-color:#29445F!important;color:#F1F6FA!important}.kz-auth-login .field label,.kz-auth-register .field label{color:#AABACC!important}
.kz-auth-login .btn-login,.kz-auth-register .btn{background:linear-gradient(135deg,#3B82F6,#4F46E5)!important;box-shadow:0 12px 30px rgba(37,99,235,.3)!important}
.kz-wa-admin{color-scheme:dark;background:linear-gradient(145deg,#06101F,#0A1A32)!important;color:#F8FAFC!important}.kz-wa-admin .topbar{background:rgba(8,23,43,.88)!important;border-color:rgba(126,164,207,.16)!important}
.kz-wa-admin .tenant,.kz-wa-admin .gate-card,.kz-wa-admin .modal{background:#0D1C32!important;border-color:rgba(126,164,207,.2)!important;color:#EAF2F8!important;box-shadow:0 18px 50px rgba(0,5,18,.26)!important}
.kz-wa-admin .detail,.kz-wa-admin .kupon{background:#0A192D!important;border-color:rgba(126,164,207,.15)!important}.kz-wa-admin input,.kz-wa-admin select{background:#08182C!important;border-color:#29445F!important;color:#EEF5FA!important}

/* Live WIB clock */
.kz-datetime{height:42px;display:flex;align-items:center;gap:9px;padding:6px 11px;border:1px solid #D3E2DF;border-radius:12px;background:rgba(250,253,252,.86);white-space:nowrap;line-height:1.1}
.kz-clock-icon{width:27px;height:27px;display:grid;place-items:center;border-radius:9px;background:#DDEDEC;color:#39757B;font-size:17px;font-weight:800}
.kz-clock-copy{display:flex;flex-direction:column;gap:3px}.kz-clock-copy strong{font-size:11.5px;color:#2E4F4F;font-variant-numeric:tabular-nums;letter-spacing:.18px}.kz-clock-copy small{font-size:9.5px;color:#758681;text-transform:capitalize}
html[data-theme="dark"] .kz-datetime{background:rgba(15,35,61,.72);border-color:rgba(126,164,207,.19);box-shadow:inset 0 1px rgba(255,255,255,.025)}
html[data-theme="dark"] .kz-clock-icon{background:rgba(59,130,246,.15);color:#7DB2FF;box-shadow:0 0 18px rgba(37,99,235,.1)}
html[data-theme="dark"] .kz-clock-copy strong{color:#EAF2FC}html[data-theme="dark"] .kz-clock-copy small{color:#8FA4BB}
@media(max-width:900px){.kz-clock-copy small{display:none}.kz-datetime{padding:6px 9px}.kz-clock-icon{display:none}}
@media(max-width:560px){.kz-datetime{height:36px;padding:5px 8px}.kz-clock-copy strong{font-size:10.5px}.tb-online{display:none!important}}

/* Transaction search in the existing topbar */
.kz-transaction-search{position:relative;width:clamp(230px,30vw,480px);height:42px;display:flex;align-items:center;gap:9px;padding:0 11px;border:1px solid rgba(126,164,207,.19);border-radius:12px;background:rgba(15,35,61,.72);transition:border-color .16s,box-shadow .16s,background .16s}
.kz-transaction-search:focus-within{border-color:rgba(96,165,250,.58);background:rgba(12,31,57,.96);box-shadow:0 0 0 4px rgba(59,130,246,.12),0 0 26px rgba(37,99,235,.08)}
.kz-search-icon{color:#83A2C3;font-size:17px;flex:0 0 auto}.kz-transaction-search input{width:100%;height:38px;min-height:0!important;padding:0!important;border:0!important;background:transparent!important;box-shadow:none!important;color:#EAF2FC!important;font-size:12.5px}
.kz-transaction-search input:focus{border:0!important;box-shadow:none!important;background:transparent!important}.kz-transaction-search input::placeholder{color:#7F95AD}
.kz-search-key{padding:3px 6px;border:1px solid rgba(126,164,207,.15);border-radius:6px;background:rgba(255,255,255,.035);color:#758CA6;font-size:9.5px;font-family:var(--mono)}
.kz-search-results{position:absolute;top:calc(100% + 9px);left:0;right:0;z-index:1200;display:none;max-height:390px;overflow:auto;padding:7px;border:1px solid rgba(126,164,207,.22);border-radius:15px;background:rgba(8,23,43,.97);box-shadow:0 26px 70px rgba(0,4,18,.5);backdrop-filter:blur(22px)}
.kz-search-results.on{display:block;animation:pageIn .16s ease both}.kz-search-state{padding:18px 13px;color:#849AB2;font-size:12px;text-align:center}
.kz-search-result{width:100%;display:grid;grid-template-columns:minmax(0,1fr) auto;gap:5px 14px;padding:10px 11px;border:0;border-radius:10px;background:transparent;color:#DCE7F2;text-align:left;cursor:pointer}
.kz-search-result:hover,.kz-search-result:focus-visible{background:rgba(59,130,246,.12);outline:none}.kz-search-result strong{overflow:hidden;text-overflow:ellipsis;font-size:12.5px}.kz-search-result .kz-sr-total{grid-column:2;grid-row:1;font-weight:760;color:#F5F9FC;font-variant-numeric:tabular-nums}.kz-search-result small{color:#849AB2;font-size:10.5px}.kz-search-result .kz-sr-status{justify-self:end;color:#72D7B0}

/* Smooth 7-day sales trend */
.kz-sales-chart-wrap{height:260px!important;padding:5px 2px 0}.kz-payment-chart-wrap{height:260px!important;padding-top:4px}
#ch-daily,#ch-pay{filter:drop-shadow(0 8px 18px rgba(37,99,235,.08))}

html:not([data-theme="dark"]) .kz-transaction-search{background:#F8FBFA;border-color:#D3E2DF}.kz-transaction-search input{color:inherit}
html:not([data-theme="dark"]) .kz-transaction-search input{color:#314542!important}html:not([data-theme="dark"]) .kz-transaction-search input::placeholder{color:#83938F}
html:not([data-theme="dark"]) .kz-search-results{background:rgba(255,255,255,.98);border-color:#D5E4E1;box-shadow:0 24px 60px rgba(35,72,68,.18)}
html:not([data-theme="dark"]) .kz-search-result{color:#334743}html:not([data-theme="dark"]) .kz-search-result .kz-sr-total{color:#1C302C}html:not([data-theme="dark"]) .kz-search-result:hover{background:#EAF4F3}

@media(max-width:1180px){.kz-transaction-search{width:clamp(190px,25vw,330px)}.kz-search-key{display:none}}
@media(max-width:900px){.tb-title{display:none}.kz-transaction-search{width:auto;flex:1;max-width:none}.kz-datetime{flex:0 0 auto}}
@media(max-width:620px){.kz-transaction-search{height:36px;padding-inline:9px}.kz-transaction-search input{font-size:11.5px}.kz-clock-copy{display:none}.kz-datetime{width:36px;justify-content:center}.kz-clock-icon{display:grid}.kz-sales-chart-wrap,.kz-payment-chart-wrap{height:225px!important}}


/* =====================================================================
   v5.16 - Complete dark contrast and KPI visual consistency
   UI-only overrides; application behavior and data contracts unchanged.
   ===================================================================== */
html[data-theme="dark"] .page{
  color:#DCE7F2;
}
html[data-theme="dark"] .page [style*="color:#1A1A1A" i],
html[data-theme="dark"] .page [style*="color:#1a1a1a" i],
html[data-theme="dark"] .page [style*="color:#212121" i],
html[data-theme="dark"] .page [style*="color:#333" i]{color:#F3F7FB!important}
html[data-theme="dark"] .page [style*="color:#555" i],
html[data-theme="dark"] .page [style*="color:#616161" i],
html[data-theme="dark"] .page [style*="color:#666" i],
html[data-theme="dark"] .page [style*="color:#757575" i]{color:#C4D1DE!important}
html[data-theme="dark"] .page [style*="color:#888" i],
html[data-theme="dark"] .page [style*="color:#999" i],
html[data-theme="dark"] .page [style*="color:#9E9E9E" i],
html[data-theme="dark"] .page [style*="color:#aaa" i],
html[data-theme="dark"] .page [style*="color:#bbb" i]{color:#8FA4BA!important}
html[data-theme="dark"] .page [style*="color:#2E7D32" i],
html[data-theme="dark"] .page [style*="color:#1B5E20" i]{color:#4ADE9D!important}
html[data-theme="dark"] .page [style*="color:#E65100" i],
html[data-theme="dark"] .page [style*="color:#F57F17" i]{color:#FBBF24!important}
html[data-theme="dark"] .page [style*="color:#C62828" i]{color:#FB7185!important}
html[data-theme="dark"] .page [style*="color:#E53935" i],
html[data-theme="dark"] .page [style*="color:#D9622B" i]{color:#71B1FF!important}

html[data-theme="dark"] .page [style*="background:white" i],
html[data-theme="dark"] .page [style*="background:#fff" i],
html[data-theme="dark"] .page [style*="background:#FFFFFF" i]{background:#10233A!important}
html[data-theme="dark"] .page [style*="background:#F5F5F5" i],
html[data-theme="dark"] .page [style*="background:#f5f5f5" i],
html[data-theme="dark"] .page [style*="background:#FAFAFA" i],
html[data-theme="dark"] .page [style*="background:#f9f9f9" i]{background:#132A40!important}
html[data-theme="dark"] .page [style*="border-bottom:1px solid #F5F5F5" i],
html[data-theme="dark"] .page [style*="border-bottom:1px solid #f5f5f5" i],
html[data-theme="dark"] .page [style*="border-bottom:1px solid #f0f0f0" i]{border-bottom-color:rgba(126,164,207,.14)!important}

html[data-theme="dark"] .aw{background:rgba(245,158,11,.10);border-color:rgba(245,158,11,.24);color:#FCD88B}
html[data-theme="dark"] .ai{background:rgba(34,211,238,.08);border-color:rgba(34,211,238,.20);color:#9DECF5}
html[data-theme="dark"] .ao{background:rgba(52,211,153,.08);border-color:rgba(52,211,153,.20);color:#9AE6C5}
html[data-theme="dark"] .bgr{background:#172A3D;color:#B8C7D5;border-color:#29445B}
html[data-theme="dark"] .bp{background:rgba(139,92,246,.14);color:#C4B5FD;border-color:rgba(167,139,250,.25)}
html[data-theme="dark"] .lov{background:rgba(4,12,25,.82);color:#EAF2FA}
html[data-theme="dark"] .mx{background:#132A40;border-color:#29445B;color:#C4D1DE}

#pg-kpi .kpi-filterbar{padding:14px 16px;margin-bottom:18px!important;border:1px solid rgba(126,164,207,.14);border-radius:16px;background:rgba(13,31,54,.68)}
#pg-kpi .kpi-filterbar label{color:#91A5BA!important;letter-spacing:.04em}
#pg-kpi .kpi-filterbar .fs{height:40px;width:155px!important}
#pg-kpi .kpi-filterbar>button{height:40px!important;border-radius:11px!important}
#pg-kpi .kpi-filterbar>button:last-child{background:rgba(59,130,246,.09)!important;border:1px solid rgba(96,165,250,.38)!important;color:#8FBCFF!important}
#pg-kpi .kpi-filterbar>button:last-child:hover{background:rgba(59,130,246,.17)!important;transform:translateY(-1px)}
#pg-kpi .kpi-summary-card{position:relative;min-height:118px;padding:18px!important;overflow:hidden}
#pg-kpi .kpi-summary-card::before{content:'';position:absolute;right:-25px;top:-30px;width:100px;height:100px;border-radius:50%;background:radial-gradient(circle,rgba(59,130,246,.15),transparent 68%);pointer-events:none}
#pg-kpi .kpi-summary-label{color:#91A5BA!important;font-size:10.5px!important;font-weight:700;letter-spacing:.055em;text-transform:uppercase}
#pg-kpi .kpi-summary-value{color:#F8FAFC!important;font-size:22px!important;font-weight:800!important;letter-spacing:-.5px;line-height:1.2}
#pg-kpi .kpi-summary-sub{color:#8FA4BA!important;margin-top:8px!important}
#pg-kpi .kpi-summary-icon{display:grid;width:40px;height:40px;place-items:center;border:1px solid rgba(96,165,250,.14);border-radius:12px;background:rgba(59,130,246,.11);font-size:20px!important}
#pg-kpi .kpi-charts-grid>.card,#pg-kpi .kpi-breakdown-grid>.card{padding:18px!important}
#pg-kpi .kpi-charts-grid>.card:first-child{min-height:335px}
#pg-kpi #kpi-trend-chart{height:260px!important}
#pg-kpi #kpi-payment-chart{height:280px!important;max-height:280px}
#pg-kpi #kpi-target-section{min-height:255px;display:flex;flex-direction:column;justify-content:center}
#pg-kpi #kpi-target-section>div[style*="text-align:center"]{color:#DCE7F2}
#pg-kpi #kpi-target-section [style*="background:#E53935" i]{background:linear-gradient(135deg,#3B82F6,#4F46E5)!important;box-shadow:0 8px 20px rgba(37,99,235,.24)}
#pg-kpi #kpi-branch-list>div,#pg-kpi #kpi-kasir-list>div{padding:12px 0!important;border-color:rgba(126,164,207,.13)!important}
#pg-kpi #kpi-branch-list>div:first-child,#pg-kpi #kpi-kasir-list>div:first-child{padding-top:2px!important}
#pg-kpi #kpi-branch-list [style*="background:#E53935" i]{background:linear-gradient(90deg,#3B82F6,#22D3EE)!important}
#pg-kpi #kpi-kasir-list [style*="background:#4CAF50" i]{background:linear-gradient(90deg,#34D399,#22D3EE)!important}
#pg-kpi #kpi-branch-list [style*="background:#F5F5F5" i],#pg-kpi #kpi-kasir-list [style*="background:#F5F5F5" i],#pg-kpi #kpi-target-section [style*="background:#F5F5F5" i]{background:rgba(148,163,184,.12)!important}
#pg-kpi .kpi-target-modal>div{background:linear-gradient(145deg,#10233D,#0A1A30)!important;border:1px solid rgba(126,164,207,.23);color:#F8FAFC;box-shadow:0 35px 100px rgba(0,3,14,.62)}
#pg-kpi .kpi-target-modal label{color:#AABACC!important}
#pg-kpi .kpi-target-modal button:first-child{background:#132A40!important;border-color:#29445B!important;color:#C4D1DE!important}

@media(max-width:1180px){#pg-kpi .kpi-cards-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important}#pg-kpi .kpi-charts-grid{grid-template-columns:1fr!important}#pg-kpi .kpi-breakdown-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important}#pg-kpi .kpi-breakdown-grid>.card:last-child{grid-column:1/-1}}
@media(max-width:680px){#pg-kpi .kpi-filterbar{align-items:stretch!important}#pg-kpi .kpi-filterbar>div{flex:1;min-width:130px}#pg-kpi .kpi-filterbar .fs{width:100%!important}#pg-kpi .kpi-filterbar>button{flex:1}#pg-kpi .kpi-cards-grid,#pg-kpi .kpi-breakdown-grid{grid-template-columns:1fr!important}#pg-kpi .kpi-breakdown-grid>.card:last-child{grid-column:auto}#pg-kpi .kpi-summary-card{min-height:108px}}


/* =====================================================================
   v5.17 - Unified eye-comfort palette and readable typography
   Presentation-only overrides for every legacy dashboard module.
   ===================================================================== */
html[data-theme="dark"]{
  --kz-bg-deep:#071321;--kz-bg:#091827;--kz-panel:#0E2237;--kz-panel-2:#122A42;
  --kz-line:rgba(132,169,205,.18);--kz-line-strong:rgba(132,169,205,.28);
  --kz-ink:#EDF5FA;--kz-copy:#C4D2DE;--kz-muted:#8EA3B6;
  --kz-blue:#62A8F8;--kz-cyan:#47D7DF;--kz-green:#44D99A;--kz-yellow:#F2BD5F;--kz-danger:#FB7F8C;
}
html[data-theme="dark"] body{font-size:14.5px;line-height:1.58;color:var(--kz-copy);letter-spacing:-.005em}
html[data-theme="dark"] .content{padding:clamp(18px,2vw,30px)}
html[data-theme="dark"] .page>div:first-child h2,html[data-theme="dark"] .page>h2{font-size:21px!important;color:var(--kz-ink)!important;letter-spacing:-.45px}
html[data-theme="dark"] .card-t,html[data-theme="dark"] .page h3,html[data-theme="dark"] .page h4{color:var(--kz-ink)}
html[data-theme="dark"] .card-t{font-size:14.5px;font-weight:750}
html[data-theme="dark"] .page [style*="font-size:9px"]{font-size:11px!important}
html[data-theme="dark"] .page [style*="font-size:10px"]{font-size:11.5px!important}
html[data-theme="dark"] .page [style*="font-size:11px"]{font-size:12px!important}
html[data-theme="dark"] .page [style*="font-size:12px"]{font-size:13px!important}
html[data-theme="dark"] .page input,html[data-theme="dark"] .page select,html[data-theme="dark"] .page textarea,html[data-theme="dark"] .page button{font-size:13px;line-height:1.35}
html[data-theme="dark"] .page input::placeholder,html[data-theme="dark"] .page textarea::placeholder{color:#71879B}

/* Navigation contrast, including legacy anchor items at the bottom */
html[data-theme="dark"] .sb{color:var(--kz-copy)}
html[data-theme="dark"] .sb-item{color:#B9CAD8;font-size:13.5px;font-weight:540}
html[data-theme="dark"] .sb-sec{color:#7790A6;font-size:10px}
html[data-theme="dark"] #sb-menu>a{display:flex!important;align-items:center;gap:11px!important;margin:2px 10px;padding:9px 12px!important;min-height:40px;border-radius:11px!important;color:#B9CAD8!important;font-size:13.5px!important;font-weight:540;text-decoration:none;transition:.18s}
html[data-theme="dark"] #sb-menu>a:hover{background:rgba(98,168,248,.11)!important;color:#EFF6FC!important}
html[data-theme="dark"] .sb-urole,html[data-theme="dark"] .sb-bal-trx{color:#91A7BA}

/* Shared surface correction for legacy modules */
html[data-theme="dark"] #pg-topup_sub .card,
html[data-theme="dark"] #pg-finance .fin-card,html[data-theme="dark"] #pg-finance .fin-summary,
html[data-theme="dark"] #pg-payroll .pr-card,html[data-theme="dark"] #pg-payroll .pr-sc,
html[data-theme="dark"] #pg-ai_insights .ai-result,html[data-theme="dark"] #pg-ai_insights .ai-mini-card,html[data-theme="dark"] #pg-ai_insights .ai-sum-card,
html[data-theme="dark"] #pg-bisnis_interaction .bi-wrap,
html[data-theme="dark"] #pg-bahan_baku .bb-card,
html[data-theme="dark"] #pg-gudang_pusat .g-card,html[data-theme="dark"] #pg-gudang_pusat .g-stat,
html[data-theme="dark"] #pg-log_penjualan .lp-cab-card,html[data-theme="dark"] #pg-log_penjualan .lp-top-item,html[data-theme="dark"] #pg-log_penjualan .lp-sum-card,
html[data-theme="dark"] #pg-wa_log .wl-row{
  background:linear-gradient(145deg,rgba(15,34,55,.96),rgba(11,28,47,.94))!important;
  color:var(--kz-copy)!important;border:1px solid var(--kz-line)!important;
  box-shadow:0 14px 34px rgba(0,6,18,.16)!important;
}
html[data-theme="dark"] #pg-finance .fin-card,html[data-theme="dark"] #pg-finance .fin-summary,
html[data-theme="dark"] #pg-payroll .pr-card{border-radius:16px!important}

/* Business Interaction */
html[data-theme="dark"] #pg-bisnis_interaction .bi-wrap{height:calc(100vh - 150px);min-height:570px;max-width:1180px;margin:auto;border-radius:18px!important;overflow:hidden}
html[data-theme="dark"] #pg-bisnis_interaction .bi-toolbar,html[data-theme="dark"] #pg-bisnis_interaction .bi-input-area{background:#0C1E31!important;border-color:var(--kz-line)!important;padding:12px 16px}
html[data-theme="dark"] #pg-bisnis_interaction .bi-wrap>div:nth-child(2){background:#0A1A2B!important;border-color:var(--kz-line)!important}
html[data-theme="dark"] #pg-bisnis_interaction .bi-header{background:linear-gradient(105deg,#2563EB,#3B82F6 58%,#1595B5)!important;padding:16px 20px}
html[data-theme="dark"] #pg-bisnis_interaction .bi-messages{background:radial-gradient(circle at 50% 0,rgba(59,130,246,.075),transparent 28rem),#091929!important;padding:20px}
html[data-theme="dark"] #pg-bisnis_interaction .bi-msg.ai,html[data-theme="dark"] #pg-bisnis_interaction .bi-msg.typing{background:#132A42!important;color:#DDE8F1!important;border-color:var(--kz-line)!important}
html[data-theme="dark"] #pg-bisnis_interaction .bi-msg.user{background:linear-gradient(135deg,#2563EB,#4F46E5)!important}
html[data-theme="dark"] #pg-bisnis_interaction .bi-msg.sys{background:rgba(71,215,223,.09)!important;color:#91EAF0!important;border-color:rgba(71,215,223,.22)!important}
html[data-theme="dark"] #pg-bisnis_interaction .bi-quick-row{background:#0B1B2D!important;border-color:var(--kz-line)!important;padding:10px 14px}
html[data-theme="dark"] #pg-bisnis_interaction .bi-q{background:#12283F!important;color:#BFD0DE!important;border-color:var(--kz-line)!important;font-size:12px!important}
html[data-theme="dark"] #pg-bisnis_interaction .bi-q:hover{background:rgba(98,168,248,.14)!important;color:#A7D2FF!important;border-color:rgba(98,168,248,.38)!important}
html[data-theme="dark"] #pg-bisnis_interaction .bi-ta{background:#10253C!important;color:#ECF4F9!important;border-color:var(--kz-line-strong)!important;min-height:44px}
html[data-theme="dark"] #pg-bisnis_interaction .bi-sendbtn,html[data-theme="dark"] #pg-bisnis_interaction .bi-loadbtn{background:linear-gradient(135deg,#3B82F6,#2563EB)!important;color:white!important}
html[data-theme="dark"] #pg-bisnis_interaction .bi-clearbtn{background:#12283F!important;color:#AFC1D0!important;border-color:var(--kz-line)!important}

/* AI Insights */
html[data-theme="dark"] #pg-ai_insights .ai-header h2{color:var(--kz-ink)!important}
html[data-theme="dark"] #pg-ai_insights .ai-period-btn{background:#11273E!important;color:#B9CAD8!important;border-color:var(--kz-line)!important}
html[data-theme="dark"] #pg-ai_insights .ai-period-btn.act,html[data-theme="dark"] #pg-ai_insights .ai-run-btn{background:linear-gradient(135deg,#3B82F6,#2563EB)!important;color:white!important;border-color:#4E8EF8!important}
html[data-theme="dark"] #pg-ai_insights .ai-sum-card{border-left:3px solid var(--kz-blue)!important}
html[data-theme="dark"] #pg-ai_insights .ai-sum-card.green{border-left-color:var(--kz-green)!important}html[data-theme="dark"] #pg-ai_insights .ai-sum-card.red{border-left-color:var(--kz-danger)!important}html[data-theme="dark"] #pg-ai_insights .ai-sum-card.purple{border-left-color:#A78BFA!important}
html[data-theme="dark"] #pg-ai_insights .ai-sum-card .lbl{color:#8FA5B9!important}html[data-theme="dark"] #pg-ai_insights .ai-sum-card .val{color:#F3F8FC!important}
html[data-theme="dark"] #pg-ai_insights .ai-mini-card h4{color:#DCE7F0!important}
html[data-theme="dark"] #pg-ai_insights .ai-result{min-height:220px;color:var(--kz-copy)!important}
html[data-theme="dark"] #pg-ai_insights .ai-empty{color:#94A8BA!important}
html[data-theme="dark"] #pg-ai_insights .ai-content,html[data-theme="dark"] #pg-ai_insights .ai-content strong{color:#DCE7F0!important}
html[data-theme="dark"] #pg-ai_insights .ai-content h3{color:#7DB7FA!important;border-color:var(--kz-line)!important}
html[data-theme="dark"] #pg-ai_insights .ai-alert{background:rgba(242,189,95,.09)!important;border-color:rgba(242,189,95,.28)!important;color:#F5D58E!important}
html[data-theme="dark"] #pg-ai_insights .ai-alert.red{background:rgba(251,127,140,.09)!important;border-color:rgba(251,127,140,.26)!important;color:#FFA4AD!important}

/* Subscription and Top Up */
html[data-theme="dark"] #pg-topup_sub>div{max-width:720px!important}
html[data-theme="dark"] #pg-topup_sub>div>div:first-child{background:linear-gradient(135deg,#2563EB,#3B82F6 56%,#5B5BE7)!important;border:1px solid rgba(147,197,253,.25);border-radius:18px!important;box-shadow:0 18px 45px rgba(37,99,235,.22)}
html[data-theme="dark"] #pg-topup_sub [id^="plan-"]{background:#11273E!important;border-color:var(--kz-line)!important;color:var(--kz-copy)!important}
html[data-theme="dark"] #pg-topup_sub [id^="plan-"]:hover{background:#15324E!important;border-color:rgba(98,168,248,.45)!important}
html[data-theme="dark"] #pg-topup_sub #tus-activate-wrap{background:rgba(98,168,248,.09)!important;border-color:rgba(98,168,248,.28)!important}
html[data-theme="dark"] #pg-topup_sub #tus-activate-btn,html[data-theme="dark"] #pg-topup_sub #tus-btn:not(:disabled){background:linear-gradient(135deg,#3B82F6,#2563EB)!important}
html[data-theme="dark"] #pg-topup_sub #tus-btn:disabled{background:#23364A!important;color:#8196A9!important;opacity:1!important}
html[data-theme="dark"] #pg-topup_sub [onclick^="tusPick"]{background:#12283F!important;color:#C5D3DE!important;border-color:var(--kz-line-strong)!important}
html[data-theme="dark"] #pg-topup_sub [onclick^="tusPick"]:hover{background:rgba(98,168,248,.15)!important;border-color:#5599E7!important}

/* Finance */
html[data-theme="dark"] #pg-finance .fin-grid{max-width:1050px}
html[data-theme="dark"] #pg-finance .fin-card h3,html[data-theme="dark"] #pg-finance .fin-summary h3{color:#9CB0C1!important}
html[data-theme="dark"] #pg-finance .fin-row{border-color:var(--kz-line)!important;color:#C9D5DF}
html[data-theme="dark"] #pg-finance .fin-row.profit{border-top-color:var(--kz-line-strong)!important}
html[data-theme="dark"] #pg-finance .fin-input-row label{color:#BBCAD6!important;font-weight:560}
html[data-theme="dark"] #pg-finance .fin-input-row input{background:#0A1B2C!important;color:#EAF2F8!important;border-color:var(--kz-line-strong)!important;min-height:40px}
html[data-theme="dark"] #pg-finance .fin-save-btn{background:linear-gradient(135deg,#3B82F6,#2563EB)!important;color:white!important}

/* Payroll */
html[data-theme="dark"] #pg-payroll .pr-wrap{max-width:1280px}
html[data-theme="dark"] #pg-payroll .pr-card{grid-template-columns:minmax(170px,210px) 1fr auto;gap:20px;padding:18px 20px!important}
html[data-theme="dark"] #pg-payroll .pr-card-left .name{color:#F0F6FA!important}html[data-theme="dark"] #pg-payroll .pr-card-left .branch,html[data-theme="dark"] #pg-payroll .pr-card-left .jabatan{color:#8FA4B7!important}
html[data-theme="dark"] #pg-payroll .pr-sc .lbl,html[data-theme="dark"] #pg-payroll .pr-stat .s-lbl,html[data-theme="dark"] #pg-payroll .pr-inp-wrap .s-lbl{color:#8FA4B7!important}
html[data-theme="dark"] #pg-payroll .pr-sc .val{color:#F1F7FB!important}
html[data-theme="dark"] #pg-payroll .pr-inp{background:#0A1B2C!important;color:#EAF2F8!important;border-color:var(--kz-line-strong)!important;min-height:38px}
html[data-theme="dark"] #pg-payroll .pr-action-btn{min-height:34px;padding:6px 12px}

/* Raw materials */
html[data-theme="dark"] #pg-bahan_baku .bb-tab{color:#9EB1C1!important;border-bottom-color:transparent!important}
html[data-theme="dark"] #pg-bahan_baku .bb-tab.active{background:rgba(71,215,223,.10)!important;color:#88E8ED!important;border-bottom-color:var(--kz-cyan)!important}
html[data-theme="dark"] #bb-panel-linked .lk-layout>div,html[data-theme="dark"] #bb-panel-linked>div:last-child{background:#0E2237!important;border-color:var(--kz-line)!important;color:var(--kz-copy)!important}
html[data-theme="dark"] #bb-lk-menu-list .lk-menu-row,html[data-theme="dark"] #bb-lk-comp-checklist .lk-bb-row,html[data-theme="dark"] #bb-lk-list .lk-link-row{background:#0E2237!important;color:#C8D5DF!important;border-color:var(--kz-line)!important}
html[data-theme="dark"] #bb-lk-menu-list .lk-menu-row:hover,html[data-theme="dark"] #bb-lk-comp-checklist .lk-bb-row:hover{background:#142C44!important}
html[data-theme="dark"] #bb-lk-menu-list .lk-menu-row.active-row{background:rgba(71,215,223,.12)!important;color:#91E8ED!important}
html[data-theme="dark"] #pg-bahan_baku button[onclick^="bbAddLinkBulk"]{background:linear-gradient(135deg,#3B82F6,#1595B5)!important}

/* Warehouse */
html[data-theme="dark"] #pg-gudang_pusat .g-card{border-radius:16px!important;overflow:hidden}
html[data-theme="dark"] #pg-gudang_pusat .g-card-hdr{border-color:var(--kz-line)!important;padding:15px 18px}
html[data-theme="dark"] #pg-gudang_pusat table{background:transparent!important;color:#C8D5DF!important;font-size:13px!important}
html[data-theme="dark"] #pg-gudang_pusat th{background:#132A42!important;color:#9CB0C1!important;border-color:var(--kz-line)!important;padding:11px 14px!important}
html[data-theme="dark"] #pg-gudang_pusat td{background:transparent!important;color:#C8D5DF!important;border-color:var(--kz-line)!important;padding:12px 14px!important}
html[data-theme="dark"] #pg-gudang_pusat tbody tr:nth-child(even) td{background:rgba(24,51,77,.5)!important}
html[data-theme="dark"] #pg-gudang_pusat tbody tr:hover td{background:rgba(59,130,246,.13)!important}
html[data-theme="dark"] #pg-gudang_pusat .g-btn{background:#132A42!important;color:#C8D5DF!important;border-color:var(--kz-line-strong)!important;min-height:34px}
html[data-theme="dark"] #pg-gudang_pusat .g-btn.green{background:rgba(68,217,154,.11)!important;color:#7BE5B4!important;border-color:rgba(68,217,154,.28)!important}
html[data-theme="dark"] #pg-gudang_pusat .g-btn.blue,html[data-theme="dark"] #pg-gudang_pusat .g-btn.primary{background:rgba(98,168,248,.14)!important;color:#91C4FC!important;border-color:rgba(98,168,248,.33)!important}
html[data-theme="dark"] #pg-gudang_pusat .notice{background:rgba(242,189,95,.09)!important;color:#F4D287!important;border-color:rgba(242,189,95,.25)!important}

/* Sales and WA logs */
html[data-theme="dark"] #pg-log_penjualan .lp-tab,html[data-theme="dark"] #pg-wa_log .wl-tab{background:#11273E!important;color:#B9CAD8!important;border-color:var(--kz-line)!important}
html[data-theme="dark"] #pg-log_penjualan .lp-tab.act,html[data-theme="dark"] #pg-wa_log .wl-tab.act{background:linear-gradient(135deg,#3B82F6,#2563EB)!important;color:#fff!important;border-color:#4E8EF8!important}
html[data-theme="dark"] #pg-log_penjualan .lp-sum-card{border-left:3px solid var(--kz-blue)!important}
html[data-theme="dark"] #pg-log_penjualan .lp-sum-val{color:#F1F7FB!important}html[data-theme="dark"] #pg-log_penjualan .lp-sum-lbl{color:#8FA4B7!important}
html[data-theme="dark"] #pg-log_penjualan .lp-cab-head{border-color:var(--kz-line)!important}html[data-theme="dark"] #pg-log_penjualan .lp-cab-total{color:#7EB9FA!important}
html[data-theme="dark"] #pg-log_penjualan .lp-top-name{color:#DCE7F0!important}html[data-theme="dark"] #pg-log_penjualan .lp-top-rev{color:#8FA4B7!important}
html[data-theme="dark"] #pg-log_penjualan .lp-cab-card table{background:#0A1B2D!important;border-radius:12px;overflow:hidden}
html[data-theme="dark"] #pg-log_penjualan .lp-cab-card tbody tr:nth-child(even) td{background:rgba(22,48,73,.58)!important}
html[data-theme="dark"] #pg-wa_log .wl-row{box-shadow:none!important}

/* Remaining light legacy colors generated at runtime */
html[data-theme="dark"] .page [style*="background:#f9f9f7" i],html[data-theme="dark"] .page [style*="background:#fafaf8" i],
html[data-theme="dark"] .page [style*="background:#F5F5F5" i],html[data-theme="dark"] .page [style*="background:#f5f5f5" i],
html[data-theme="dark"] .page [style*="background:#eee" i],html[data-theme="dark"] .page [style*="background:#e0e0e0" i]{background:#142B42!important}
html[data-theme="dark"] .page [style*="background:#E8F5E9" i]{background:rgba(68,217,154,.10)!important}
html[data-theme="dark"] .page [style*="background:#E3F2FD" i]{background:rgba(98,168,248,.11)!important}
html[data-theme="dark"] .page [style*="background:#FFF8E1" i],html[data-theme="dark"] .page [style*="background:#FFFDE7" i]{background:rgba(242,189,95,.10)!important}
html[data-theme="dark"] .page [style*="background:#FFEBEE" i]{background:rgba(251,127,140,.10)!important}
html[data-theme="dark"] .page [style*="background:#FFF3E0" i],html[data-theme="dark"] .page [style*="background:#FFF3EB" i]{background:rgba(242,189,95,.10)!important}
html[data-theme="dark"] .page [style*="border:1px solid #eee" i],html[data-theme="dark"] .page [style*="border:1.5px solid #eee" i],html[data-theme="dark"] .page [style*="border:2px solid #eee" i]{border-color:var(--kz-line-strong)!important}

@media(max-width:900px){html[data-theme="dark"] body{font-size:14px}html[data-theme="dark"] #pg-bisnis_interaction .bi-wrap{height:calc(100vh - 96px);min-height:520px}html[data-theme="dark"] #pg-payroll .pr-card{grid-template-columns:1fr}.fin-grid{grid-template-columns:1fr!important}}


/* =====================================================================
   v5.18 - Targeted color fixes: linked stock, WA log and receipt preview
   ===================================================================== */
/* Bahan Baku: eliminate remaining white islands */
html[data-theme="dark"] #pg-bahan_baku h2{color:#EAF4FA!important}
html[data-theme="dark"] #pg-bahan_baku>div[style*="background:#E8F5E9" i]{background:rgba(71,215,223,.08)!important;color:#9BE9ED!important;border-color:rgba(71,215,223,.22)!important}
html[data-theme="dark"] #pg-bahan_baku #bb-lk-menu-list,
html[data-theme="dark"] #pg-bahan_baku .lk-layout>div:nth-child(2)>div{
  background:#0E2237!important;border:1px solid rgba(132,169,205,.22)!important;color:#C8D6E1!important;
  box-shadow:0 10px 28px rgba(0,6,18,.13);
}
html[data-theme="dark"] #pg-bahan_baku #bb-lk-menu-list .lk-menu-row,
html[data-theme="dark"] #pg-bahan_baku #bb-lk-comp-checklist .lk-bb-row,
html[data-theme="dark"] #pg-bahan_baku #bb-lk-list .lk-link-row{
  background:#0E2237!important;color:#C8D6E1!important;border-color:rgba(132,169,205,.16)!important;
}
html[data-theme="dark"] #pg-bahan_baku #bb-lk-menu-list .lk-menu-row:nth-child(even),
html[data-theme="dark"] #pg-bahan_baku #bb-lk-comp-checklist .lk-bb-row:nth-child(even),
html[data-theme="dark"] #pg-bahan_baku #bb-lk-list .lk-link-row:nth-child(even){background:#10263C!important}
html[data-theme="dark"] #pg-bahan_baku #bb-lk-menu-list .lk-menu-row:hover,
html[data-theme="dark"] #pg-bahan_baku #bb-lk-comp-checklist .lk-bb-row:hover,
html[data-theme="dark"] #pg-bahan_baku #bb-lk-list .lk-link-row:hover{background:rgba(59,130,246,.13)!important;color:#EEF6FB!important}
html[data-theme="dark"] #pg-bahan_baku #bb-lk-menu-list .lk-menu-row.active-row{background:linear-gradient(90deg,rgba(59,130,246,.24),rgba(71,215,223,.10))!important;color:#A8EDF0!important;box-shadow:inset 3px 0 #47D7DF}
html[data-theme="dark"] #pg-bahan_baku #bb-lk-comp-checklist>div:first-child,
html[data-theme="dark"] #pg-bahan_baku #bb-lk-list>div:first-child{color:#AFC1CF!important}
html[data-theme="dark"] #pg-bahan_baku input[type="number"]{background:#0A1B2D!important;color:#EAF4FA!important;border-color:rgba(132,169,205,.28)!important}
html[data-theme="dark"] #pg-bahan_baku [style*="background:#E8F5E9" i]{background:rgba(68,217,154,.10)!important;color:#81E6B7!important}
html[data-theme="dark"] #pg-bahan_baku [style*="background:#FFEBEE" i]{background:rgba(251,127,140,.10)!important;color:#FFA1AB!important}

/* WA activity: native date fields and recap cards */
html[data-theme="dark"] #pg-wa_log h2{color:#8FC1FA!important}
html[data-theme="dark"] #pg-wa_log input[type="date"],
html[data-theme="dark"] #pg-wa_log select{
  color-scheme:dark!important;background:#0D2237!important;color:#DCE7F0!important;
  border:1px solid rgba(132,169,205,.28)!important;border-radius:10px!important;min-height:40px;padding:7px 12px!important;
}
html[data-theme="dark"] #pg-wa_log input[type="date"]::-webkit-calendar-picker-indicator{filter:invert(.82) sepia(.15) saturate(.8);opacity:.85}
html[data-theme="dark"] #pg-wa_log .rk-sum-card,html[data-theme="dark"] #pg-wa_log .rk-cab-card,html[data-theme="dark"] #pg-wa_log .rk-total-item{
  background:#0E2237!important;color:#C8D6E1!important;border:1px solid rgba(132,169,205,.18)!important;box-shadow:none!important;
}
html[data-theme="dark"] #pg-wa_log .rk-sum-val,html[data-theme="dark"] #pg-wa_log .rk-section-title,html[data-theme="dark"] #pg-wa_log .rk-cab-name,html[data-theme="dark"] #pg-wa_log .rk-total-name{color:#EAF4FA!important}
html[data-theme="dark"] #pg-wa_log .wl-name{color:#E2ECF3!important}html[data-theme="dark"] #pg-wa_log .wl-sub{color:#91A6B8!important}

/* Bluetooth printer: treat receipts as paper previews */
html[data-theme="dark"] #pg-bt_printer #bt-preview,
html[data-theme="dark"] #pg-bt_printer #bt-preview-right{
  background:#F8FAFC!important;color:#17212B!important;border-color:#B8C3CD!important;
  text-shadow:none!important;box-shadow:0 14px 35px rgba(0,4,15,.22)!important;
}
html[data-theme="dark"] #pg-bt_printer #bt-preview{padding:18px!important;border-radius:12px!important}
html[data-theme="dark"] #pg-bt_printer #bt-preview-right{padding:18px 14px!important;border:1px solid #C1CBD3;border-radius:10px;min-height:280px}
html[data-theme="dark"] #pg-bt_printer #bt-preview *,html[data-theme="dark"] #pg-bt_printer #bt-preview-right *{color:inherit!important}
html[data-theme="dark"] #pg-bt_printer #bt-preview [style*="border-top"],html[data-theme="dark"] #pg-bt_printer #bt-preview-right [style*="border-top"]{border-color:#8795A1!important}
html[data-theme="dark"] #pg-bt_printer #btn-save-bt,
html[data-theme="dark"] #pg-bt_printer button[style*="background:#D9622B" i],
html[data-theme="dark"] #pg-setting button[style*="background:#E53935" i]{background:linear-gradient(135deg,#3B82F6,#2563EB)!important;color:white!important;box-shadow:0 8px 22px rgba(37,99,235,.22)}
html[data-theme="dark"] #pg-bt_printer [id$="-track"],html[data-theme="dark"] #pg-setting [id$="-track"]{background:#30475C!important}
html[data-theme="dark"] #pg-bt_printer [id$="-track"]:has(input:checked),html[data-theme="dark"] #pg-setting [id$="-track"]:has(input:checked){background:#3B82F6!important;box-shadow:0 0 0 3px rgba(59,130,246,.15)}
html[data-theme="dark"] #pg-bt_printer [style*="background:#FFF8F5" i]{background:rgba(98,168,248,.09)!important;border-color:rgba(98,168,248,.30)!important}
html[data-theme="dark"] #pg-bt_printer [style*="background:#FFF8E1" i]{background:rgba(242,189,95,.09)!important;color:#F2D28C!important}
html[data-theme="dark"] #pg-bt_printer [style*="border-top:1px solid #F0F0F0" i]{border-color:rgba(132,169,205,.18)!important}


/* =====================================================================
   v5.19 - Guaranteed contrast for native dates and runtime-generated rows
   ===================================================================== */
/* Native date fields deliberately use a light control surface for reliable readability */
.page input[type="date"]{
  color-scheme:light!important;background:#EEF3F7!important;color:#172433!important;
  -webkit-text-fill-color:#172433!important;border:1px solid #B9C8D4!important;
  min-height:40px!important;border-radius:10px!important;font-weight:650!important;
  box-shadow:inset 0 1px 2px rgba(15,23,42,.05)!important;
}
.page input[type="date"]::-webkit-datetime-edit,.page input[type="date"]::-webkit-datetime-edit-fields-wrapper,
.page input[type="date"]::-webkit-datetime-edit-day-field,.page input[type="date"]::-webkit-datetime-edit-month-field,
.page input[type="date"]::-webkit-datetime-edit-year-field{color:#172433!important;-webkit-text-fill-color:#172433!important}
.page input[type="date"]::-webkit-calendar-picker-indicator{filter:none!important;opacity:.72!important;cursor:pointer}

/* Log Penjualan */
#pg-log_penjualan h2{color:#83BCFA!important}
#pg-log_penjualan .lp-tab{color:#B9CAD8!important;background:#11273E!important;border:1px solid rgba(132,169,205,.25)!important}
#pg-log_penjualan .lp-tab.act{color:#fff!important;background:linear-gradient(135deg,#3B82F6,#2563EB)!important;border-color:#5696EF!important}
#pg-log_penjualan .lp-filters select{background:#0D2237!important;color:#E3EDF4!important;border:1px solid rgba(132,169,205,.28)!important;min-height:40px;border-radius:10px!important}

/* Absensi tabs and filter */
#pg-absensi>div:first-child{background:#0E2237!important;border:1px solid rgba(132,169,205,.18);padding:5px!important;border-radius:12px!important}
#pg-absensi .lap-tab{color:#9FB2C2!important;background:transparent!important;min-height:36px;display:flex;align-items:center;font-size:13px!important}
#pg-absensi .lap-tab:hover{color:#DCEAF4!important;background:rgba(98,168,248,.09)!important}
#pg-absensi .lap-tab.on{color:#fff!important;background:linear-gradient(135deg,#3B82F6,#2563EB)!important;box-shadow:0 7px 18px rgba(37,99,235,.20)!important}
#pg-absensi .card>div select{background:#0D2237!important;color:#E3EDF4!important;border:1px solid rgba(132,169,205,.28)!important;min-height:40px;border-radius:10px!important}
#pg-absensi button[onclick="loadAbsensi()"],#pg-absensi button[onclick="showTambahDenda()"]{background:linear-gradient(135deg,#3B82F6,#2563EB)!important;color:#fff!important}
#pg-absensi button[onclick="showTambahKaryawan()"]{background:#142B42!important;color:#D5E2EB!important;border-color:rgba(132,169,205,.28)!important}

/* Bahan Baku rows are generated with inline styles and no classes */
#pg-bahan_baku h2{color:#EAF4FA!important}
#pg-bahan_baku #bb-lk-menu-list{background:#0E2237!important;border:1px solid rgba(132,169,205,.23)!important}
#pg-bahan_baku #bb-lk-menu-list>div{
  background:#0E2237!important;color:#C8D6E1!important;border-color:rgba(132,169,205,.16)!important;
  min-height:43px;display:flex!important;align-items:center!important;padding:10px 14px!important;
}
#pg-bahan_baku #bb-lk-menu-list>div:nth-child(even){background:#10263C!important}
#pg-bahan_baku #bb-lk-menu-list>div:hover{background:rgba(59,130,246,.14)!important;color:#F0F7FB!important}
#pg-bahan_baku #bb-lk-menu-list>div[style*="background:#E8F5E9" i]{background:linear-gradient(90deg,rgba(59,130,246,.24),rgba(71,215,223,.11))!important;color:#A8EDF0!important;box-shadow:inset 3px 0 #47D7DF}
#pg-bahan_baku #bb-lk-comp-checklist>div{background:#0E2237!important;border-color:rgba(132,169,205,.16)!important;color:#C8D6E1!important;min-height:46px}
#pg-bahan_baku #bb-lk-comp-checklist>div:nth-child(even){background:#10263C!important}
#pg-bahan_baku #bb-lk-comp-checklist>div[style*="background:#f8fdf8" i]{background:rgba(68,217,154,.10)!important}
#pg-bahan_baku #bb-lk-comp-checklist label{color:#DCE8F1!important}
#pg-bahan_baku #bb-lk-comp-checklist input[type="number"]{background:#091B2D!important;color:#F0F6FA!important;-webkit-text-fill-color:#F0F6FA!important;border-color:rgba(132,169,205,.28)!important}
#pg-bahan_baku #bb-lk-list>div{background:#0E2237!important;border:1px solid rgba(132,169,205,.22)!important;color:#C8D6E1!important;box-shadow:0 8px 22px rgba(0,6,18,.12)}
#pg-bahan_baku #bb-lk-list>div>div:first-child{background:rgba(71,215,223,.09)!important;color:#91E8ED!important;border-color:rgba(132,169,205,.16)!important}
#pg-bahan_baku #bb-lk-list>div>div:not(:first-child){background:#0E2237!important;color:#C8D6E1!important;border-color:rgba(132,169,205,.14)!important}
#pg-bahan_baku #bb-lk-list>div>div:not(:first-child):nth-child(odd){background:#10263C!important}
#pg-bahan_baku #bb-lk-list>div>div:not(:first-child)>span:nth-child(2){color:#D6E2EB!important}
#pg-bahan_baku #bb-lk-list button{background:rgba(251,127,140,.11)!important;color:#FF9AA5!important;border:1px solid rgba(251,127,140,.20)!important}