@import url('https://fonts.googleapis.com/css2?family=Manrope:wght@400;500;600;700;800&display=swap');
:root{--ink:#17213b;--muted:#73809a;--line:#e6eaf1;--blue:#3157e8;--green:#13a575;--nav:#111a35;--bg:#f5f7fb;--white:#fff;--shadow:0 10px 32px rgba(27,39,77,.07)}*{box-sizing:border-box}body{margin:0;background:var(--bg);color:var(--ink);font:14px/1.5 Manrope,Arial,sans-serif}.sidebar{position:fixed;inset:0 auto 0 0;width:252px;background:var(--nav);color:#fff;padding:24px 17px;display:flex;flex-direction:column;z-index:5}.brand{display:flex;align-items:center;gap:12px;padding:0 9px 25px}.logo{width:36px;height:36px;border-radius:11px;display:grid;place-items:center;background:linear-gradient(145deg,#56d4bc,#3455e9);font-weight:800;color:#fff;box-shadow:0 7px 18px #183c9970}.logo.large{width:52px;height:52px;font-size:23px;margin-bottom:20px}.brand strong{display:block;letter-spacing:1.7px;font-size:17px}.brand small,.sidebar-foot small{display:block;color:#8490aa;font-size:10px}.sidebar nav{flex:1}.sidebar nav p{font-size:10px;color:#66728f;margin:25px 11px 8px;letter-spacing:1.4px}.sidebar nav a{display:flex;gap:14px;align-items:center;color:#aeb8cd;text-decoration:none;padding:11px 13px;border-radius:10px;margin:3px 0;font-weight:600}.sidebar nav a:hover,.sidebar nav a.active{color:#fff;background:#273353}.sidebar-foot{border-top:1px solid #293451;padding:20px 7px 0;display:flex;gap:10px;align-items:center;overflow:hidden}.sidebar-foot b{font-size:12px}.avatar{width:34px;height:34px;display:grid;place-items:center;background:#3d5ce8;border-radius:50%;font-weight:800}main{margin-left:252px;min-height:100vh}header{height:72px;background:#fff;border-bottom:1px solid var(--line);display:flex;align-items:center;padding:0 32px;position:sticky;top:0;z-index:3}#menu{border:0;background:none;font-size:20px;display:none}.search{background:#f6f7fa;border:1px solid #edf0f5;border-radius:10px;padding:9px 14px;width:min(430px,40vw);color:#8b95aa}.search input{border:0;background:transparent;outline:none;width:90%;margin-left:8px;font:inherit}.head-actions{margin-left:auto;display:flex;align-items:center;gap:9px;color:var(--muted);font-size:12px}.head-actions form{margin:0}.icon,.logout{border:0;background:none;color:inherit;font:inherit;cursor:pointer}.status-dot{width:7px;height:7px;background:#19bd83;border-radius:50%}.content{padding:32px;max-width:1600px;margin:auto}.page-title{display:flex;align-items:flex-start;justify-content:space-between;margin-bottom:25px}.page-title h1{font-size:28px;margin:4px 0}.page-title p,.panel p{color:var(--muted);margin:0}.eyebrow{color:var(--blue);font-size:10px;font-weight:800;letter-spacing:1.5px}.btn{border:1px solid var(--line);background:#fff;border-radius:9px;padding:10px 16px;font:600 13px Manrope;color:var(--ink);text-decoration:none;cursor:pointer}.btn.primary{background:var(--blue);border-color:var(--blue);color:#fff;box-shadow:0 5px 15px #3157e833}.full{width:100%}.metrics{display:grid;grid-template-columns:repeat(4,1fr);gap:16px;margin-bottom:20px}.metrics.mini{grid-template-columns:repeat(2,minmax(220px,320px))}.metrics article,.panel{background:#fff;border:1px solid var(--line);border-radius:14px;padding:20px;box-shadow:var(--shadow)}.metrics span{display:block;color:var(--muted);font-size:12px}.metrics b{font-size:24px;display:block;margin:8px 0}.metrics small{color:var(--muted)}.up{color:var(--green)!important}.warn{color:#e08728!important}.grid-2{display:grid;grid-template-columns:1.4fr 1fr;gap:20px;margin-bottom:20px}.panel{margin-bottom:20px}.panel h3{margin:0 0 4px}.panel-head{display:flex;justify-content:space-between;align-items:center;margin-bottom:18px}.panel-head a{color:var(--blue);text-decoration:none;font-weight:700}.pill,.tag,.status,.stock{display:inline-block;border-radius:20px;padding:4px 9px;background:#f0f3f8;font-size:11px;font-weight:700;white-space:nowrap}.tag.in{background:#eaf0ff;color:#3157e8}.tag.out,.tag.receipt{background:#e7f8f2;color:#07855c}.status.verified,.status.completed{background:#e5f8f0;color:#07855c}.status.draft,.status.warning{background:#fff4df;color:#a96806}.status.danger,.stock.low,.status.failed{background:#ffebed;color:#c73745}.table-wrap{overflow:auto}table{width:100%;border-collapse:collapse;min-width:850px}th{text-transform:uppercase;letter-spacing:.5px;color:#7e899e;font-size:10px;text-align:left;background:#f8f9fb}th,td{border-bottom:1px solid var(--line);padding:12px 10px;vertical-align:middle}td{font-size:12px}td a{color:var(--blue);text-decoration:none}.num{text-align:right}.empty{text-align:center;color:var(--muted);padding:38px}.filters{display:flex;gap:10px;background:#fff;border:1px solid var(--line);padding:13px;border-radius:13px;margin-bottom:16px}.filters input,.filters select,.upload-card select,.upload-card input,.login-card input{border:1px solid var(--line);border-radius:9px;padding:11px 13px;background:#fff;font:inherit;outline:none}.filters input{flex:1}.chart{height:180px;margin-top:10px}.bars{height:140px;display:flex;align-items:end;gap:11px;border-bottom:1px solid var(--line);background:repeating-linear-gradient(to top,#f0f2f7 0,#f0f2f7 1px,transparent 1px,transparent 35px)}.bars i{height:var(--h);width:26px;border-radius:5px 5px 0 0;background:linear-gradient(#6b83ed,#3157e8);opacity:.85}.chart-legend{display:flex;gap:15px;margin-top:12px;color:var(--muted);font-size:11px}.chart-legend i{display:inline-block;width:7px;height:7px;border-radius:50%;margin-right:5px}.green{background:#13a575}.blue{background:#3157e8}.focus{position:relative;overflow:hidden;background:linear-gradient(145deg,#17213b,#263463);color:#fff}.focus p{max-width:65%;color:#bdc7da}.focus a{display:inline-block;color:#7fe3c6;margin-top:24px;text-decoration:none}.ring{position:absolute;right:28px;bottom:32px;border:10px solid #445377;border-top-color:#54d1ae;width:105px;height:105px;border-radius:50%;display:grid;place-content:center;text-align:center}.ring b{font-size:26px}.ring small{color:#b8c2d7}.upload-card{text-align:center;padding:35px}.upload-card select,.upload-card input{width:100%;display:block;margin:15px 0;text-align:left}.upload-icon{font-size:35px;color:var(--blue);background:#edf1ff;width:70px;height:70px;border-radius:22px;display:grid;place-items:center;margin:auto}.smart-list ul{padding:0;list-style:none}.smart-list li{padding:14px 0;border-bottom:1px solid var(--line)}.smart-list li b,.smart-list li span{display:block}.smart-list li span{color:var(--muted);font-size:12px;margin-top:3px}.totals>div{display:flex;justify-content:space-between;padding:12px 0;border-bottom:1px solid var(--line)}.totals .grand{font-size:18px;color:var(--blue)}.detail-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:15px}.detail-grid span{color:var(--muted);font-size:11px}.detail-grid b{display:block;color:var(--ink);margin-top:5px;word-break:break-all}.rank{display:flex;justify-content:space-between;border-bottom:1px solid var(--line);padding:9px 0}.pagination{display:flex;justify-content:center;gap:15px;padding-top:18px}.pagination a{text-decoration:none;color:var(--blue)}.toast{padding:12px 16px;border-radius:9px;background:#e5f8f0;color:#087657;margin-bottom:15px}.toast.error{background:#ffebed;color:#aa2636}.login-page{min-height:100vh;display:grid;grid-template-columns:1.2fr 1fr;background:#fff}.login-visual{position:relative;overflow:hidden;background:linear-gradient(145deg,#101a36 0%,#1d2d61 55%,#24468a);color:#fff;padding:70px;display:flex;align-items:end}.login-copy{position:relative;z-index:2;max-width:580px}.login-copy span{font-size:11px;letter-spacing:3px;color:#7fe3c6}.login-copy h1{font-size:64px;line-height:1.05;margin:20px 0}.login-copy p{color:#b7c4dc;font-size:16px}.orb{position:absolute;width:500px;height:500px;border-radius:50%;background:radial-gradient(circle at 35% 30%,#63e0c4,#3157e8 45%,transparent 70%);top:-100px;right:-90px;filter:blur(5px);opacity:.75}.login-card{width:min(390px,80%);margin:auto}.login-card h2{font-size:28px;margin-bottom:4px}.login-card>p{color:var(--muted);margin-bottom:28px}.login-card label{display:block;font-size:12px;font-weight:700;margin:14px 0 6px}.login-card input{width:100%}.login-card button{margin:20px 0 14px}.login-card small{color:var(--muted)}.form-error{background:#ffebed;color:#ad3040;padding:10px;border-radius:8px}
@media(max-width:1000px){.sidebar{width:78px}.sidebar span,.sidebar p,.brand div,.sidebar-foot div:not(.avatar){display:none}main{margin-left:78px}.metrics{grid-template-columns:repeat(2,1fr)}.grid-2{grid-template-columns:1fr}.detail-grid{grid-template-columns:repeat(2,1fr)}}@media(max-width:680px){.sidebar{transform:translateX(-100%);transition:.2s}.sidebar.open{transform:none;width:252px}.sidebar.open span,.sidebar.open p,.sidebar.open .brand div,.sidebar.open .sidebar-foot div{display:block}main{margin:0}#menu{display:block}.content{padding:20px 14px}.search{display:none}.metrics,.metrics.mini{grid-template-columns:1fr}.page-title{gap:15px}.page-title h1{font-size:23px}.filters{flex-direction:column}.login-page{display:block;background:var(--bg)}.login-visual{min-height:280px;padding:35px}.login-copy h1{font-size:42px}.login-card{background:#fff;margin:-25px auto 30px;position:relative;padding:28px;border-radius:16px;box-shadow:var(--shadow)}}
.data-form{max-width:900px}.data-form .field{display:grid;grid-template-columns:220px 1fr;gap:15px;align-items:center;padding:10px 0;border-bottom:1px solid var(--line)}.data-form label{font-weight:700}.form-control{width:100%;border:1px solid var(--line);border-radius:9px;padding:11px 13px;background:#fff;font:inherit}.form-actions{display:flex;justify-content:flex-end;gap:10px;padding-top:20px}@media(max-width:680px){.data-form .field{grid-template-columns:1fr;gap:5px}}
.brand-logo{width:48px;height:48px;object-fit:contain;background:#fff;border-radius:12px;padding:3px}.actions{display:flex;gap:9px;flex-wrap:wrap}.danger-link{color:#d92d20!important;border:0;background:none;cursor:pointer;text-decoration:none}.danger-btn{background:#d92d20;color:#fff;border-color:#d92d20}.delete-box{max-width:650px}.dashboard-grid{grid-template-columns:1.6fr 1fr}.dashboard-grid canvas{width:100%;height:260px}.donut-wrap{display:grid;grid-template-columns:145px 1fr;gap:20px;align-items:center;margin-top:22px}.donut{width:135px;height:135px;border-radius:50%;background:conic-gradient(#3157e8 0 42%,#13a575 42% 68%,#f79009 88% 100%);position:relative}.donut:after{content:'KL';position:absolute;inset:27px;background:#fff;border-radius:50%;display:grid;place-items:center;font-weight:800;color:#344f91}.legend-row{display:grid;grid-template-columns:10px 1fr auto;align-items:center;gap:8px;padding:7px 0}.legend-row i{width:8px;height:8px;border-radius:50%}.orange{background:#f79009}.alerts{display:flex;gap:10px;margin-top:20px}.alerts span{background:#f8f9fb;border-radius:9px;padding:10px;flex:1;color:var(--muted)}.alerts b{color:var(--ink)}.quote-builder label,.form-grid label{display:block;font-weight:700;font-size:12px;margin:12px 0 5px}.quote-builder input,.quote-builder select,.quote-builder textarea{width:100%;border:1px solid var(--line);border-radius:8px;padding:9px;font:inherit}.form-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;margin-bottom:25px}.quote-builder table input{min-width:80px}.quote-builder table td:first-child input{min-width:330px}.storage{display:grid;grid-template-columns:220px 1fr;gap:20px;align-items:center}.storage span,.file-card small{display:block;color:var(--muted)}.storage-bar{height:10px;background:#edf0f5;border-radius:8px;overflow:hidden}.storage-bar i{display:block;height:100%;background:linear-gradient(90deg,#3157e8,#13a575)}.file-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:12px}.file-card{display:grid;grid-template-columns:44px 1fr auto;gap:12px;align-items:center;border:1px solid var(--line);padding:14px;border-radius:11px}.file-icon{width:40px;height:40px;border-radius:10px;background:#eaf0ff;color:#3157e8;display:grid;place-items:center;font-size:20px}@media(max-width:680px){.form-grid,.file-grid,.storage{grid-template-columns:1fr}.dashboard-grid{grid-template-columns:1fr}.donut-wrap{grid-template-columns:1fr}.brand-logo{width:40px;height:40px}}