/* ZimBiz Pro UI */
#dashboardScreen main{padding-bottom:96px}
.pro-top{display:flex;align-items:center;gap:12px}
.burger{width:46px;height:46px;border-radius:14px;background:var(--navy);display:flex;flex-direction:column;justify-content:center;align-items:center;gap:5px;flex:none}
.burger span{width:22px;height:2.5px;background:#fff;border-radius:2px;transition:.3s}
body.nav-open .burger span:nth-child(1){transform:translateY(7.5px) rotate(45deg)}
body.nav-open .burger span:nth-child(2){opacity:0}
body.nav-open .burger span:nth-child(3){transform:translateY(-7.5px) rotate(-45deg)}
.pro-top .sync{margin-left:auto}
#scrim{position:fixed;inset:0;background:rgba(8,20,40,.5);opacity:0;pointer-events:none;transition:opacity .3s;z-index:70}
body.nav-open #scrim{opacity:1;pointer-events:auto}
#drawer{position:fixed;top:0;bottom:0;left:0;width:80%;max-width:310px;background:#fff;z-index:80;padding:22px 14px;transform:translateX(-105%);transition:transform .35s cubic-bezier(.2,.8,.2,1);box-shadow:8px 0 40px rgba(11,31,58,.25);overflow-y:auto}
body.nav-open #drawer{transform:none}
.drawer-head{padding:6px 10px 18px;border-bottom:1px solid var(--line);margin-bottom:12px}
.nav-item{display:flex;align-items:center;gap:14px;width:100%;padding:15px 14px;margin-bottom:6px;border-radius:15px;background:transparent;color:var(--ink);font-size:17px;font-weight:700;text-align:left;transition:.2s}
.nav-item .icon{width:24px;height:24px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.nav-item.active{background:var(--navy);color:#fff}
.tab{display:none}.tab.active{display:block;animation:tin .3s ease}
@keyframes tin{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:none}}
.tt{margin:6px 0 12px;font-size:22px}.sec{margin:12px 0 8px;font-size:15px}
#dashboardScreen .card{padding:13px 14px;margin:0 0 10px}
#dashboardScreen .card h3{margin:0 0 8px;font-size:15px}
#dashboardScreen .hero-row h1{font-size:22px;margin:4px 0}
#dashboardScreen .stats{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-bottom:6px}
#dashboardScreen .stat{padding:10px 12px;border-radius:14px}
#dashboardScreen .stat strong{font-size:19px}#dashboardScreen .stat small{font-size:11.5px}
.qa{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin-bottom:12px}.qa.two{grid-template-columns:1fr 1fr}
#dashboardScreen .qa button{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:5px;min-height:74px;padding:8px 4px;border-radius:16px;background:var(--navy3);color:var(--navy);font-size:12.5px;font-weight:800;line-height:1.15;text-align:center;transition:transform .15s,background .2s}
#dashboardScreen .qa button:active{transform:scale(.95)}
#dashboardScreen .qa .button-icon{width:23px;height:23px}
#dashboardScreen button,#dashboardScreen input,#dashboardScreen select{min-height:46px}
#dashboardScreen .row{padding:9px 0}
label{display:block;font-size:13px;font-weight:700;margin:8px 0 3px}
.two{display:grid;grid-template-columns:1fr 1fr;gap:8px}
.wide{width:100%;margin-top:8px}.danger-btn{background:#c62828;color:#fff;border-radius:12px;font-weight:800}
.seg{display:flex;gap:4px;padding:4px;background:var(--navy3);border-radius:14px;margin-bottom:10px}
.seg button{flex:1;border-radius:11px;background:transparent;color:var(--navy);font-weight:800}
.seg button.on,.seg button.active{background:var(--navy);color:#fff}
.sw{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:8px 0;font-size:15px}
.sw input{width:50px;height:28px;min-height:0!important;appearance:none;-webkit-appearance:none;background:#c7d2df;border-radius:20px;position:relative;transition:.25s;flex:none;border:0;padding:0}
.sw input:after{content:"";position:absolute;top:3px;left:3px;width:22px;height:22px;border-radius:50%;background:#fff;transition:.25s}
.sw input:checked{background:#1b9a5a}.sw input:checked:after{left:25px}
#fab{position:fixed;right:16px;bottom:calc(18px + env(safe-area-inset-bottom,0px));z-index:60;display:flex;align-items:center;gap:8px;padding:0 20px;height:54px;border-radius:30px;background:linear-gradient(135deg,#0b1f3a,#1d6fb8);color:#fff;font-weight:800;font-size:16px;box-shadow:0 10px 28px rgba(11,31,58,.38);animation:fabin .5s cubic-bezier(.2,1.4,.4,1),pulse 2.8s 1s infinite;transition:transform .2s}
#fab:active{transform:scale(.92)}#fab svg{width:22px;height:22px;stroke:#fff;fill:none;stroke-width:2}
body.nav-open #fab{opacity:0;pointer-events:none}
@keyframes fabin{from{transform:scale(0) rotate(-90deg)}to{transform:none}}
@keyframes pulse{0%,100%{box-shadow:0 10px 28px rgba(11,31,58,.38)}50%{box-shadow:0 10px 28px rgba(11,31,58,.38),0 0 0 9px rgba(29,111,184,.16)}}
.note{padding:9px 11px;margin-bottom:6px;border-radius:12px;background:var(--navy3);font-size:14px;animation:tin .3s}
.alert{padding:10px 12px;border-radius:12px;margin-bottom:6px;font-weight:700;font-size:14px}
.alert.bad{background:#fde8e8;color:#9b1c1c}.alert.warn{background:#fff4d6;color:#7a5200}.alert.ok{background:#e3f6ea;color:#14663a}
.gain{color:#14804a;font-style:normal}.loss{color:#c62828;font-style:normal}
.qty{display:flex;align-items:center;gap:8px}.adj,.paid,.call{padding:0 12px;min-height:38px!important;border-radius:10px;background:var(--navy);color:#fff;font-weight:800;font-size:13px;display:inline-flex;align-items:center}
.paid{background:#1b9a5a}
.health{display:flex;align-items:center;gap:14px}
.ring{--p:0;width:86px;height:86px;border-radius:50%;flex:none;display:grid;place-content:center;text-align:center;background:radial-gradient(circle,#fff 56%,transparent 57%),conic-gradient(#1b9a5a calc(var(--p)*1%),#e3ebf4 0)}
.ring b{font-size:26px;line-height:1;color:var(--navy)}
.bar{display:flex;align-items:center;gap:10px;font-size:13px;margin:7px 0}.bar span{width:46%}.bar i{flex:1;height:9px;border-radius:6px;background:#e3ebf4;overflow:hidden}.bar u{display:block;height:100%;background:linear-gradient(90deg,#1d6fb8,#1b9a5a);border-radius:6px;transition:width .8s}
.scrollx{overflow-x:auto}.mini{width:100%;border-collapse:collapse;font-size:13px}.mini th,.mini td{padding:7px 4px;text-align:right;border-bottom:1px solid var(--line)}.mini th:first-child,.mini td:first-child{text-align:left}
.spark{display:flex;align-items:flex-end;gap:6px;height:70px;margin-bottom:6px}.spark i{flex:1;background:linear-gradient(180deg,#1d6fb8,#0b1f3a);border-radius:5px 5px 2px 2px;transition:height .6s}
.rc{text-align:center;padding:6px}.rc hr{border:0;border-top:1px dashed #aab6c5;margin:10px 0}.rc p{margin:5px 0}.rc .tot{font-size:22px;font-weight:800}
.modal-card{animation:tin .25s}
html[data-large="1"] #dashboardScreen main,html[data-large="1"] #drawer{zoom:1.14}
/* dark theme */
html[data-theme=dark] body{background:#0d1522;color:#e8eef7}
html[data-theme=dark] body:before{display:none}
html[data-theme=dark] :is(.card,.stat,.modal-card,#drawer,.topbar,.auth-card,.mini-card,.glass){background:#162235!important;border-color:#25354d!important;color:#e8eef7!important}
html[data-theme=dark] :is(input,select){background:#0f1a2a!important;color:#e8eef7!important;border-color:#2a3b55!important}
html[data-theme=dark] :is(h1,h2,h3,.logo,.nav-item,.ring b){color:#fff}
html[data-theme=dark] :is(.muted,small,label){color:#9fb0c6!important}
html[data-theme=dark] :is(.row,.mini th,.mini td,.drawer-head){border-color:#25354d!important}
html[data-theme=dark] :is(.qa button,.seg,.note){background:#1d2f49!important;color:#e8eef7!important}
html[data-theme=dark] .seg button{color:#e8eef7}html[data-theme=dark] .seg button.on,html[data-theme=dark] .seg button.active,html[data-theme=dark] .nav-item.active{background:#2f6fb5!important;color:#fff!important}
html[data-theme=dark] .ring{background:radial-gradient(circle,#162235 56%,transparent 57%),conic-gradient(#1b9a5a calc(var(--p)*1%),#25354d 0)}
html[data-theme=dark] .ring b{color:#fff}
html[data-theme=dark] .rc{color:#e8eef7}
