*{box-sizing:border-box}body{margin:0;font-family:Inter,Segoe UI,Arial,sans-serif;background:#f6f8fc;color:#12203b;font-size:14px}.app{display:flex;min-height:100vh}.sidebar{width:207px;background:#0d172d;color:#fff;display:flex;flex-direction:column;position:fixed;inset:0 auto 0 0;z-index:20}.brand{height:74px;padding:18px 12px;display:flex;gap:8px;align-items:center}.brand-mark{width:28px;height:28px;border-radius:7px;background:#fff;color:#101a2f;display:grid;place-items:center;font-weight:800}.brand b{display:block;font-size:13px}.brand small{display:block;font-size:8px;color:#9eabc3;margin-top:1px}.sidebar nav{padding:10px 7px;overflow:auto}.sidebar nav a{display:flex;align-items:center;gap:10px;color:#c4cce0;text-decoration:none;padding:9px 10px;border-radius:7px;font-size:12px;margin:2px 0}.sidebar nav a.active,.sidebar nav a:hover{background:#fff;color:#17223b}.nav-icon{width:17px;text-align:center}.userbox{margin-top:auto;border-top:1px solid #273149;padding:14px 11px;display:flex;align-items:center;gap:8px}.userbox b{font-size:10px;display:block}.userbox small{font-size:9px;color:#9eabc3}.userbox>a{margin-left:auto;color:#9eabc3;text-decoration:none}.avatar{width:25px;height:25px;border-radius:50%;background:#34435e;display:grid;place-items:center;font-size:10px}.main{margin-left:207px;width:calc(100% - 207px)}.topbar{height:53px;background:#fff;border-bottom:1px solid #dfe5ef;display:flex;align-items:center;padding:0 20px;gap:16px}.search{height:33px;border:1px solid #dce3ed;border-radius:7px;width:375px;color:#9aa6ba;display:flex;align-items:center;padding:0 10px;gap:7px}.search input{border:0;outline:0;width:100%;font-size:11px}.top-actions{margin-left:auto;position:relative}.badge{position:absolute;top:-8px;right:-8px;background:#f0444a;color:white;border-radius:10px;padding:1px 4px;font-size:8px}.menu-btn{display:none;border:0;background:none;font-size:20px}.content{padding:20px 28px}.welcome{display:flex;justify-content:space-between;align-items:center;margin:0 0 18px}.welcome h1{font-size:20px;margin:0 0 3px}.welcome p{margin:0;color:#7b89a3;font-size:11px}.date-pill{background:white;border:1px solid #e0e6ef;border-radius:8px;padding:8px 12px;color:#70809b;font-size:11px}.kpi-grid{display:grid;grid-template-columns:repeat(4,minmax(170px,1fr));gap:10px}.kpi{min-height:73px;border-radius:10px;color:white;padding:12px;display:flex;gap:10px;align-items:flex-start}.kpi>span{background:rgba(255,255,255,.15);width:30px;height:30px;border-radius:7px;display:grid;place-items:center;font-size:16px}.kpi small{font-size:10px;display:block;opacity:.95}.kpi strong{font-size:19px;display:block;margin-top:3px}.kpi em{font-style:normal;font-size:9px;display:block;margin-top:2px;opacity:.9}.blue{background:#2d64e9}.purple{background:#783be8}.green{background:#079b70}.orange{background:#ff9f08}.red{background:#f0444a}.navy{background:#0d172d}.dashboard-grid{display:grid;grid-template-columns:2.1fr 1fr;gap:14px;margin-top:20px}.panel{background:#fff;border:1px solid #dfe5ef;border-radius:10px;padding:15px;min-height:275px}.panel h2{font-size:13px;margin:2px 0 12px}.panel h2 small{font-weight:400}.chart-panel canvas{height:215px!important}.source-panel canvas{height:190px!important}.legend{display:flex;justify-content:center;gap:12px;flex-wrap:wrap;font-size:9px;color:#687790}.section-title{font-size:14px;margin:20px 0 10px}.action-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:10px}.action-card{background:#fff;border:1px solid #dfe5ef;border-radius:10px;min-height:145px;padding:12px}.action-card header{display:flex;align-items:center;gap:7px;color:#18263f;font-size:11px}.action-card header span{margin-left:auto;color:#6e7d97}.empty{text-align:center;color:#91a0b8;font-size:10px;margin-top:30px}.follow{padding:11px 3px;border-bottom:1px solid #edf0f5}.follow b{display:block;font-size:10px}.follow small{color:#8b99b0;font-size:9px}.login-page{display:grid;place-items:center;min-height:100vh;background:#f3f6fb}.login-card{width:380px;background:#fff;border:1px solid #e1e7ef;border-radius:14px;padding:32px;box-shadow:0 15px 40px rgba(17,35,65,.08)}.brand.large{padding:0 0 25px}.login-card h1{font-size:23px;margin:5px 0}.muted,.hint{color:#8491a7;font-size:12px}.login-card label{display:block;font-size:11px;font-weight:600;margin:16px 0 6px}.login-card input{width:100%;height:40px;border:1px solid #d9e1ec;border-radius:7px;padding:0 10px;outline:0}.btn{border:0;border-radius:7px;height:40px;padding:0 16px;font-weight:700;cursor:pointer}.btn.primary{background:#2d64e9;color:#fff}.btn.full{width:100%;margin-top:20px}.alert{padding:10px;border-radius:7px;font-size:11px}.danger{background:#fff0f0;color:#c9363b}.hint{text-align:center;margin-top:18px;font-size:10px}@media(max-width:1050px){.kpi-grid{grid-template-columns:repeat(2,1fr)}.dashboard-grid{grid-template-columns:1fr}.action-grid{grid-template-columns:repeat(2,1fr)}}@media(max-width:700px){.sidebar{transform:translateX(-100%);transition:.2s}.sidebar.open{transform:translateX(0)}.main{margin-left:0;width:100%}.menu-btn{display:block}.search{width:auto;flex:1}.content{padding:14px}.kpi-grid,.action-grid{grid-template-columns:1fr}.login-card{width:calc(100% - 30px)}}/* CRUD modules */
.page-heading{display:flex;justify-content:space-between;align-items:center;margin-bottom:18px}.page-heading h1{margin:0 0 3px;font-size:20px}.page-heading p{margin:0;color:#7b89a3;font-size:11px}.btn{display:inline-flex;align-items:center;justify-content:center;text-decoration:none;background:#f4f6fa;border:1px solid #dce3ed;color:#33415c;height:34px;padding:0 12px;border-radius:7px;font-size:11px;font-weight:700;cursor:pointer}.btn.primary{background:#2d64e9;border-color:#2d64e9;color:#fff}.crud-layout{display:grid;grid-template-columns:minmax(0,1.8fr) minmax(310px,.8fr);gap:14px;align-items:start}.table-panel{min-width:0}.form-panel{position:sticky;top:15px}.form-panel h2{font-size:14px;margin:2px 0 15px}.panel-toolbar{display:flex;justify-content:space-between;align-items:center;gap:10px;margin-bottom:12px}.panel-toolbar b{display:block;font-size:13px}.panel-toolbar small{display:block;color:#8997ad;font-size:9px;margin-top:3px}.inline-search{display:flex;gap:6px}.inline-search input,.inline-search select{height:32px;border:1px solid #dbe2ec;border-radius:6px;padding:0 8px;font-size:10px;background:#fff}.inline-search input{width:185px}.table-wrap{overflow:auto}table{width:100%;border-collapse:collapse;min-width:720px}th{background:#f7f9fc;color:#71809a;text-align:left;font-size:9px;text-transform:uppercase;letter-spacing:.03em;padding:10px 9px;border-bottom:1px solid #e5eaf1}td{padding:10px 9px;border-bottom:1px solid #edf0f5;font-size:10px;color:#33415c;vertical-align:middle}td b{display:block;color:#17253f;font-size:10px}td small{display:block;color:#8a97ab;font-size:9px;margin-top:3px}.actions{white-space:nowrap;text-align:right}.actions a,.actions button{font-size:9px;color:#2d64e9;background:none;border:0;padding:2px 4px;text-decoration:none;cursor:pointer}.actions form{display:inline}.actions form button:last-child{color:#d13d44}.empty-row{text-align:center!important;color:#92a0b6!important;padding:35px!important}.form-grid{display:grid;grid-template-columns:1fr 1fr;gap:11px}.form-grid label{display:block;color:#64738d;font-size:10px;font-weight:700}.form-grid input,.form-grid select,.form-grid textarea{display:block;width:100%;margin-top:5px;border:1px solid #dbe2ec;border-radius:6px;padding:8px 9px;font:inherit;font-size:11px;color:#1d2a42;background:#fff;outline:none}.form-grid input,.form-grid select{height:36px}.form-grid textarea{resize:vertical}.span-2{grid-column:span 2}.form-actions{display:flex;gap:7px;padding-top:2px}.mini-stats{display:grid;grid-template-columns:repeat(4,1fr);gap:10px;margin-bottom:14px}.mini-stats>div{background:#fff;border:1px solid #dfe5ef;border-radius:9px;padding:11px 13px}.mini-stats small{display:block;color:#8290a7;font-size:9px}.mini-stats b{display:block;font-size:18px;margin-top:3px}.status{display:inline-block;padding:4px 7px;border-radius:10px;font-size:8px;font-weight:700;background:#eef2f7;color:#63718a}.status.available,.status.accepted{background:#e6f8f1;color:#087d5b}.status.reserved,.status.sent{background:#fff3db;color:#a96700}.status.in_transit{background:#e7f0ff;color:#2b62d5}.status.delivered,.status.converted{background:#e9e8ff;color:#6645c5}.status.maintenance,.status.declined{background:#fff0f0;color:#c93c45}.status.sold{background:#e8eef8;color:#44536d}.status.retired,.status.expired{background:#eef0f3;color:#77849a}.status.neutral{background:#edf1f7;color:#5e6d85}.quote-total{display:flex;align-items:center;justify-content:space-between;background:#f5f8fd;border:1px solid #e0e6ef;border-radius:7px;padding:10px 11px;color:#64738d;font-size:10px}.quote-total strong{color:#14233d;font-size:17px}.flash{position:relative;margin:12px 28px 0;padding:10px 12px;border-radius:7px;font-size:11px;border:1px solid}.flash.success{background:#eaf9f3;color:#087d5b;border-color:#c9efdf}.flash.danger{background:#fff0f0;color:#bd3740;border-color:#f3cccc}
@media(max-width:1150px){.crud-layout{grid-template-columns:1fr}.form-panel{position:static}.mini-stats{grid-template-columns:repeat(2,1fr)}}
@media(max-width:700px){.page-heading{align-items:flex-start;gap:10px}.page-heading .btn{flex-shrink:0}.panel-toolbar{align-items:stretch;flex-direction:column}.inline-search input{width:100%}.inline-search{width:100%}.inline-search select{flex:1}.form-grid{grid-template-columns:1fr}.span-2{grid-column:auto}.mini-stats{grid-template-columns:1fr 1fr}.flash{margin:10px 14px 0}}
