:root{--bg:#090e1c;--panel:#10182a;--panel2:#141e32;--text:#f2f5fc;--muted:#8d9ab2;--line:rgba(180,196,225,.13);--blue:#7192ff;--mint:#65e0bd;--font:'DM Sans',sans-serif;--display:'Manrope',sans-serif}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;font-family:var(--font);color:var(--text);background:var(--bg);-webkit-font-smoothing:antialiased}button,input{font:inherit}button,a{-webkit-tap-highlight-color:transparent}a{color:inherit;text-decoration:none}.login-body{min-height:100vh;display:grid;place-items:center;padding:36px 22px;overflow-x:hidden;background:radial-gradient(ellipse at 10% 10%,rgba(78,99,196,.16),transparent 38%),radial-gradient(ellipse at 90% 90%,rgba(34,176,157,.10),transparent 35%),#090e1c;position:relative}.ambient{position:fixed;pointer-events:none;border-radius:50%;filter:blur(1px);opacity:.35}.ambient-one{width:280px;height:280px;border:1px solid #6e87e7;top:-130px;right:13%}.ambient-two{width:200px;height:200px;border:1px solid #48c9a9;bottom:-110px;left:8%}.login-shell{width:min(1080px,100%);min-height:650px;display:grid;grid-template-columns:1.04fr .96fr;border:1px solid rgba(177,194,231,.17);border-radius:27px;overflow:hidden;background:rgba(15,23,40,.93);box-shadow:0 35px 100px rgba(0,0,0,.38);position:relative;z-index:1}.brand-panel{padding:43px 47px 30px;background:linear-gradient(145deg,rgba(29,43,74,.98),rgba(13,23,42,.98));display:flex;flex-direction:column;position:relative;overflow:hidden}.brand-panel:after{content:"";position:absolute;width:420px;height:420px;border-radius:50%;border:1px solid rgba(126,154,240,.13);right:-210px;bottom:-180px;box-shadow:0 0 0 34px rgba(126,154,240,.025),0 0 0 70px rgba(126,154,240,.02)}.brand-lockup{display:flex;align-items:center;gap:12px;position:relative;z-index:1}.brand-mark{width:43px;height:43px;border-radius:14px;background:linear-gradient(140deg,#91a8ff,#5c75ed 58%,#35cbb4);display:grid;place-items:center;position:relative;box-shadow:0 8px 24px rgba(85,109,239,.25);flex-shrink:0}.brand-mark span{font:800 14px var(--display);letter-spacing:-1px;color:white}.brand-mark i{position:absolute;width:7px;height:7px;background:#a2ffdf;border:2px solid #526ee9;border-radius:50%;right:-2px;top:-2px}.brand-lockup strong{display:block;font:800 13px var(--display);letter-spacing:1.5px}.brand-lockup small{display:block;margin-top:4px;color:#8e9fbe;font-size:9px;letter-spacing:2.7px;font-weight:700}.brand-copy{margin:auto 0 31px;max-width:410px;z-index:1}.eyebrow{font-size:10px;letter-spacing:1.8px;font-weight:700;color:#9caed1}.brand-copy .eyebrow{display:flex;align-items:center;gap:9px}.pulse,.status-dot{width:7px;height:7px;border-radius:50%;background:var(--mint);box-shadow:0 0 0 4px rgba(101,224,189,.10);display:inline-block}.brand-copy h1{font:800 clamp(42px,5vw,59px)/1.13 var(--display);letter-spacing:-2.8px;margin:24px 0 18px}.brand-copy h1 span{background:linear-gradient(90deg,#91a8ff,#67e3c0);-webkit-background-clip:text;background-clip:text;color:transparent}.brand-copy p{font-size:14px;line-height:1.85;color:#a9b6ce;max-width:350px;margin:0}.feature-list{display:grid;gap:20px;z-index:1}.feature-item{display:flex;align-items:center;gap:14px}.feature-icon{width:39px;height:39px;border:1px solid rgba(144,165,220,.18);border-radius:12px;background:rgba(126,151,218,.08);display:grid;place-items:center;color:#a8baff;font-size:20px}.feature-item b,.feature-item small{display:block}.feature-item b{font-size:12px;font-weight:700}.feature-item small{font-size:11px;color:#8494b1;margin-top:4px}.brand-footer{font-size:9px;letter-spacing:1.4px;color:#657796;margin-top:35px;z-index:1}.brand-footer span{padding:0 7px;color:#6c89e8}.form-panel{padding:53px clamp(30px,5vw,61px) 28px;display:flex;flex-direction:column;background:rgba(12,19,33,.8)}.mobile-brand{display:none}.form-topline{display:flex;align-items:center;gap:9px;font-size:9px;letter-spacing:1.7px;color:#94a4c0;font-weight:700;margin-top:33px}.form-panel h2{font:800 30px var(--display);letter-spacing:-1px;margin:20px 0 8px}.form-subtitle{font-size:13px;color:#94a1b8;margin:0 0 32px}.form-panel form>label{display:block;font-size:11px;color:#c5cde0;font-weight:600;margin:20px 0 9px}.input-wrap{height:49px;border:1px solid #293650;background:#0b1323;border-radius:11px;display:flex;align-items:center;padding:0 13px;transition:border .2s,box-shadow .2s}.input-wrap:focus-within{border-color:#718dff;box-shadow:0 0 0 3px rgba(113,146,255,.1)}.input-icon{font-size:17px;color:#8192b4;margin-right:11px}.input-wrap input{min-width:0;flex:1;background:transparent;border:0;outline:0;color:#f4f6fc;font-size:12px}.input-wrap input::placeholder{color:#65738c}.reveal{border:0;background:transparent;color:#94a8ef;font-size:10px;font-weight:700;cursor:pointer;padding:8px}.form-options{display:flex;align-items:center;justify-content:space-between;gap:8px;margin:16px 0 25px}.remember{display:flex;align-items:center;gap:7px;color:#8d9ab1;font-size:10px}.remember input{accent-color:#8298ff;width:13px;height:13px}.admin-note{font-size:10px;color:#8da0c2}.primary-button{width:100%;height:49px;border:0;border-radius:11px;background:linear-gradient(100deg,#718cff,#6974ed);color:white;display:flex;align-items:center;justify-content:center;gap:12px;font-size:12px;font-weight:700;cursor:pointer;box-shadow:0 10px 24px rgba(87,104,222,.22);transition:transform .2s,filter .2s,box-shadow .2s}.primary-button:hover{transform:translateY(-2px);filter:brightness(1.08);box-shadow:0 13px 30px rgba(87,104,222,.32)}.primary-button:active{transform:translateY(0) scale(.99)}.primary-button:disabled{opacity:.75;cursor:wait}.button-arrow{font-size:18px;position:absolute;margin-left:245px}.form-message{min-height:18px;margin-top:12px;font-size:11px;color:#ff9ca6;line-height:1.5}.form-message.error{color:#ff9ca6}.security-note{display:flex;gap:12px;align-items:center;border:1px solid rgba(131,154,201,.14);border-radius:12px;background:rgba(117,141,192,.045);padding:13px;margin-top:auto}.security-note>span{width:30px;height:30px;display:grid;place-items:center;border-radius:9px;background:rgba(101,224,189,.1);color:var(--mint);font-size:18px}.security-note b,.security-note small{display:block}.security-note b{font-size:10px}.security-note small{font-size:9px;color:#7e8da7;margin-top:4px}.form-footer{display:flex;justify-content:space-between;gap:8px;margin-top:26px;color:#66758f;font-size:9px}.form-footer span:last-child{display:flex;align-items:center;gap:6px}.form-footer i{width:5px;height:5px;border-radius:50%;background:#5bd9b4}.spinner{width:14px;height:14px;border:2px solid rgba(255,255,255,.4);border-top-color:#fff;border-radius:50%;animation:spin .7s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}
/* Dashboard */
.dashboard-body{background:#0a0f1d;min-height:100vh}.app-layout{min-height:100vh}.sidebar{width:238px;position:fixed;inset:0 auto 0 0;background:#0d1424;border-right:1px solid var(--line);padding:25px 15px 16px;display:flex;flex-direction:column;z-index:10}.side-brand{padding:0 10px 29px}.side-brand .brand-mark{width:37px;height:37px;border-radius:12px}.side-brand strong{font-size:11px}.side-brand small{font-size:8px}.workspace-label{display:flex;justify-content:space-between;align-items:center;font-size:9px;letter-spacing:1.5px;font-weight:700;color:#687a99;padding:0 12px 13px}.workspace-label span{font-size:16px;color:#7b8ca8}.side-nav{display:grid;gap:5px}.nav-link{height:42px;display:flex;align-items:center;gap:12px;padding:0 12px;border-radius:10px;color:#8f9db5;font-size:12px;transition:background .2s,color .2s,transform .2s}.nav-link:hover{background:#151f33;color:#e7edff;transform:translateX(2px)}.nav-link.active{background:linear-gradient(100deg,rgba(111,136,255,.19),rgba(111,136,255,.07));color:#b6c5ff;border:1px solid rgba(121,145,255,.13)}.nav-icon{font-size:18px;width:20px;text-align:center}.nav-link em{font-style:normal;font-size:9px;color:#7889a7;margin-left:auto}.nav-divider{height:1px;background:var(--line);margin:12px 8px}.sidebar-bottom{margin-top:auto}.help-card{background:linear-gradient(145deg,#17233b,#111a2c);border:1px solid var(--line);border-radius:14px;padding:14px;margin-bottom:15px}.help-bubble{width:27px;height:27px;display:grid;place-items:center;background:rgba(116,145,255,.15);color:#9fb0ff;border-radius:9px;font-size:13px;margin-bottom:12px}.help-card b,.help-card small{display:block}.help-card b{font-size:11px}.help-card small{font-size:10px;color:#8291aa;line-height:1.6;margin-top:5px}.help-card a{display:flex;justify-content:space-between;margin-top:12px;font-size:10px;font-weight:700;color:#9cafff}.profile-row{display:flex;align-items:center;gap:9px;padding:13px 4px 0;border-top:1px solid var(--line)}.avatar,.top-avatar{width:31px;height:31px;display:grid;place-items:center;border-radius:10px;background:linear-gradient(135deg,#7d91ff,#4bc7b3);font-size:10px;font-weight:800;color:white}.profile-text{min-width:0;flex:1}.profile-text b,.profile-text small{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.profile-text b{font-size:10px}.profile-text small{font-size:9px;color:#7787a2;margin-top:4px}.profile-row button{border:0;background:transparent;color:#8191ad;font-size:19px;cursor:pointer}.main-content{margin-left:238px;max-width:1700px;padding:0 35px 22px}.topbar{height:69px;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid var(--line)}.breadcrumb{font-size:11px;color:#7888a5}.breadcrumb span{padding:0 9px;color:#485671}.breadcrumb b{font-weight:600;color:#d8e0f0}.top-actions{display:flex;align-items:center;gap:19px}.live-status{display:flex;align-items:center;gap:8px;font-size:10px;color:#92a1b9}.live-status i,.dashboard-footer>span:last-child i{width:6px;height:6px;border-radius:50%;background:#64d9b5;box-shadow:0 0 0 4px rgba(100,217,181,.08)}.icon-button{position:relative;border:0;background:transparent;color:#94a3bd;font-size:21px;cursor:pointer}.notification-dot{position:absolute;width:5px;height:5px;border-radius:50%;background:#ff8798;right:0;top:1px}.top-avatar{width:31px;height:31px;border-radius:50%;font-size:9px}.mobile-menu{display:none}.page-heading{display:flex;align-items:flex-end;justify-content:space-between;gap:20px;margin:29px 0 24px}.page-heading .eyebrow{font-size:9px}.page-heading h1{font:800 clamp(26px,3vw,34px) var(--display);letter-spacing:-1.4px;margin:10px 0 8px}.heading-period{color:#7b91ff}.page-heading p{font-size:11px;color:#8998b2;margin:0}.date-button{display:flex;align-items:center;gap:10px;padding:10px 13px;background:#111a2c;border:1px solid var(--line);border-radius:9px;color:#a8b5ca;font-size:10px;white-space:nowrap;cursor:pointer}.date-button span:last-child{color:#657593}.welcome-banner{height:226px;border:1px solid rgba(132,156,236,.18);border-radius:17px;overflow:hidden;position:relative;background:linear-gradient(110deg,#1a2850 0%,#182443 44%,#142d3d 100%);display:flex;justify-content:space-between}.banner-copy{padding:25px 29px;position:relative;z-index:2}.banner-label{display:flex;align-items:center;gap:8px;font-size:8px;letter-spacing:1.6px;font-weight:700;color:#a6b8ed}.banner-label span{width:6px;height:6px;border-radius:50%;background:#6ce0c1}.banner-copy h2{font:800 27px/1.18 var(--display);letter-spacing:-1px;margin:13px 0 7px}.banner-copy p{font-size:10px;color:#a0b0ce;margin:0 0 16px}.banner-link{display:inline-flex;align-items:center;gap:11px;font-size:10px;font-weight:700;color:#b9c6ff;transition:gap .2s}.banner-link:hover{gap:16px}.banner-link span{font-size:16px}.banner-orb{position:absolute;border-radius:50%;border:1px solid rgba(139,163,255,.12)}.orb-a{width:300px;height:300px;right:19%;top:-190px;box-shadow:0 0 0 28px rgba(139,163,255,.025),0 0 0 58px rgba(139,163,255,.025)}.orb-b{width:180px;height:180px;right:40%;bottom:-145px;border-color:rgba(91,224,192,.13)}.banner-graphic{width:42%;position:relative;display:grid;place-items:center;min-width:250px}.graphic-ring{position:absolute;border:1px solid rgba(137,160,249,.14);border-radius:50%;width:225px;height:225px}.ring-two{width:170px;height:170px;border-color:rgba(103,224,192,.15)}.graphic-card{width:194px;height:153px;background:linear-gradient(145deg,rgba(38,55,92,.95),rgba(17,30,51,.96));border:1px solid rgba(160,179,245,.24);border-radius:13px;box-shadow:0 20px 45px rgba(0,0,0,.2);padding:14px;transform:rotate(3deg);position:relative;z-index:1;animation:float-card 5s ease-in-out infinite}.graphic-card-icon{float:right;width:25px;height:25px;display:grid;place-items:center;background:rgba(102,222,190,.12);border-radius:8px;color:#71e2c0}.graphic-card>small{display:block;font-size:7px;letter-spacing:1.1px;color:#8da0c5;margin-top:3px}.graphic-card>strong{display:block;font:800 19px var(--display);margin-top:9px}.graphic-card>strong i{font-style:normal;color:#75dfc1;font-size:12px}.graphic-bars{display:flex;align-items:flex-end;gap:5px;height:32px;margin-top:7px;border-bottom:1px solid rgba(161,178,220,.14);padding-bottom:4px}.graphic-bars i{width:10px;border-radius:3px 3px 0 0;background:linear-gradient(#83a0ff,#5c72e3);height:40%}.graphic-bars i:nth-child(2){height:68%}.graphic-bars i:nth-child(3){height:50%}.graphic-bars i:nth-child(4){height:90%;background:linear-gradient(#7ce6ca,#35b99c)}.graphic-bars i:nth-child(5){height:62%}.graphic-bars i:nth-child(6){height:80%}.graphic-bars i:nth-child(7){height:100%;background:linear-gradient(#7ce6ca,#35b99c)}.graphic-card-foot{display:flex;justify-content:space-between;align-items:center;margin-top:8px;font-size:7px;color:#8597b9}.graphic-card-foot b{font-size:7px;color:#b4c3df}.graphic-card-foot b span{color:#6ce0bd;margin-left:3px}@keyframes float-card{0%,100%{transform:translateY(0) rotate(3deg)}50%{transform:translateY(-6px) rotate(1deg)}}.section-title{display:flex;justify-content:space-between;align-items:center;margin:28px 0 14px;gap:15px}.section-title h2{font:700 15px var(--display);margin:0}.section-title p{font-size:10px;color:#7f8ea8;margin:5px 0 0}.demo-badge{display:flex;align-items:center;gap:7px;border:1px solid rgba(255,190,104,.16);background:rgba(255,190,104,.055);border-radius:30px;padding:7px 10px;font-size:9px;color:#d7b47d;white-space:nowrap}.demo-badge i{width:5px;height:5px;border-radius:50%;background:#e6b56f}.stats-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px}.stat-card{min-height:135px;position:relative;overflow:hidden;padding:15px 16px;background:linear-gradient(145deg,#111a2c,#0f1727);border:1px solid var(--line);border-radius:13px;cursor:pointer;transition:transform .22s,border-color .22s,box-shadow .22s}.stat-card:hover{transform:translateY(-3px);border-color:rgba(128,151,255,.36);box-shadow:0 12px 24px rgba(0,0,0,.13)}.stat-top{display:flex;align-items:center;justify-content:space-between;gap:6px;color:#9ba9c0;font-size:10px}.stat-icon{width:29px;height:29px;display:grid;place-items:center;border-radius:9px;font-size:16px}.icon-purple{color:#b3a1ff;background:rgba(160,133,255,.13)}.icon-blue{color:#8cbaff;background:rgba(97,159,255,.13)}.icon-orange{color:#ffc17f;background:rgba(255,165,89,.13)}.icon-red{color:#ff9ca8;background:rgba(255,112,133,.13)}.icon-green{color:#7de3b5;background:rgba(78,220,157,.13)}.icon-teal{color:#75ded8;background:rgba(64,207,200,.13)}.icon-pink{color:#f5a6dc;background:rgba(237,121,201,.13)}.stat-value{font:800 27px var(--display);letter-spacing:-1px;margin:11px 0 5px;color:#e9eefb}.stat-bottom{display:flex;align-items:center;gap:6px;font-size:9px;color:#73829b;position:relative;z-index:1}.muted-dot{width:5px;height:5px;border-radius:50%;background:#65758f}.stat-spark{height:24px;display:flex;align-items:flex-end;gap:3px;position:absolute;right:13px;bottom:13px;opacity:.55}.stat-spark i{display:block;width:3px;border-radius:3px 3px 0 0;height:30%;background:currentColor}.stat-spark i:nth-child(2){height:55%}.stat-spark i:nth-child(3){height:42%}.stat-spark i:nth-child(4){height:80%}.stat-spark i:nth-child(5){height:62%}.stat-spark i:nth-child(6){height:92%}.stat-spark i:nth-child(7){height:70%}.spark-purple{color:#a58aff}.spark-blue{color:#79b1ff}.spark-orange{color:#ffb26d}.spark-red{color:#ff8294}.spark-green{color:#6cddb0}.spark-teal{color:#6bd6d0}.spark-pink{color:#e992d0}.stat-card-bills{grid-column:span 1}.lower-grid{display:grid;grid-template-columns:1.2fr .8fr;gap:13px;margin-top:16px}.content-card{border:1px solid var(--line);border-radius:13px;background:linear-gradient(145deg,#111a2b,#0f1726);padding:18px}.card-heading{display:flex;align-items:center;justify-content:space-between;gap:10px}.card-heading h3{font:700 13px var(--display);margin:0}.card-heading p{font-size:9px;color:#7e8da7;margin:5px 0 0}.progress-count{font-size:9px;color:#9aabca}.progress-track{height:4px;background:#202b40;border-radius:10px;margin:16px 0 8px;overflow:hidden}.progress-track span{display:block;width:0;height:100%;background:linear-gradient(90deg,#7c91ff,#65e0bd);border-radius:10px}.check-row{display:flex;align-items:center;gap:11px;padding:12px 0;border-bottom:1px solid rgba(180,196,225,.07)}.check-row:last-child{border-bottom:0}.check-empty{width:26px;height:26px;display:grid;place-items:center;border:1px solid #34415a;border-radius:8px;font-size:9px;color:#8c9dbb;flex-shrink:0}.check-row>div{min-width:0;flex:1}.check-row b,.check-row small{display:block}.check-row b{font-size:10px;font-weight:600}.check-row small{font-size:9px;color:#7788a3;margin-top:4px;line-height:1.45}.check-state{font-size:8px;color:#8796b0;white-space:nowrap}.quick-menu{font-size:15px;color:#7385a3;letter-spacing:2px}.quick-action{display:flex;align-items:center;gap:11px;padding:13px 0;border-bottom:1px solid rgba(180,196,225,.07);transition:transform .2s}.quick-action:hover{transform:translateX(3px)}.quick-icon{width:33px;height:33px;display:grid;place-items:center;border-radius:10px;font-size:17px}.quick-bill{background:rgba(126,144,255,.12);color:#9eaeff}.quick-stock{background:rgba(83,218,182,.12);color:#72e2c1}.quick-report{background:rgba(255,185,109,.12);color:#ffc181}.quick-action>span:nth-child(2){flex:1}.quick-action b,.quick-action small{display:block}.quick-action b{font-size:10px}.quick-action small{font-size:9px;color:#7787a1;margin-top:4px}.quick-arrow{color:#7688a8;font-size:15px}.notice-box{display:flex;align-items:flex-start;gap:10px;padding:12px;margin-top:15px;border:1px solid rgba(113,146,255,.12);background:rgba(113,146,255,.055);border-radius:10px}.notice-box>span{color:#a8b6ff;font-size:16px}.notice-box p{font-size:9px;color:#8494b0;line-height:1.6;margin:0}.notice-box b{color:#c8d3ee}.dashboard-footer{display:flex;justify-content:space-between;gap:10px;margin-top:22px;padding:15px 0 0;border-top:1px solid var(--line);font-size:8px;letter-spacing:1px;color:#62728e}.dashboard-footer b{color:#7289df;padding:0 5px}.dashboard-footer>span:last-child{display:flex;align-items:center;gap:8px;letter-spacing:.2px}.toast{position:fixed;bottom:25px;left:50%;transform:translate(-50%,15px);background:#1b2942;border:1px solid rgba(139,161,224,.25);border-radius:10px;padding:12px 17px;font-size:11px;color:#dce6ff;box-shadow:0 15px 40px rgba(0,0,0,.3);opacity:0;pointer-events:none;transition:opacity .2s,transform .2s;z-index:30;max-width:calc(100vw - 30px)}.toast.show{opacity:1;transform:translate(-50%,0)}.card-pulse{animation:card-pulse .35s ease}@keyframes card-pulse{50%{transform:scale(.985)}}
@media(min-width:1500px){.main-content{padding-left:48px;padding-right:48px}.stats-grid{gap:15px}.stat-card{min-height:150px;padding:18px}.welcome-banner{height:245px}}
@media(max-width:1100px){.main-content{padding-left:24px;padding-right:24px}.sidebar{width:210px}.main-content{margin-left:210px}.stats-grid{grid-template-columns:repeat(3,minmax(0,1fr))}.stat-card-bills{grid-column:span 1}.banner-graphic{min-width:215px}.brand-panel{padding:38px 32px 28px}.form-panel{padding-left:36px;padding-right:36px}}
@media(max-width:760px){.login-body{padding:16px}.login-shell{grid-template-columns:1fr;max-width:480px;min-height:0;border-radius:22px}.brand-panel{display:none}.form-panel{padding:28px 25px 23px;min-height:620px}.mobile-brand{display:flex;margin-bottom:28px}.form-topline{margin-top:10px}.form-panel h2{font-size:28px}.security-note{margin-top:30px}.form-footer{margin-top:22px}.button-arrow{margin-left:230px}.sidebar{transform:translateX(-100%);transition:transform .25s;box-shadow:20px 0 45px rgba(0,0,0,.25)}.sidebar.sidebar-open{transform:translateX(0)}.main-content{margin-left:0;padding:0 18px 20px}.topbar{height:59px}.mobile-menu{display:block;background:transparent;border:0;color:#a6b4cc;font-size:19px;cursor:pointer;margin-right:10px}.breadcrumb{margin-right:auto}.top-actions{gap:12px}.live-status{display:none}.page-heading{margin:24px 0 18px;align-items:flex-start}.page-heading h1{font-size:27px}.page-heading p{max-width:330px;line-height:1.6}.date-button{padding:9px;font-size:9px;gap:6px}.welcome-banner{height:205px}.banner-copy{padding:21px 19px}.banner-copy h2{font-size:24px}.banner-copy p{max-width:210px;line-height:1.5}.banner-graphic{min-width:120px;width:37%;opacity:.8}.graphic-card{width:143px;height:130px;padding:10px;transform:scale(.84) rotate(3deg)}.graphic-ring{width:150px;height:150px}.ring-two{width:115px;height:115px}.graphic-card>strong{font-size:16px}.graphic-bars{height:25px}.section-title{margin-top:23px}.stats-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:9px}.stat-card{min-height:126px;padding:12px}.stat-top{font-size:9px}.stat-icon{width:26px;height:26px}.stat-value{font-size:24px}.stat-bottom{font-size:8px}.stat-spark{right:9px;bottom:10px}.lower-grid{grid-template-columns:1fr;gap:11px}.content-card{padding:15px}.dashboard-footer{font-size:7px}.check-row small{max-width:230px}}
@media(max-width:410px){.main-content{padding-left:12px;padding-right:12px}.top-actions{gap:8px}.page-heading{display:block}.date-button{margin-top:14px}.banner-graphic{min-width:90px}.graphic-card{transform:scale(.68) rotate(3deg);margin-left:-18px}.banner-copy{padding:18px 14px}.banner-copy h2{font-size:22px}.banner-copy p{font-size:9px}.stats-grid{gap:7px}.stat-card{padding:10px;min-height:122px}.stat-top{font-size:8px}.stat-value{font-size:22px}.stat-bottom{font-size:7px}.demo-badge{font-size:8px;padding:6px 8px}.section-title p{max-width:235px;line-height:1.5}.form-panel{padding-left:20px;padding-right:20px}.form-options{align-items:flex-start;flex-direction:column}.button-arrow{margin-left:220px}}

/* AK Mobile POS - Inventory workspace */
.inventory-workspace {
  padding-top: 1px;
  animation: inventory-enter .22s ease;
}
@keyframes inventory-enter {
  from { opacity: 0; transform: translateY(5px); }
  to { opacity: 1; transform: translateY(0); }
}
.inventory-workspace > .page-heading {
  margin-top: 29px;
}
.inventory-workspace .primary-button {
  width: auto;
  min-width: 125px;
  padding: 0 18px;
  white-space: nowrap;
}
.inventory-card {
  min-width: 0;
  overflow: hidden;
}
.inventory-toolbar {
  display: flex;
  gap: 10px;
  margin-bottom: 16px;
}
.inventory-toolbar input,
#inventory-form input {
  min-width: 0;
  width: 100%;
  height: 42px;
  padding: 0 12px;
  border: 1px solid #293650;
  border-radius: 9px;
  background: #0b1323;
  color: #eef3ff;
  outline: none;
  font-size: 12px;
}
.inventory-toolbar input {
  flex: 1;
}
.inventory-toolbar input:focus,
#inventory-form input:focus {
  border-color: #718cff;
  box-shadow: 0 0 0 3px rgba(113,140,255,.1);
}
.inventory-toolbar button,
.inventory-form-actions button,
.inventory-row-action {
  min-height: 38px;
  padding: 0 14px;
  border: 1px solid #34415b;
  border-radius: 9px;
  background: #18243a;
  color: #dce6ff;
  font-size: 11px;
  font-weight: 600;
  cursor: pointer;
}
#inventory-form-wrap {
  margin: 16px 0 20px;
  padding: 17px;
  border: 1px solid rgba(121,145,255,.2);
  border-radius: 12px;
  background: rgba(17,27,46,.75);
}
#inventory-form {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 14px;
}
#inventory-form label {
  display: block;
  min-width: 0;
  color: #aab8d0;
  font-size: 10px;
  font-weight: 600;
}
#inventory-form label input {
  display: block;
  margin-top: 7px;
}
.inventory-form-actions {
  display: flex;
  align-items: end;
  gap: 9px;
  grid-column: 1 / -1;
}
.inventory-form-actions .primary-button {
  height: 40px;
  min-height: 40px;
}
#inventory-message {
  margin: 8px 0;
  color: #8fe3c6;
  font-size: 11px;
  line-height: 1.6;
}
#inventory-message.error {
  color: #ff9ca8;
}
.inventory-card .table-wrap {
  width: 100%;
  overflow-x: auto;
}
.inventory-card table {
  width: 100%;
  min-width: 760px;
  border-collapse: collapse;
  text-align: left;
}
.inventory-card th {
  padding: 12px 10px;
  border-bottom: 1px solid #293650;
  color: #8293b1;
  font-size: 9px;
  font-weight: 700;
  letter-spacing: .5px;
  text-transform: uppercase;
  white-space: nowrap;
}
.inventory-card td {
  padding: 13px 10px;
  border-bottom: 1px solid rgba(180,196,225,.08);
  color: #cbd6eb;
  font-size: 11px;
  white-space: nowrap;
}
.inventory-card tbody tr:hover {
  background: rgba(113,140,255,.045);
}
.inventory-card tbody tr:last-child td {
  border-bottom: 0;
}
.inventory-row-action {
  min-height: 30px;
  margin: 2px 3px 2px 0;
  padding: 0 9px;
  font-size: 10px;
}
.inventory-row-action:hover,
.inventory-toolbar button:hover {
  border-color: #718cff;
}
.inventory-stock-low {
  color: #ff9ca8 !important;
}
.inventory-stock-ok {
  color: #80e0bb !important;
}
.sales-filters {
  align-items: flex-end;
  flex-wrap: wrap;
}
.sales-filters label {
  display: grid;
  gap: 6px;
  min-width: 150px;
  color: #9ba9c0;
  font-size: 10px;
}
.sales-filters input {
  flex: 1 1 170px;
}
.sales-summary {
  margin: 18px 0;
}
.sales-summary .stat-card {
  cursor: default;
}
.sales-summary .stat-card:hover {
  transform: none;
}
.sales-table-wrap {
  overflow-x: auto;
}
.purchase-details {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 12px;
  margin-bottom: 14px;
}
.purchase-details label {
  display: grid;
  gap: 6px;
  color: #9ba9c0;
  font-size: 10px;
}
.purchase-details input,
.inventory-card td input {
  min-width: 90px;
  width: 100%;
  height: 36px;
  padding: 0 10px;
  border: 1px solid #293650;
  border-radius: 8px;
  background: #0b1323;
  color: #eef3ff;
  outline: none;
  font-size: 11px;
}
.purchase-details input:focus,
.inventory-card td input:focus {
  border-color: #718cff;
  box-shadow: 0 0 0 3px rgba(113,140,255,.1);
}
.purchase-total-row {
  justify-content: space-between;
  align-items: center;
  margin: 16px 0 24px;
}
.purchase-total-row strong {
  color: #dce5f6;
  font-size: 12px;
}
.purchase-history-heading {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin: 24px 0 12px;
}
.purchase-history-heading h3,
.inventory-card h3 {
  font: 700 13px var(--display);
}
.purchase-history-heading button {
  min-height: 34px;
  padding: 0 12px;
  border: 1px solid #34415b;
  border-radius: 8px;
  background: #121c2d;
  color: #c9d5ec;
  cursor: pointer;
}
.expense-form {
  display: grid;
  grid-template-columns: minmax(140px, 1fr) minmax(120px, 170px) minmax(180px, 1.4fr) auto;
  align-items: end;
  gap: 12px;
  margin-bottom: 16px;
}
.expense-form label {
  display: grid;
  gap: 6px;
  color: #9ba9c0;
  font-size: 10px;
}
.expense-form input {
  min-width: 0;
  width: 100%;
  height: 42px;
  padding: 0 12px;
  border: 1px solid #293650;
  border-radius: 9px;
  background: #0b1323;
  color: #eef3ff;
  outline: none;
  font-size: 12px;
}
.expense-form input:focus {
  border-color: #718cff;
  box-shadow: 0 0 0 3px rgba(113,140,255,.1);
}
.expense-form .primary-button {
  min-width: 140px;
}
.expense-summary {
  display: flex;
  justify-content: space-between;
  gap: 12px;
  margin: 16px 0;
  color: #aab8ce;
  font-size: 11px;
}
.expense-summary strong {
  color: #dce5f6;
}
.customer-form-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 12px;
  padding: 15px;
  margin-bottom: 16px;
  border: 1px solid rgba(180,196,225,.12);
  border-radius: 11px;
  background: rgba(11,19,35,.34);
}
.customer-form-grid label {
  display: grid;
  gap: 6px;
  color: #9ba9c0;
  font-size: 10px;
}
.customer-form-grid input,
.customer-form-grid textarea {
  min-width: 0;
  width: 100%;
  padding: 10px 11px;
  border: 1px solid #293650;
  border-radius: 8px;
  background: #0b1323;
  color: #eef3ff;
  outline: none;
  font-size: 11px;
}
.customer-form-grid input { height: 40px; }
.customer-form-grid textarea { resize: vertical; }
.customer-form-grid input:focus,
.customer-form-grid textarea:focus {
  border-color: #718cff;
  box-shadow: 0 0 0 3px rgba(113,140,255,.1);
}
.customer-form-actions {
  grid-column: 1 / -1;
  display: flex;
  gap: 9px;
}
.customer-form-actions .primary-button { min-width: 145px; }
.customer-form-actions button:not(.primary-button) {
  min-height: 40px;
  padding: 0 14px;
  border: 1px solid #34415b;
  border-radius: 9px;
  background: #121c2d;
  color: #c9d5ec;
  cursor: pointer;
}
.customer-long-text {
  white-space: normal !important;
  min-width: 160px;
  max-width: 260px;
}
.settings-form {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 14px;
  padding: 18px;
  border: 1px solid rgba(180,196,225,.12);
  border-radius: 11px;
  background: rgba(11,19,35,.34);
}
.settings-form label {
  display: grid;
  gap: 6px;
  color: #9ba9c0;
  font-size: 10px;
}
.settings-form input,
.settings-form textarea {
  min-width: 0;
  width: 100%;
  padding: 10px 11px;
  border: 1px solid #293650;
  border-radius: 8px;
  background: #0b1323;
  color: #eef3ff;
  outline: none;
  font-size: 11px;
}
.settings-form input { height: 42px; }
.settings-form textarea { resize: vertical; }
.settings-form input:focus,
.settings-form textarea:focus {
  border-color: #718cff;
  box-shadow: 0 0 0 3px rgba(113,140,255,.1);
}
.settings-form-actions {
  grid-column: 1 / -1;
  display: flex;
  justify-content: flex-end;
}
.settings-form-actions .primary-button { min-width: 155px; }
[hidden] {
  display: none !important;
}
@media(max-width:760px) {
  .inventory-workspace > .page-heading {
    display: flex;
    align-items: flex-start;
    gap: 10px;
  }
  .inventory-workspace .primary-button {
    min-width: 0;
    padding: 0 12px;
    font-size: 10px;
  }
  #inventory-form {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  .inventory-card {
    padding: 12px;
  }
  .expense-form {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  .customer-form-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  .settings-form {
    grid-template-columns: 1fr;
  }
}
@media(max-width:410px) {
  #inventory-form {
    grid-template-columns: 1fr;
  }
  .inventory-form-actions {
    flex-wrap: wrap;
  }
  .purchase-details {
    grid-template-columns: 1fr;
  }
  .purchase-total-row {
    align-items: stretch;
    flex-direction: column;
  }
  .expense-form {
    grid-template-columns: 1fr;
  }
  .customer-form-grid {
    grid-template-columns: 1fr;
    padding: 12px;
  }
}

