*{box-sizing:border-box;margin:0;padding:0}body{color:#222;background:#f0f2f5;font-family:Segoe UI,sans-serif}.layout{min-height:100vh;display:flex}.sidebar{color:#cdd6f4;z-index:100;background:#1a1a2e;flex-direction:column;width:240px;height:100vh;display:flex;position:fixed}.sidebar-logo{color:#fff;border-bottom:1px solid #2a2a4a;padding:24px 20px;font-size:18px;font-weight:700}.sidebar-nav{flex:1;padding:12px 0}.sidebar-nav a{color:#aab;align-items:center;gap:12px;padding:11px 20px;font-size:14px;text-decoration:none;transition:all .2s;display:flex}.sidebar-nav a:hover,.sidebar-nav a.active{color:#fff;background:#2a2a4a;border-left:3px solid #7c6af7}.sidebar-nav a span.icon{text-align:center;width:24px;font-size:18px}.main{flex-direction:column;flex:1;margin-left:240px;display:flex}.topbar{z-index:50;background:#fff;border-bottom:1px solid #e5e7eb;padding:16px 28px;font-size:20px;font-weight:600;position:sticky;top:0}.content{flex:1;padding:28px}.cards{grid-template-columns:repeat(auto-fill,minmax(200px,1fr));gap:18px;margin-bottom:28px;display:grid}.card{background:#fff;border-radius:12px;padding:20px 22px;box-shadow:0 1px 4px #00000012}.card-label{color:#888;margin-bottom:6px;font-size:13px}.card-value{color:#1a1a2e;font-size:28px;font-weight:700}.card-icon{float:right;font-size:32px}.table-wrap{background:#fff;border-radius:12px;overflow:hidden;box-shadow:0 1px 4px #00000012}.table-header{border-bottom:1px solid #f0f0f0;justify-content:space-between;align-items:center;padding:16px 20px;display:flex}.table-header h3{font-size:16px;font-weight:600}table{border-collapse:collapse;width:100%;font-size:14px}th{text-align:left;color:#555;background:#f8f9fa;border-bottom:1px solid #e5e7eb;padding:11px 14px;font-weight:600}td{border-bottom:1px solid #f0f0f0;padding:11px 14px}tr:last-child td{border-bottom:none}tr:hover td{background:#fafafa}tr.low-stock td{background:#fff5f5}tr.low-stock:hover td{background:#ffe8e8}.btn{cursor:pointer;border:none;border-radius:8px;padding:8px 16px;font-size:13px;font-weight:500;transition:all .2s}.btn-primary{color:#fff;background:#7c6af7}.btn-primary:hover{background:#6a57e8}.btn-danger{color:#fff;background:#ff4d4f}.btn-danger:hover{background:#e03e40}.btn-sm{padding:5px 10px;font-size:12px}.btn-outline{color:#7c6af7;background:0 0;border:1px solid #7c6af7}.btn-outline:hover{color:#fff;background:#7c6af7}.badge{border-radius:20px;padding:3px 10px;font-size:12px;font-weight:500;display:inline-block}.badge-pending{color:#d46b08;background:#fff7e6}.badge-confirmed{color:#0958d9;background:#e6f4ff}.badge-received{color:#389e0d;background:#f6ffed}.badge-cancelled{color:#cf1322;background:#fff1f0}.badge-in{color:#389e0d;background:#f6ffed}.badge-out{color:#cf1322;background:#fff1f0}.badge-adjustment{color:#2f54eb;background:#f0f5ff}.badge-low{color:#cf1322;background:#fff1f0}.modal-overlay{z-index:1000;background:#00000073;justify-content:center;align-items:center;display:flex;position:fixed;inset:0}.modal{background:#fff;border-radius:14px;width:480px;max-width:95vw;max-height:90vh;padding:28px;overflow-y:auto}.modal h2{margin-bottom:20px;font-size:18px}.modal-footer{justify-content:flex-end;gap:10px;margin-top:20px;display:flex}.form-group{margin-bottom:16px}.form-group label{color:#555;margin-bottom:6px;font-size:13px;font-weight:500;display:block}.form-group input,.form-group select,.form-group textarea{border:1px solid #d9d9d9;border-radius:8px;outline:none;width:100%;padding:9px 12px;font-size:16px;transition:border .2s}.form-group input:focus,.form-group select:focus{border-color:#7c6af7}.form-row{grid-template-columns:1fr 1fr;gap:14px;display:grid}.filters{flex-wrap:wrap;gap:12px;margin-bottom:18px;display:flex}.filters input,.filters select{border:1px solid #d9d9d9;border-radius:8px;outline:none;padding:8px 12px;font-size:13px}.filters input:focus,.filters select:focus{border-color:#7c6af7}.pagination{color:#666;border-top:1px solid #f0f0f0;justify-content:flex-end;align-items:center;gap:8px;padding:14px 20px;font-size:13px;display:flex}.pagination button{cursor:pointer;background:#fff;border:1px solid #d9d9d9;border-radius:6px;padding:5px 12px}.pagination button:disabled{opacity:.4;cursor:default}.pagination button.active{color:#fff;background:#7c6af7;border-color:#7c6af7}.loading{text-align:center;color:#888;padding:40px}.empty{text-align:center;color:#bbb;padding:40px}.text-red{color:#cf1322;font-weight:600}.gap{gap:8px;display:flex}.section-title{margin-bottom:14px;font-size:16px;font-weight:600}.hamburger{cursor:pointer;color:#1a1a2e;background:0 0;border:none;padding:4px 8px;font-size:22px;display:none}.sidebar-overlay{display:none}.table-scroll{-webkit-overflow-scrolling:touch;overflow-x:auto}@media (width<=768px){.sidebar{z-index:200;transition:transform .25s;transform:translate(-100%)}.sidebar.open{transform:translate(0)}.sidebar-overlay{z-index:199;opacity:0;pointer-events:none;background:#0006;transition:opacity .25s;display:block;position:fixed;inset:0}.sidebar-overlay.open{opacity:1;pointer-events:all}.main{margin-left:0}.topbar{align-items:center;gap:12px;padding:14px 16px;font-size:17px;display:flex}.hamburger{display:block}.content{padding:16px}.cards{grid-template-columns:1fr 1fr;gap:12px}.card{padding:14px}.card-value{font-size:22px}.card-icon{font-size:24px}.table-wrap{border-radius:10px}.table-wrap table{min-width:560px}.table-scroll{-webkit-overflow-scrolling:touch;overflow-x:auto}.table-wrap{overflow-x:auto}.table-header{flex-wrap:wrap;gap:10px;padding:12px 14px}.form-row{grid-template-columns:1fr}.filters{flex-direction:column}.filters input,.filters select{width:100%}.modal{border-radius:14px 14px 0 0;width:100%;max-height:92vh;position:fixed;bottom:0;left:0}.modal-overlay{align-items:flex-end}.pagination{padding:10px 14px}}@media (width<=400px){.cards{grid-template-columns:1fr}}