@import"https://fonts.googleapis.com/css2?family=Plus+Jakarta+Sans:wght@400;500;600;700;800&family=DM+Mono:wght@400;500&display=swap";:root{--bg-void: #0D1117;--bg-base: #0D1117;--bg-card: #161B22;--bg-elevated: #1C2330;--bg-hover: #21262D;--bg-input: #161B22;--accent: #F97316;--accent-bright: #FB923C;--accent-dim: #EA6B0A;--accent-glow: rgba(249,115,22,.18);--accent-subtle: rgba(249,115,22,.09);--accent-border: rgba(249,115,22,.35);--gold: #F97316;--gold-bright: #FB923C;--gold-dim: #EA6B0A;--gold-glow: rgba(249,115,22,.18);--gold-subtle: rgba(249,115,22,.09);--gold-border: rgba(249,115,22,.35);--white: #FFFFFF;--text-primary: #F0F6FC;--text-sec: #C9D1D9;--text-muted: #8B949E;--border: #30363D;--border-gold: rgba(249,115,22,.35);--green: #22C55E;--green-bg: rgba(34,197,94,.12);--green-border: rgba(34,197,94,.3);--red: #F87171;--red-bg: rgba(248,113,113,.12);--red-border: rgba(248,113,113,.3);--yellow: #FCD34D;--yellow-bg: rgba(252,211,77,.12);--yellow-border:rgba(252,211,77,.3);--blue: #60A5FA;--blue-bg: rgba(96,165,250,.12);--blue-border: rgba(96,165,250,.3);--purple: #C084FC;--purple-bg: rgba(192,132,252,.12);--font-display: "Plus Jakarta Sans", sans-serif;--font-body: "Plus Jakarta Sans", sans-serif;--font-mono: "DM Mono", monospace;--sidebar-w: 240px;--topbar-h: 60px;--radius: 10px;--radius-lg: 14px;--radius-sm: 6px;--shadow-card: 0 1px 3px rgba(0,0,0,.4), 0 0 0 1px rgba(255,255,255,.04);--shadow-gold: 0 0 30px rgba(249,115,22,.1);--shadow-modal: 0 25px 60px rgba(0,0,0,.8)}*,*:before,*:after{margin:0;padding:0;box-sizing:border-box}html{scroll-behavior:smooth}body{font-family:var(--font-body);background:var(--bg-void);color:var(--text-primary);line-height:1.6;-webkit-font-smoothing:antialiased;overflow-x:hidden;font-size:14px}a{text-decoration:none;color:inherit}button{cursor:pointer;border:none;font-family:inherit}input,select,textarea{font-family:inherit}.app-shell{display:flex;min-height:100vh}.sidebar{width:var(--sidebar-w);background:#0a0f14;border-right:1px solid var(--border);display:flex;flex-direction:column;position:fixed;top:0;left:0;bottom:0;z-index:100;transition:transform .3s cubic-bezier(.4,0,.2,1)}.sidebar-logo{padding:20px 18px 18px;border-bottom:1px solid var(--border);display:flex;align-items:center;gap:11px}.sidebar-logo-icon{width:38px;height:38px;background:var(--accent);border-radius:10px;display:flex;align-items:center;justify-content:center;font-size:18px;box-shadow:0 4px 16px var(--accent-glow);flex-shrink:0}.sidebar-logo-text{font-family:var(--font-display);font-size:15px;font-weight:800;color:var(--white);letter-spacing:-.01em;line-height:1.2}.sidebar-logo-sub{font-size:10px;color:var(--text-muted);letter-spacing:.06em;text-transform:uppercase;font-weight:500}.sidebar-nav{flex:1;padding:14px 10px;overflow-y:auto}.sidebar-section-label{font-size:9.5px;letter-spacing:.12em;text-transform:uppercase;color:var(--text-muted);padding:0 10px;margin:16px 0 5px;font-weight:700}.sidebar-section-label:first-child{margin-top:0}.nav-item{display:flex;align-items:center;gap:10px;padding:9px 12px;border-radius:8px;color:var(--text-sec);font-size:13.5px;font-weight:500;cursor:pointer;transition:all .15s ease;position:relative;margin-bottom:2px;border:1px solid transparent;-webkit-user-select:none;user-select:none}.nav-item:hover{background:var(--bg-hover);color:var(--white)}.nav-item.active{background:var(--accent-subtle);color:var(--white);border-color:var(--accent-border);font-weight:600}.nav-item.active .nav-icon{color:var(--accent)}.nav-icon{font-size:16px;width:18px;text-align:center;flex-shrink:0;color:var(--text-muted)}.nav-badge{margin-left:auto;background:var(--accent);color:#fff;font-size:10px;font-weight:700;padding:2px 7px;border-radius:20px}.sidebar-footer{padding:12px 10px;border-top:1px solid var(--border)}.sidebar-user{display:flex;align-items:center;gap:10px;padding:10px 12px;border-radius:8px;cursor:pointer;transition:background .15s}.sidebar-user:hover{background:var(--bg-hover)}.user-avatar{width:34px;height:34px;border-radius:50%;background:var(--accent);display:flex;align-items:center;justify-content:center;font-size:13px;font-weight:800;color:#fff;flex-shrink:0}.user-info{flex:1;min-width:0}.user-name{font-size:13px;font-weight:700;color:var(--white);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.user-role{font-size:11px;color:var(--accent);font-weight:600;text-transform:capitalize}.main-content{margin-left:var(--sidebar-w);flex:1;min-height:100vh;display:flex;flex-direction:column}.topbar{height:var(--topbar-h);background:#0a0f14;border-bottom:1px solid var(--border);display:flex;align-items:center;gap:14px;padding:0 22px;position:sticky;top:0;z-index:50}.topbar-title{font-size:15px;font-weight:700;color:var(--white);flex-shrink:0;letter-spacing:-.01em}.search-wrap{flex:1;max-width:360px;position:relative}.search-icon{position:absolute;left:11px;top:50%;transform:translateY(-50%);color:var(--text-muted);font-size:13px;pointer-events:none}.search-input{width:100%;background:var(--bg-card);border:1px solid var(--border);border-radius:8px;padding:8px 12px 8px 34px;font-size:13.5px;color:var(--text-primary);outline:none;transition:border-color .15s,box-shadow .15s;font-family:var(--font-body)}.search-input::placeholder{color:var(--text-muted)}.search-input:focus{border-color:var(--accent);box-shadow:0 0 0 3px var(--accent-glow)}.topbar-actions{display:flex;align-items:center;gap:8px;margin-left:auto}.icon-btn{width:36px;height:36px;border-radius:8px;background:var(--bg-card);border:1px solid var(--border);color:var(--text-sec);display:flex;align-items:center;justify-content:center;font-size:15px;transition:all .15s;position:relative;cursor:pointer}.icon-btn:hover{background:var(--bg-hover);color:var(--accent);border-color:var(--accent-border)}.notif-dot{position:absolute;top:7px;right:7px;width:6px;height:6px;background:var(--accent);border-radius:50%;border:1.5px solid var(--bg-base)}.mobile-menu-btn{display:none;width:36px;height:36px;border-radius:8px;background:var(--bg-card);border:1px solid var(--border);color:var(--text-sec);align-items:center;justify-content:center;font-size:16px;margin-right:6px;cursor:pointer}.page-body{flex:1;padding:22px;max-width:1400px;width:100%}.stats-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:14px;margin-bottom:22px}.stat-card{background:var(--bg-card);border:1px solid var(--border);border-radius:var(--radius-lg);padding:20px;position:relative;overflow:hidden;transition:transform .2s,box-shadow .2s;box-shadow:var(--shadow-card)}.stat-card:before{content:"";position:absolute;top:0;left:0;right:0;height:3px}.stat-card.gold:before{background:var(--accent)}.stat-card.green:before{background:var(--green)}.stat-card.red:before{background:var(--red)}.stat-card.yellow:before{background:var(--yellow)}.stat-card:hover{transform:translateY(-2px);box-shadow:var(--shadow-card),0 8px 24px #0000004d}.stat-icon-wrap{width:42px;height:42px;border-radius:10px;display:flex;align-items:center;justify-content:center;font-size:20px;margin-bottom:14px}.stat-card.gold .stat-icon-wrap{background:var(--accent-subtle)}.stat-card.green .stat-icon-wrap{background:var(--green-bg)}.stat-card.red .stat-icon-wrap{background:var(--red-bg)}.stat-card.yellow .stat-icon-wrap{background:var(--yellow-bg)}.stat-value{font-size:2rem;font-weight:800;color:var(--white);line-height:1;margin-bottom:5px;letter-spacing:-.02em}.stat-label{font-size:12px;color:var(--text-muted);text-transform:uppercase;letter-spacing:.06em;font-weight:600}.stat-sub{font-size:11.5px;color:var(--text-muted);margin-top:10px;padding-top:10px;border-top:1px solid var(--border)}.stat-sub span{color:var(--green);font-weight:700}.section-header{display:flex;align-items:center;justify-content:space-between;margin-bottom:14px;gap:12px;flex-wrap:wrap}.section-title{font-size:15px;font-weight:700;color:var(--white);letter-spacing:-.01em}.section-sub{font-size:12px;color:var(--text-muted);font-weight:500;margin-left:8px}.btn{display:inline-flex;align-items:center;gap:7px;font-family:var(--font-body);font-weight:600;font-size:13.5px;padding:9px 18px;border-radius:8px;cursor:pointer;transition:all .15s ease;white-space:nowrap;border:1px solid transparent;letter-spacing:-.01em}.btn-gold{background:var(--accent);color:#fff;box-shadow:0 2px 12px var(--accent-glow);font-weight:700}.btn-gold:hover{background:var(--accent-bright);box-shadow:0 4px 20px var(--accent-glow);transform:translateY(-1px)}.btn-ghost{background:var(--bg-elevated);color:var(--text-sec);border-color:var(--border)}.btn-ghost:hover{background:var(--bg-hover);color:var(--white);border-color:#484f58}.btn-danger{background:var(--red-bg);color:var(--red);border-color:var(--red-border)}.btn-danger:hover{background:#f8717133}.btn-sm{padding:6px 12px;font-size:12.5px}.btn-icon{padding:8px}.toolbar{display:flex;align-items:center;gap:10px;flex-wrap:wrap}.filter-select{background:var(--bg-card);border:1px solid var(--border);color:var(--text-primary);border-radius:8px;padding:8px 12px;font-size:13.5px;outline:none;cursor:pointer;transition:border-color .15s;font-family:var(--font-body);font-weight:500}.filter-select:focus{border-color:var(--accent)}.filter-select option{background:var(--bg-card)}.table-card{background:var(--bg-card);border:1px solid var(--border);border-radius:var(--radius-lg);overflow:hidden;box-shadow:var(--shadow-card)}.table-wrap{overflow-x:auto}table{width:100%;border-collapse:collapse;font-size:13.5px}thead{background:var(--bg-elevated);border-bottom:1px solid var(--border)}th{padding:11px 16px;text-align:left;font-size:11px;font-weight:700;letter-spacing:.07em;text-transform:uppercase;color:var(--text-muted);white-space:nowrap}td{padding:14px 16px;color:var(--text-primary);border-bottom:1px solid var(--border);vertical-align:middle}tr:last-child td{border-bottom:none}tbody tr{transition:background .12s}tbody tr:hover{background:var(--bg-hover)}.td-name{font-weight:700;color:var(--white);font-size:14px}.td-sub{font-size:12px;color:var(--text-muted);margin-top:3px;font-weight:400}.badge{display:inline-flex;align-items:center;gap:5px;padding:4px 10px;border-radius:6px;font-size:11.5px;font-weight:700;letter-spacing:.02em;white-space:nowrap;border:1px solid transparent}.badge:before{content:"";width:5px;height:5px;border-radius:50%;flex-shrink:0}.badge-new{background:#8b949e1f;color:#c9d1d9;border-color:#8b949e40}.badge-new:before{background:#8b949e}.badge-called{background:var(--blue-bg);color:var(--blue);border-color:var(--blue-border)}.badge-called:before{background:var(--blue)}.badge-confirmed{background:var(--accent-subtle);color:var(--accent-bright);border-color:var(--accent-border)}.badge-confirmed:before{background:var(--accent)}.badge-delivered{background:var(--green-bg);color:var(--green);border-color:var(--green-border)}.badge-delivered:before{background:var(--green)}.badge-failed{background:var(--red-bg);color:var(--red);border-color:var(--red-border)}.badge-failed:before{background:var(--red)}.badge-pending{background:var(--yellow-bg);color:var(--yellow);border-color:var(--yellow-border)}.badge-pending:before{background:var(--yellow)}.badge-packed{background:var(--purple-bg);color:var(--purple);border-color:#c084fc4d}.badge-packed:before{background:var(--purple)}.assign-select{background:var(--bg-elevated);border:1px solid var(--border);color:var(--text-sec);border-radius:6px;padding:5px 8px;font-size:12.5px;outline:none;cursor:pointer;font-family:var(--font-body);max-width:130px;transition:border-color .15s;font-weight:500}.assign-select:focus{border-color:var(--accent);color:var(--white)}.assign-select option{background:var(--bg-card)}.form-group{margin-bottom:18px}.form-label{display:block;font-size:12px;font-weight:700;color:var(--text-sec);text-transform:uppercase;letter-spacing:.06em;margin-bottom:7px}.form-input{width:100%;background:var(--bg-elevated);border:1px solid var(--border);border-radius:8px;padding:11px 14px;font-size:14px;color:var(--white);outline:none;transition:border-color .15s,box-shadow .15s;font-family:var(--font-body);font-weight:500}.form-input::placeholder{color:var(--text-muted);font-size:13px;font-weight:400}.form-input:focus{border-color:var(--accent);box-shadow:0 0 0 3px var(--accent-glow);background:var(--bg-card)}.form-select{width:100%;background:var(--bg-elevated);border:1px solid var(--border);border-radius:8px;padding:11px 14px;font-size:14px;color:var(--white);outline:none;transition:border-color .15s,box-shadow .15s;font-family:var(--font-body);cursor:pointer;font-weight:500}.form-select:focus{border-color:var(--accent);box-shadow:0 0 0 3px var(--accent-glow)}.form-select option{background:var(--bg-card)}.form-grid{display:grid;grid-template-columns:1fr 1fr;gap:14px}.modal-overlay{position:fixed;top:0;right:0;bottom:0;left:0;background:#000000bf;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);z-index:200;display:flex;align-items:center;justify-content:center;padding:20px;animation:fadeIn .2s ease}.modal{background:var(--bg-card);border:1px solid var(--border);border-radius:var(--radius-lg);width:100%;max-width:520px;max-height:90vh;overflow-y:auto;box-shadow:var(--shadow-modal);animation:slideUp .25s cubic-bezier(.34,1.56,.64,1)}.modal-header{display:flex;align-items:center;justify-content:space-between;padding:18px 22px;border-bottom:1px solid var(--border)}.modal-title{font-size:15px;font-weight:700;color:var(--white)}.modal-close{width:30px;height:30px;border-radius:6px;background:var(--bg-elevated);border:1px solid var(--border);color:var(--text-muted);display:flex;align-items:center;justify-content:center;font-size:15px;transition:all .15s;cursor:pointer}.modal-close:hover{color:var(--white);background:var(--bg-hover)}.modal-body{padding:22px}.modal-footer{padding:14px 22px;border-top:1px solid var(--border);display:flex;gap:10px;justify-content:flex-end}.empty-state{text-align:center;padding:56px 24px;color:var(--text-muted)}.empty-icon{font-size:2.8rem;margin-bottom:14px;opacity:.35;display:block}.empty-title{font-size:15px;font-weight:700;color:var(--text-sec);margin-bottom:6px}.empty-text{font-size:13px;line-height:1.6}@keyframes shimmer{0%{background-position:-400px 0}to{background-position:400px 0}}.skeleton{background:linear-gradient(90deg,var(--bg-elevated) 25%,var(--bg-hover) 50%,var(--bg-elevated) 75%);background-size:800px 100%;animation:shimmer 1.5s infinite linear;border-radius:6px}.skeleton-text{height:13px;border-radius:4px}.skeleton-title{height:20px;border-radius:4px}.skeleton-stat{height:40px;border-radius:6px}.order-card{background:var(--bg-card);border:1px solid var(--border);border-radius:var(--radius-lg);padding:16px;margin-bottom:10px;transition:border-color .15s}.order-card:hover{border-color:var(--accent-border)}.order-card-head{display:flex;align-items:flex-start;justify-content:space-between;margin-bottom:0}.order-card-name{font-weight:700;font-size:15px;color:var(--white)}.order-card-info{font-size:13px;color:var(--text-sec);margin-top:5px;display:flex;align-items:center;gap:6px}.order-card-expand{background:transparent;border:none;color:var(--text-muted);font-size:18px;line-height:1;transition:color .15s;padding:4px;cursor:pointer}.order-card-expand:hover{color:var(--accent)}.order-card-body{padding-top:14px;border-top:1px solid var(--border);margin-top:14px;animation:fadeIn .2s ease}.card-row{display:flex;align-items:flex-start;gap:8px;font-size:13px;color:var(--text-sec);margin-bottom:8px}.card-row-icon{color:var(--accent);width:16px;text-align:center;flex-shrink:0;margin-top:1px}.call-btn{display:inline-flex;align-items:center;gap:7px;background:var(--accent);color:#fff;font-size:13.5px;font-weight:700;padding:10px 18px;border-radius:8px;text-decoration:none;transition:all .15s;margin-bottom:14px;box-shadow:0 2px 12px var(--accent-glow)}.call-btn:hover{background:var(--accent-bright);transform:translateY(-1px)}.status-btns{display:flex;flex-wrap:wrap;gap:8px}.status-btn{font-size:12.5px;font-weight:600;padding:8px 14px;border-radius:7px;border:1px solid var(--border);background:var(--bg-elevated);color:var(--text-sec);cursor:pointer;transition:all .15s}.status-btn:hover{border-color:var(--accent-border);color:var(--white);background:var(--bg-hover)}.status-btn.active{background:var(--accent-subtle);border-color:var(--accent-border);color:var(--accent-bright);font-weight:700}.status-btn.success{background:var(--green-bg);border-color:var(--green-border);color:var(--green)}.status-btn.danger{background:var(--red-bg);border-color:var(--red-border);color:var(--red)}.log-item{display:flex;gap:14px;align-items:flex-start;padding:13px 0;border-bottom:1px solid var(--border)}.log-item:last-child{border-bottom:none}.log-dot{width:8px;height:8px;border-radius:50%;flex-shrink:0;margin-top:6px}.log-content{flex:1}.log-action{font-size:13.5px;font-weight:600;color:var(--text-primary)}.log-meta{font-size:11.5px;color:var(--text-muted);margin-top:3px}.role-pill{display:inline-block;font-size:10.5px;font-weight:700;letter-spacing:.04em;text-transform:uppercase;padding:3px 9px;border-radius:6px}.role-admin{background:var(--accent-subtle);color:var(--accent-bright);border:1px solid var(--accent-border)}.role-agent{background:var(--blue-bg);color:var(--blue);border:1px solid var(--blue-border)}.role-logistics{background:var(--purple-bg);color:var(--purple);border:1px solid rgba(192,132,252,.3)}.role-rider{background:var(--green-bg);color:var(--green);border:1px solid var(--green-border)}.role-inventory_manager{background:var(--yellow-bg);color:var(--yellow);border:1px solid var(--yellow-border)}.role-operations_manager{background:#14b8a61f;color:#2dd4bf;border:1px solid rgba(20,184,166,.3)}.role-hr{background:#f472b61f;color:#f472b6;border:1px solid rgba(244,114,182,.3)}.role-finance{background:#22c55e1f;color:#22c55e;border:1px solid rgba(34,197,94,.3)}.toast-wrap{position:fixed;bottom:22px;right:22px;z-index:999;display:flex;flex-direction:column;gap:10px}.toast{background:var(--bg-elevated);border:1px solid var(--border);border-radius:10px;padding:13px 16px;font-size:13.5px;font-weight:500;color:var(--text-primary);display:flex;align-items:center;gap:10px;box-shadow:0 8px 30px #00000080;animation:slideUp .3s cubic-bezier(.34,1.56,.64,1);min-width:260px}.toast-icon{font-size:15px;flex-shrink:0}.toast.success{border-left:3px solid var(--green)}.toast.error{border-left:3px solid var(--red)}.toast.info{border-left:3px solid var(--accent)}.gold-line{height:1px;background:var(--border);margin:18px 0}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}@keyframes slideUp{0%{opacity:0;transform:translateY(16px)}to{opacity:1;transform:translateY(0)}}.fade-in{animation:fadeIn .3s ease}.slide-up{animation:slideUp .3s cubic-bezier(.34,1.56,.64,1)}::-webkit-scrollbar{width:5px;height:5px}::-webkit-scrollbar-track{background:transparent}::-webkit-scrollbar-thumb{background:#30363d;border-radius:10px}::-webkit-scrollbar-thumb:hover{background:var(--accent)}.sidebar-overlay{display:none;position:fixed;top:0;right:0;bottom:0;left:0;background:#000000b3;z-index:99;animation:fadeIn .2s}@media (max-width: 1024px){.stats-grid{grid-template-columns:repeat(2,1fr)}}@media (max-width: 768px){.sidebar{transform:translate(-100%);box-shadow:none}.sidebar.open{transform:translate(0);box-shadow:4px 0 40px #000c}.sidebar-overlay.show{display:block}.main-content{margin-left:0}.mobile-menu-btn{display:flex}.topbar{padding:0 14px}.page-body{padding:14px}.stats-grid{grid-template-columns:repeat(2,1fr);gap:10px}.stat-value{font-size:1.6rem}.form-grid{grid-template-columns:1fr}.section-header{flex-direction:column;align-items:flex-start}.toolbar{width:100%}.search-wrap{display:none}td,th{padding:10px 12px}}@media (max-width: 480px){.stats-grid{grid-template-columns:1fr 1fr;gap:10px}.stat-card{padding:14px}.stat-value{font-size:1.4rem}.modal{border-radius:var(--radius)}.page-body{padding:12px}}