/* AK Mobile POS light theme */
body.light-theme {
  --bg: #f4f7fb;
  --panel: #ffffff;
  --panel2: #f7f9fd;
  --text: #1c2940;
  --muted: #65738a;
  --line: rgba(53, 72, 105, .14);
  color: #1c2940;
  background: #f4f7fb;
}
body.light-theme.login-body {
  background: radial-gradient(ellipse at 8% 12%, rgba(107,132,226,.10), transparent 38%),
    radial-gradient(ellipse at 92% 88%, rgba(54,184,158,.08), transparent 34%), #f3f6fb;
}
body.light-theme .ambient { display: none; }
body.light-theme .login-shell {
  border-color: #dce3ef;
  background: #fff;
  box-shadow: 0 28px 75px rgba(35, 52, 82, .12);
}
body.light-theme .brand-panel {
  background: linear-gradient(145deg, #eef3ff, #e6f6f2);
  color: #1c2940;
}
body.light-theme .brand-panel:after { border-color: rgba(96,123,190,.12); }
body.light-theme .brand-lockup small { color: #65748d; }
body.light-theme .brand-copy .eyebrow,
body.light-theme .eyebrow { color: #657694; }
body.light-theme .brand-copy p { color: #52627c; }
body.light-theme .feature-icon {
  border-color: #d6dfef;
  background: rgba(255,255,255,.72);
  color: #6279ca;
}
body.light-theme .feature-item small { color: #64728a; }
body.light-theme .brand-footer { color: #76839a; }
body.light-theme .form-panel { background: #fff; }
body.light-theme .form-topline,
body.light-theme .form-subtitle { color: #697790; }
body.light-theme .form-panel form > label { color: #35435a; }
body.light-theme .input-wrap {
  background: #fff;
  border-color: #cbd5e4;
}
body.light-theme .input-wrap input { color: #1c2940; }
body.light-theme .input-wrap input::placeholder { color: #8a96a9; }
body.light-theme .input-icon { color: #71809a; }
body.light-theme .remember,
body.light-theme .form-footer { color: #697790; }
body.light-theme .admin-note { color: #5b6c85; }
body.light-theme .security-note {
  border-color: #dce5ef;
  background: #f7f9fc;
}
body.light-theme .security-note b { color: #34425a; }
body.light-theme .security-note small { color: #697790; }
body.light-theme.dashboard-body { background: #f4f7fb; }
body.light-theme .sidebar {
  background: #fff;
  border-color: #e1e6ef;
  box-shadow: 3px 0 18px rgba(34,52,82,.035);
}
body.light-theme .workspace-label { color: #77849a; }
body.light-theme .workspace-label span { color: #8793a7; }
body.light-theme .nav-link { color: #58677e; }
body.light-theme .nav-link:hover {
  background: #f1f4fa;
  color: #263752;
}
body.light-theme .nav-link.active {
  background: linear-gradient(100deg, rgba(101,126,229,.13), rgba(101,126,229,.055));
  border-color: rgba(101,126,229,.16);
  color: #4f65bf;
}
body.light-theme .nav-link em { color: #77849b; }
body.light-theme .nav-divider { background: #e8edf4; }
body.light-theme .help-card {
  background: linear-gradient(145deg, #f4f7fd, #eef4f6);
  border-color: #e2e8f1;
}
body.light-theme .help-card b { color: #2a3951; }
body.light-theme .help-card small,
body.light-theme .profile-text small { color: #718098; }
body.light-theme .profile-row { border-color: #e5eaf1; }
body.light-theme .profile-text b { color: #29384f; }
body.light-theme .profile-row button { color: #687791; }
body.light-theme .main-content { color: #1c2940; }
body.light-theme .topbar { border-color: #e1e6ef; }
body.light-theme .breadcrumb { color: #718098; }
body.light-theme .breadcrumb b { color: #34445e; }
body.light-theme .live-status { color: #5f6e84; }
body.light-theme .icon-button,
body.light-theme .mobile-menu { color: #63728a; }
body.light-theme .page-heading p { color: #64738a; }
body.light-theme .date-button {
  background: #fff;
  border-color: #dce3ed;
  color: #52627a;
  box-shadow: 0 2px 8px rgba(38,56,88,.04);
}
body.light-theme .date-button span:last-child { color: #8793a7; }
body.light-theme .welcome-banner {
  border-color: #dce5f2;
  background: linear-gradient(110deg, #edf2ff 0%, #f0f3fb 48%, #eaf6f2 100%);
}
body.light-theme .banner-label { color: #627397; }
body.light-theme .banner-copy h2 { color: #263650; }
body.light-theme .banner-copy p { color: #5c6c84; }
body.light-theme .banner-link { color: #526ac0; }
body.light-theme .graphic-ring { border-color: rgba(100,124,184,.18); }
body.light-theme .ring-two { border-color: rgba(56,164,143,.19); }
body.light-theme .graphic-card {
  background: linear-gradient(145deg, rgba(255,255,255,.98), rgba(244,248,255,.98));
  border-color: #d9e2f0;
  box-shadow: 0 18px 40px rgba(58,77,116,.13);
}
body.light-theme .graphic-card > small,
body.light-theme .graphic-card-foot { color: #74819a; }
body.light-theme .graphic-card-foot b { color: #455670; }
body.light-theme .section-title p { color: #6e7b90; }

/* Customer due collection */
.customer-due-card { margin-top: 16px; }
.customer-due-total { margin: 13px 0; font-weight: 700; }
.customer-due-payment { display: flex; align-items: center; gap: 7px; min-width: 190px; }
.customer-due-payment input { width: 110px; min-width: 0; }
.customer-due-payment button { white-space: nowrap; }
.light-theme .customer-due-payment input { background: #fff; color: #26344a; }
.extra-billing-layout { display: grid; grid-template-columns: minmax(220px, .75fr) minmax(0, 1.6fr); gap: 14px; }
.extra-categories-card, .extra-checkout-card, .extra-history-card { min-width: 0; }
.extra-category-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; margin: 13px 0; }
.extra-category-tile { min-height: 68px; padding: 10px; text-align: left; border: 1px solid #dce4ef; border-radius: 10px; background: #f7f9fc; color: #27344b; cursor: pointer; }
.extra-category-tile.selected { border-color: #7188ea; background: #edf1ff; box-shadow: 0 0 0 2px rgba(113,136,234,.12); }
.extra-category-tile strong, .extra-category-tile small { display: block; }
.extra-category-tile small { margin-top: 5px; color: #718096; font-size: 10px; }
.extra-category-actions, .extra-bill-footer, .extra-bill-footer > div { display: flex; align-items: center; gap: 8px; }
.extra-category-actions button, .extra-report-filters button { border: 1px solid #d5deea; border-radius: 8px; background: #fff; color: #31415b; padding: 8px 11px; cursor: pointer; }
.extra-category-actions button:first-child { background: #315fe7; color: #fff; }
.extra-category-actions button:last-child { color: #b42332; }
.extra-category-form { display: grid; gap: 10px; margin-top: 13px; padding-top: 13px; border-top: 1px solid #e5eaf1; }
.extra-category-form label, .extra-entry-row label, .extra-report-filters label { display: grid; gap: 5px; font-size: 11px; }
.extra-category-form > div { display: flex; gap: 8px; }
.extra-entry-row { display: flex; align-items: end; flex-wrap: wrap; gap: 10px; margin: 15px 0; }
.extra-entry-row input { width: 120px; }
.extra-bill-footer { justify-content: space-between; flex-wrap: wrap; margin-top: 14px; }
.extra-bill-footer > strong { font-size: 16px; }
.extra-history-card { margin-top: 15px; }
.extra-report-filters { display: flex; align-items: end; gap: 8px; flex-wrap: wrap; }
.extra-report-filters input { max-width: 150px; }
@media(max-width:900px) { .extra-billing-layout { grid-template-columns: 1fr; } }
@media(max-width:650px) { .extra-report-filters { margin-top: 10px; } .extra-entry-row input { width: 100%; } }
body.light-theme .demo-badge {
  border-color: rgba(185,139,72,.2);
  background: rgba(225,178,103,.1);
  color: #936d34;
}
body.light-theme .stat-card,
body.light-theme .content-card {
  background: #fff;
  border-color: #e1e7f0;
  box-shadow: 0 5px 18px rgba(37,55,87,.035);
}
body.light-theme .stat-card:hover {
  border-color: rgba(101,126,229,.36);
  box-shadow: 0 12px 24px rgba(35,53,84,.08);
}
body.light-theme .stat-top { color: #63718a; }
body.light-theme .stat-value { color: #25344c; }
body.light-theme .stat-bottom { color: #738097; }
body.light-theme .muted-dot { background: #a2adbd; }
body.light-theme .card-heading p,
body.light-theme .check-row small,
body.light-theme .quick-action small { color: #718098; }
body.light-theme .progress-count { color: #596b87; }
body.light-theme .progress-track { background: #e8edf5; }
body.light-theme .check-row { border-color: #edf0f5; }
body.light-theme .check-empty { border-color: #d5deea; color: #64738b; }
body.light-theme .check-state { color: #687790; }
body.light-theme .quick-menu,
body.light-theme .quick-arrow { color: #71809a; }
body.light-theme .quick-action { border-color: #edf0f5; }
body.light-theme .notice-box {
  border-color: rgba(101,126,229,.16);
  background: #f5f7ff;
}
body.light-theme .notice-box p { color: #64738b; }
body.light-theme .notice-box b { color: #384968; }
body.light-theme .dashboard-footer { border-color: #e1e6ef; color: #748198; }
body.light-theme .inventory-toolbar input,
body.light-theme #inventory-form input,
body.light-theme .purchase-details input,
body.light-theme .inventory-card td input,
body.light-theme .expense-form input {
  background: #fff;
  border-color: #cfd8e5;
  color: #25344b;
}
body.light-theme .inventory-toolbar input::placeholder,
body.light-theme .expense-form input::placeholder,
body.light-theme .purchase-details input::placeholder { color: #8995a8; }
body.light-theme .inventory-toolbar button,
body.light-theme .inventory-form-actions button,
body.light-theme .inventory-row-action,
body.light-theme .purchase-history-heading button {
  background: #f8faff;
  border-color: #d5deea;
  color: #465873;
}
body.light-theme .inventory-card th { border-color: #e5eaf1; color: #66748b; }
body.light-theme .inventory-card td { border-color: #edf0f5; color: #384861; }
body.light-theme .inventory-card tbody tr:hover { background: #f8faff; }
body.light-theme .inventory-card h3 { color: #2d3b52; }
body.light-theme .sales-filters label,
body.light-theme .purchase-details label,
body.light-theme .expense-form label { color: #596a83; }
body.light-theme .purchase-total-row strong,
body.light-theme .expense-summary strong { color: #2e3d55; }
body.light-theme .expense-summary { color: #697890; }
body.light-theme .customer-form-grid {
  border-color: #e1e7f0;
  background: #f8faff;
}
body.light-theme .customer-form-grid label { color: #596a83; }
body.light-theme .customer-form-grid input,
body.light-theme .customer-form-grid textarea {
  background: #fff;
  border-color: #cfd8e5;
  color: #25344b;
}
body.light-theme .customer-form-actions button:not(.primary-button) {
  background: #f8faff;
  border-color: #d5deea;
  color: #465873;
}
body.light-theme .settings-form {
  border-color: #e1e7f0;
  background: #f8faff;
}
body.light-theme .settings-form label { color: #596a83; }
body.light-theme .settings-form input,
body.light-theme .settings-form textarea {
  background: #fff;
  border-color: #cfd8e5;
  color: #25344b;
}
body.light-theme .toast {
  background: #fff;
  border-color: #dce3ed;
  color: #35445c;
  box-shadow: 0 14px 36px rgba(34,51,81,.16);
}
@media(max-width:760px) {
  body.light-theme .sidebar { box-shadow: 20px 0 45px rgba(34,52,82,.14); }
}

/* Professional dashboard typography, spacing and aligned cards */
body.dashboard-body { font-size: 15px; line-height: 1.55; }
.dashboard-body .sidebar { width: 248px; }
.dashboard-body .main-content { margin-left: 248px; padding-left: 36px; padding-right: 36px; }
.dashboard-body .side-brand strong { font-size: 13px; }
.dashboard-body .side-brand small { font-size: 9px; }
.dashboard-body .workspace-label { font-size: 11px; }
.dashboard-body .nav-link { min-height: 46px; height: auto; font-size: 14px; gap: 13px; }
.dashboard-body .nav-link em { font-size: 11px; }
.dashboard-body .help-card b { font-size: 13px; }
.dashboard-body .help-card small, .dashboard-body .help-card a { font-size: 12px; }
.dashboard-body .profile-text b { font-size: 12px; }
.dashboard-body .profile-text small { font-size: 11px; }
.dashboard-body .topbar { min-height: 72px; }
.dashboard-body .breadcrumb, .dashboard-body .live-status { font-size: 13px; }
.dashboard-body .page-heading { align-items: center; margin: 32px 0 26px; }
.dashboard-body .page-heading .eyebrow { font-size: 11px; }
.dashboard-body .page-heading h1 { font-size: clamp(30px, 3vw, 40px); line-height: 1.18; letter-spacing: -1.3px; }
.dashboard-body .page-heading p { font-size: 14px; line-height: 1.6; }
.dashboard-body .date-button { min-height: 44px; padding: 10px 14px; font-size: 13px; }
.dashboard-body .welcome-banner { min-height: 230px; height: auto; }
.dashboard-body .banner-copy { padding: 30px 32px; }
.dashboard-body .banner-label { font-size: 10px; }
.dashboard-body .banner-copy h2 { font-size: 30px; }
.dashboard-body .banner-copy p, .dashboard-body .banner-link { font-size: 13px; }
.dashboard-body .graphic-card { transform: rotate(2deg); }
.dashboard-body .section-title { align-items: center; margin: 32px 0 17px; }
.dashboard-body .section-title h2 { font-size: 20px; }
.dashboard-body .section-title p { font-size: 13px; line-height: 1.5; }
.dashboard-body .demo-badge { font-size: 11px; padding: 8px 12px; }
.dashboard-body .stats-grid { gap: 16px; align-items: stretch; }
.dashboard-body .stat-card { min-height: 150px; padding: 18px; border-radius: 15px; }
.dashboard-body .stat-top { font-size: 13px; line-height: 1.4; }
.dashboard-body .stat-icon { width: 34px; height: 34px; font-size: 18px; }
.dashboard-body .stat-value { font-size: 32px; margin: 14px 0 7px; }
.dashboard-body .stat-bottom { font-size: 11px; line-height: 1.4; }
.dashboard-body .lower-grid { gap: 16px; margin-top: 18px; }
.dashboard-body .content-card { padding: 22px; border-radius: 15px; }
.dashboard-body .card-heading h3 { font-size: 16px; }
.dashboard-body .card-heading p, .dashboard-body .progress-count { font-size: 12px; }
.dashboard-body .check-row b, .dashboard-body .quick-action b { font-size: 13px; }
.dashboard-body .check-row small, .dashboard-body .quick-action small, .dashboard-body .notice-box p { font-size: 12px; }
.dashboard-body .check-state { font-size: 11px; }
.dashboard-body .quick-action { min-height: 58px; }
.dashboard-body .inventory-workspace > .page-heading { margin-top: 32px; }
.dashboard-body .inventory-toolbar input, .dashboard-body #inventory-form input,
.dashboard-body .inventory-toolbar button, .dashboard-body .inventory-form-actions button { font-size: 14px; min-height: 44px; }
.dashboard-body .inventory-card th, .dashboard-body .inventory-card td { padding: 12px 10px; font-size: 13px; }
.dashboard-body .dashboard-footer { font-size: 10px; letter-spacing: .5px; }
@media (max-width: 1100px) {
  .dashboard-body .sidebar { width: 220px; }
  .dashboard-body .main-content { margin-left: 220px; padding-left: 24px; padding-right: 24px; }
  .dashboard-body .stats-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}
@media (max-width: 760px) {
  .dashboard-body .sidebar { width: min(300px, 86vw); }
  .dashboard-body .main-content { margin-left: 0; padding: 0 18px 22px; }
  .dashboard-body .topbar { min-height: 62px; }
  .dashboard-body .page-heading { align-items: flex-start; margin: 24px 0 20px; }
  .dashboard-body .page-heading h1 { font-size: 30px; }
  .dashboard-body .page-heading p { font-size: 14px; }
  .dashboard-body .welcome-banner { min-height: 210px; }
  .dashboard-body .banner-copy { padding: 23px 20px; }
  .dashboard-body .banner-copy h2 { font-size: 25px; }
  .dashboard-body .banner-copy p { font-size: 12px; }
  .dashboard-body .section-title { align-items: flex-start; }
  .dashboard-body .section-title h2 { font-size: 18px; }
  .dashboard-body .section-title p { font-size: 12px; }
  .dashboard-body .stats-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 11px; }
  .dashboard-body .stat-card { min-height: 140px; padding: 14px; }
  .dashboard-body .stat-top { font-size: 12px; }
  .dashboard-body .stat-value { font-size: 29px; }
  .dashboard-body .stat-bottom { max-width: 100%; font-size: 10px; }
  .dashboard-body .content-card { padding: 17px; }
  .dashboard-body .inventory-workspace > .page-heading { align-items: flex-start; }
  .dashboard-body .dashboard-footer { font-size: 9px; }
}
@media (max-width: 410px) {
  .dashboard-body .main-content { padding-left: 12px; padding-right: 12px; }
  .dashboard-body .top-actions { gap: 8px; }
  .dashboard-body .page-heading { display: block; }
  .dashboard-body .date-button { margin-top: 12px; }
  .dashboard-body .banner-graphic { min-width: 82px; }
  .dashboard-body .banner-copy { padding: 18px 14px; }
  .dashboard-body .banner-copy h2 { font-size: 22px; }
  .dashboard-body .stats-grid { gap: 8px; }
  .dashboard-body .stat-card { min-height: 136px; padding: 12px; }
  .dashboard-body .stat-top { font-size: 11px; }
  .dashboard-body .stat-value { font-size: 27px; }
  .dashboard-body .stat-bottom { font-size: 9px; }
  .dashboard-body .section-title p { max-width: 230px; }
}

/* Billing layout and stronger dashboard typography */
.dashboard-body { font-weight: 500; }
.dashboard-body h1,
.dashboard-body h2,
.dashboard-body h3,
.dashboard-body label,
.dashboard-body th,
.dashboard-body .primary-button,
.dashboard-body .sidebar a { font-weight: 700; }
.dashboard-body #billing-workspace .page-heading p { font-weight: 500; }
#billing-workspace .inventory-card { display: grid; grid-template-columns: minmax(0, 1fr); gap: 16px; }
#billing-workspace .inventory-card .inventory-toolbar:has(#billing-search) { display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: center; gap: 12px; width: 100%; }
#billing-workspace #billing-search { width: 100%; min-width: 0; }
#billing-workspace .inventory-card .inventory-toolbar:has(#billing-customer) { display: grid; grid-template-columns: minmax(180px, 1.35fr) repeat(2, minmax(130px, 1fr)) repeat(2, minmax(115px, .8fr)) auto; align-items: end; gap: 12px; width: 100%; padding-top: 16px; border-top: 1px solid var(--border, #e5eaf2); }
#billing-workspace .inventory-card .inventory-toolbar:has(#billing-customer) label { display: grid; align-content: end; gap: 7px; min-width: 0; margin: 0; font-size: 13px; line-height: 1.35; font-weight: 700; }
#billing-workspace #billing-customer,
#billing-workspace #billing-discount,
#billing-workspace #billing-paid { width: 100%; min-width: 0; min-height: 44px; box-sizing: border-box; }
#billing-workspace .inventory-card .inventory-toolbar:has(#billing-customer) > div { min-height: 44px; display: flex; flex-direction: column; justify-content: center; gap: 4px; padding: 8px 10px; border: 1px solid var(--border, #e5eaf2); border-radius: 12px; background: #f7f9fc; font-size: 13px; line-height: 1.35; }
#billing-workspace .inventory-card .inventory-toolbar:has(#billing-customer) > div strong { font-weight: 700; }
#billing-workspace #billing-save { min-height: 44px; white-space: nowrap; }
#billing-workspace #billing-print { min-height: 44px; }
#billing-workspace .table-wrap { width: 100%; max-width: 100%; overflow-x: auto; }
@media (max-width: 1100px) {
  #billing-workspace .inventory-card .inventory-toolbar:has(#billing-customer) { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  #billing-workspace .inventory-card .inventory-toolbar:has(#billing-customer) > div { min-height: 58px; }
  #billing-workspace #billing-save { min-height: 48px; }
}
@media (max-width: 640px) {
  #billing-workspace .inventory-card { gap: 14px; padding: 14px; }
  #billing-workspace .inventory-card .inventory-toolbar:has(#billing-search) { grid-template-columns: minmax(0, 1fr); }
  #billing-workspace #billing-clear,
  #billing-workspace #billing-save,
  #billing-workspace #billing-print { width: 100%; }
  #billing-workspace .inventory-card .inventory-toolbar:has(#billing-customer) { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
  #billing-workspace .inventory-card .inventory-toolbar:has(#billing-customer) label:first-child,
  #billing-workspace #billing-save { grid-column: 1 / -1; }
}
#billing-workspace .inventory-card .inventory-toolbar:has(#billing-customer) { grid-template-columns: repeat(3, minmax(0, 1fr)); }
#billing-workspace #billing-print { width: auto; min-width: 180px; justify-self: start; padding-inline: 20px; }
@media (max-width: 1100px) { #billing-workspace .inventory-card .inventory-toolbar:has(#billing-customer) { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 640px) { #billing-workspace #billing-print { width: 100%; justify-self: stretch; } }
#billing-workspace .inventory-card .inventory-toolbar:has(#billing-customer) { grid-template-columns: repeat(3, minmax(0, 1fr)); }
#billing-workspace #billing-print { width: auto; min-width: 180px; justify-self: start; padding-inline: 20px; }
@media (max-width: 1100px) { #billing-workspace .inventory-card .inventory-toolbar:has(#billing-customer) { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 640px) { #billing-workspace #billing-print { width: 100%; justify-self: stretch; } }




/* Staff accounts see only the billing workspace. API permissions are enforced server-side. */
body.staff-mode .side-nav .nav-divider,
body.staff-mode #overview > .page-heading,
body.staff-mode #overview > .welcome-banner,
body.staff-mode #overview > .section-title,
body.staff-mode #overview > .stats-grid,
body.staff-mode #overview > .lower-grid,
body.staff-mode #inventory-workspace,
body.staff-mode #extra-billing-workspace,
body.staff-mode #settings-workspace,
body.staff-mode #customers-workspace,
body.staff-mode #expenses-workspace,
body.staff-mode #purchases-workspace,
body.staff-mode #sales-workspace {
  display: none !important;
}
body.staff-mode #billing-workspace {
  display: block !important;
}


/* Responsive sidebar, billing, and inventory improvements — 2026-10-22 */
.dashboard-body .sidebar {
  box-sizing: border-box;
  height: 100vh;
  height: 100dvh;
  overflow-x: hidden;
  overflow-y: auto;
  overscroll-behavior: contain;
  scrollbar-width: thin;
  scrollbar-color: #cbd5e1 transparent;
}
.dashboard-body .sidebar::-webkit-scrollbar { width: 6px; }
.dashboard-body .sidebar::-webkit-scrollbar-thumb { background: #cbd5e1; border-radius: 8px; }
.dashboard-body .nav-link { min-height: 42px; }
.dashboard-body .sidebar #logout-button { flex-shrink: 0; }

/* Low laptop screens: keep navigation compact and let the sidebar scroll. */
@media (min-width: 761px) and (max-height: 850px) {
  .dashboard-body .sidebar { width: 224px; padding-top: 14px; padding-bottom: 10px; }
  .dashboard-body .main-content { margin-left: 224px; }
  .dashboard-body .sidebar strong { font-size: 12px; }
  .dashboard-body .side-nav { gap: 3px; }
  .dashboard-body .nav-link { min-height: 38px; padding-top: 7px; padding-bottom: 7px; font-size: 13px; gap: 10px; }
  .dashboard-body .nav-link em { font-size: 10px; }
}
@media (min-width: 761px) and (max-height: 700px) {
  .dashboard-body .sidebar { width: 212px; padding: 10px 12px 8px; }
  .dashboard-body .main-content { margin-left: 212px; }
  .dashboard-body .sidebar strong { font-size: 11px; }
  .dashboard-body .nav-link { min-height: 34px; padding-top: 5px; padding-bottom: 5px; font-size: 12px; }
}

/* Compact, readable billing tables and aligned controls. */
#billing-workspace > .page-heading { margin-bottom: 12px; }
#billing-workspace .inventory-card { gap: 14px; padding: 18px; }
#billing-workspace .inventory-toolbar { margin-bottom: 8px; }
#billing-workspace .table-wrap, #inventory-workspace .table-wrap {
  max-width: 100%; overflow-x: auto; overscroll-behavior-x: contain;
  border: 1px solid #dce5f0; border-radius: 11px;
}
#billing-workspace .table-wrap table, #inventory-workspace .table-wrap table {
  width: 100%; border-collapse: separate; border-spacing: 0;
}
#billing-workspace .table-wrap th, #inventory-workspace .table-wrap th {
  background: #edf4ff; color: #244675; font-size: 11px; font-weight: 750;
  letter-spacing: .045em; text-transform: uppercase; border-bottom: 1px solid #d5e1f0;
}
#billing-workspace .table-wrap th, #billing-workspace .table-wrap td,
#inventory-workspace .table-wrap th, #inventory-workspace .table-wrap td {
  padding: 10px 12px; border-bottom: 1px solid #e8edf4; vertical-align: middle;
}
#billing-workspace .table-wrap tbody tr:nth-child(even),
#inventory-workspace .table-wrap tbody tr:nth-child(even) { background: #f8fafc; }
#billing-workspace .table-wrap tbody tr:last-child td,
#inventory-workspace .table-wrap tbody tr:last-child td { border-bottom: 0; }
#billing-workspace #billing-search-results { min-width: 520px; }
#billing-workspace #billing-cart { min-width: 620px; }
#billing-workspace #billing-total { color: #155e3b; font-size: 1.15em; font-weight: 800; }

/* Inventory forms, barcode field, and stock status. */
#inventory-workspace > .page-heading { margin-bottom: 14px; }
#inventory-workspace .inventory-card { gap: 14px; padding: 18px; border-color: #d9e4f2; }
#inventory-workspace #inventory-form-wrap {
  padding: 16px; border: 1px solid #d9e7f7; border-radius: 12px;
  background: linear-gradient(145deg, #f4f8ff, #f5fbf8);
}
#inventory-workspace #inventory-form {
  display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px;
}
#inventory-workspace #inventory-form label {
  display: grid; align-content: start; gap: 6px; min-width: 0;
  color: #334155; font-size: 12px; font-weight: 700;
}
#inventory-workspace #inventory-form input {
  box-sizing: border-box; width: 100%; min-width: 0; min-height: 42px;
  padding: 0 11px; border: 1px solid #cbd7e5; border-radius: 9px;
  background: #fff; color: #172b4d; font: inherit;
}
#inventory-workspace #inventory-form input:focus { outline: 3px solid #dbeafe; border-color: #3b82f6; }
#inventory-workspace .inventory-form-actions { grid-column: 1 / -1; display: flex; gap: 10px; flex-wrap: wrap; }
#inventory-workspace .inventory-form-actions button { min-height: 42px; }
#inventory-workspace .inventory-stock-ok { color: #17613d; background: #eaf8f0; font-weight: 750; }
#inventory-workspace .inventory-stock-low { color: #9a4d00; background: #fff3df; font-weight: 750; }
#inventory-workspace .inventory-stock-out { color: #a32626; background: #fff0f0; font-weight: 800; }
#inventory-workspace #inventory-table-body td:nth-child(2) { color: #315c9b; font-variant-numeric: tabular-nums; }
#inventory-workspace #inventory-table-body td:nth-child(4),
#inventory-workspace #inventory-table-body td:nth-child(5),
#billing-workspace .table-wrap td { font-variant-numeric: tabular-nums; }

@media (max-width: 760px) {
  #billing-workspace .inventory-card, #inventory-workspace .inventory-card { padding: 14px; gap: 12px; }
  #inventory-workspace #inventory-form { grid-template-columns: minmax(0, 1fr); gap: 10px; }
  #inventory-workspace .inventory-form-actions { grid-column: auto; }
}
@media (max-width: 410px) {
  #billing-workspace .inventory-card, #inventory-workspace .inventory-card { padding: 12px; }
  #inventory-workspace #inventory-form-wrap { padding: 12px; }
}

/* Compact checkout and workspace sizing — 2026-10-22 */
.dashboard-body .inventory-workspace > .page-heading { margin: 10px 0 12px; }
.dashboard-body .inventory-workspace > .page-heading h1 { font-size: 27px; line-height: 1.2; }
.dashboard-body .inventory-workspace > .page-heading p { margin-top: 4px; font-size: 13px; }
.dashboard-body .inventory-workspace > .page-heading .eyebrow { font-size: 10px; }
.dashboard-body .inventory-workspace .content-card { padding: 15px; }
.dashboard-body .inventory-workspace .card-heading { margin-bottom: 10px; }
.dashboard-body .inventory-workspace .card-heading h3,
.dashboard-body .inventory-workspace h3 { font-size: 16px; }
.dashboard-body .inventory-workspace .inventory-toolbar { gap: 8px; margin-bottom: 8px; }
.dashboard-body .inventory-workspace label { gap: 4px; font-size: 12px; }
.dashboard-body .inventory-workspace input,
.dashboard-body .inventory-workspace select { min-height: 38px; padding: 8px 10px; font-size: 13px; }
.dashboard-body .inventory-workspace button { min-height: 36px; padding: 8px 12px; font-size: 13px; }
.dashboard-body .inventory-workspace .table-wrap { margin: 6px 0; }
.dashboard-body .inventory-workspace th,
.dashboard-body .inventory-workspace td { padding: 8px 9px; font-size: 12px; }
#billing-workspace .inventory-card { display: grid; grid-template-columns: minmax(260px, .92fr) minmax(360px, 1.08fr); gap: 7px 14px; align-items: start; }
#billing-workspace .inventory-card > .inventory-toolbar:has(#billing-search),
#billing-workspace #billing-message,
#billing-workspace .table-wrap:has(#billing-search-results) { grid-column: 1; }
#billing-workspace .inventory-card > h3,
#billing-workspace .table-wrap:has(#billing-cart),
#billing-workspace .inventory-toolbar:has(#billing-customer),
#billing-workspace #billing-receipt,
#billing-workspace #billing-print { grid-column: 2; }
#billing-workspace .inventory-card > h3 { grid-row: 1; margin: 0; align-self: end; }
#billing-workspace .table-wrap:has(#billing-search-results) { max-height: 210px; overflow: auto; }
#billing-workspace .table-wrap:has(#billing-cart) { max-height: 270px; overflow: auto; }
#billing-workspace .inventory-toolbar:has(#billing-customer) { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); align-items: end; gap: 8px; }
#billing-workspace .inventory-toolbar:has(#billing-customer) > div { align-self: center; font-size: 13px; }
#billing-workspace #billing-save { grid-column: 1 / -1; }
#extra-billing-workspace .extra-billing-layout { gap: 10px; grid-template-columns: minmax(215px, .72fr) minmax(0, 1.6fr); }
#extra-billing-workspace .extra-entry-row { gap: 8px; margin: 9px 0; }
#extra-billing-workspace .extra-entry-row label { flex: 1 1 120px; }
#extra-billing-workspace .extra-entry-row input { width: 100%; }
#extra-billing-workspace .extra-category-grid { gap: 8px; }
#extra-billing-workspace .extra-category-actions { gap: 6px; margin-top: 8px; }
#extra-billing-workspace .extra-bill-footer { gap: 8px; margin-top: 8px; }
@media (max-width: 1050px) {
  #billing-workspace .inventory-card { grid-template-columns: minmax(0, 1fr); }
  #billing-workspace .inventory-card > *, #billing-workspace .inventory-card > h3 { grid-column: 1; }
  #billing-workspace .inventory-card > h3 { grid-row: auto; }
  #billing-workspace .table-wrap:has(#billing-search-results), #billing-workspace .table-wrap:has(#billing-cart) { max-height: 180px; }
}
@media (max-height: 760px) and (min-width: 1051px) {
  #billing-workspace .table-wrap:has(#billing-search-results) { max-height: 145px; }
  #billing-workspace .table-wrap:has(#billing-cart) { max-height: 190px; }
  #billing-workspace .inventory-card { gap: 5px 12px; }
}
@media (max-width: 760px) {
  .dashboard-body .inventory-workspace > .page-heading { margin: 12px 0 10px; }
  .dashboard-body .inventory-workspace > .page-heading h1 { font-size: 24px; }
  .dashboard-body .inventory-workspace .content-card { padding: 12px; }
  #billing-workspace .inventory-toolbar:has(#billing-customer) { grid-template-columns: 1fr 1fr; }
  #extra-billing-workspace .extra-billing-layout { grid-template-columns: minmax(0, 1fr); }
}
@media (max-width: 1350px) {
  #billing-workspace .inventory-card { grid-template-columns: minmax(0, 1fr); }
  #billing-workspace .inventory-card > *, #billing-workspace .inventory-card > h3 { grid-column: 1; }
  #billing-workspace .inventory-card > h3 { grid-row: auto; }
  #billing-workspace .table-wrap:has(#billing-search-results),
  #billing-workspace .table-wrap:has(#billing-cart) { max-height: 170px; }
}
@media (max-width: 1350px) {
  #billing-workspace .inventory-card > .inventory-toolbar:has(#billing-search),
  #billing-workspace #billing-message,
  #billing-workspace .table-wrap:has(#billing-search-results),
  #billing-workspace .inventory-card > h3,
  #billing-workspace .table-wrap:has(#billing-cart),
  #billing-workspace .inventory-toolbar:has(#billing-customer),
  #billing-workspace #billing-receipt,
  #billing-workspace #billing-print { grid-column: 1; width: 100%; min-width: 0; }
  #billing-workspace .inventory-toolbar:has(#billing-search) { width: 100%; }
}
