:root{--bg-base:#09090b;--panel-bg:#ffffff08;--panel-border:#ffffff14;--panel-border-hover:#ffffff26;--text-main:#f8fafc;--text-muted:#94a3b8;--primary:#e23744;--primary-hover:#f43f5e;--primary-glow:#e2374466;--danger:#ef4444;--success:#10b981;--font-family:"Outfit", system-ui, -apple-system, sans-serif;--transition:all .3s cubic-bezier(.4, 0, .2, 1)}*{box-sizing:border-box;margin:0;padding:0}body{background-color:var(--bg-base);color:var(--text-main);font-family:var(--font-family);background-image:radial-gradient(circle at 15%,#e237441f,#0000 25%),radial-gradient(circle at 85% 30%,#f4a26114,#0000 25%);min-height:100vh;overflow-x:hidden}h1,h2,h3,h4{letter-spacing:-.02em;font-weight:600}p{line-height:1.5}.muted{color:var(--text-muted)}.text-danger{color:var(--danger)}.text-success{color:var(--success)}.mt-2{margin-top:.5rem}.mt-3{margin-top:.75rem}.mt-4{margin-top:1rem}.mb-4{margin-bottom:1.5rem}.full-width{width:100%}.inline-flex{display:inline-flex}@keyframes fadeInUp{0%{opacity:0;transform:translateY(16px)}to{opacity:1;transform:translateY(0)}}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}.fade-in{animation:.5s forwards fadeIn}.fade-in-up{animation:.6s cubic-bezier(.16,1,.3,1) forwards fadeInUp}.spin{animation:1s linear infinite spin}.glass-panel{background:var(--panel-bg);border:1px solid var(--panel-border);-webkit-backdrop-filter:blur(20px);border-radius:24px;box-shadow:0 8px 32px #0003}.app-container{min-height:100vh;display:flex}.sidebar{border-radius:24px;flex-direction:column;width:260px;height:calc(100vh - 32px);margin:16px;padding:24px;display:flex;position:sticky;top:16px}.sidebar-brand{align-items:center;gap:12px;margin-bottom:40px;font-size:22px;font-weight:700;display:flex}.brand-icon{background:linear-gradient(135deg, var(--primary), var(--primary-hover));color:#fff;box-shadow:0 0 20px var(--primary-glow);border-radius:12px;place-items:center;padding:8px;display:grid}.sidebar-nav{flex-direction:column;flex:1;gap:8px;display:flex}.nav-item{color:var(--text-muted);cursor:pointer;font-size:16px;font-family:var(--font-family);transition:var(--transition);background:0 0;border:1px solid #0000;border-radius:16px;align-items:center;gap:14px;padding:14px 18px;font-weight:500;display:flex}.nav-item:hover{color:var(--text-main);background:#ffffff0d}.nav-item.active{border-color:var(--panel-border-hover);color:var(--text-main);background:#ffffff14;box-shadow:inset 0 0 20px #ffffff05}.sidebar-footer .logout{color:#fb7185;width:100%}.sidebar-footer .logout:hover{color:#f43f5e;background:#fb71851a}.main-content{flex:1;max-width:1200px;margin:0 auto;padding:16px 32px 32px 16px}.topbar{justify-content:space-between;align-items:flex-end;margin-top:16px;margin-bottom:32px;display:flex}.topbar h1{margin-bottom:4px;font-size:36px}.topbar-actions{align-items:center;gap:16px;display:flex}.status-badge{color:var(--text-muted);background:#ffffff1a;border-radius:99px;padding:6px 16px;font-size:14px;animation:.3s fadeIn}.metrics-grid{grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:16px;margin-bottom:32px;display:grid}.metric-card{background:var(--panel-bg);border:1px solid var(--panel-border);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border-radius:20px;padding:24px}.metric-label{color:var(--text-muted);text-transform:uppercase;letter-spacing:.05em;font-size:14px;font-weight:600}.metric-value{color:var(--text-main);margin-top:8px;font-size:36px;font-weight:700;display:block}.section-panel{padding:32px}.panel-header{justify-content:space-between;align-items:center;margin-bottom:24px;display:flex}.panel-header h2{font-size:24px}.badge{background:var(--panel-bg);border:1px solid var(--panel-border);border-radius:99px;padding:6px 12px;font-size:13px;font-weight:600}.form-grid{grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:20px;display:grid}.input-group{flex-direction:column;gap:8px;display:flex}.input-group label{color:var(--text-muted);text-transform:capitalize;font-size:14px;font-weight:500}input,select,textarea{border:1px solid var(--panel-border);height:48px;color:var(--text-main);font-family:var(--font-family);transition:var(--transition);background:#0003;border-radius:12px;padding:0 16px;font-size:15px}input:focus{border-color:var(--primary);box-shadow:0 0 0 4px var(--primary-glow);background:#0006;outline:none}.checkbox-grid{grid-template-columns:repeat(auto-fill,minmax(180px,1fr));gap:16px;display:grid}.toggle-switch{cursor:pointer;border:1px solid var(--panel-border);transition:var(--transition);background:#0003;border-radius:12px;align-items:center;gap:12px;padding:12px 16px;display:flex}.toggle-switch:hover{border-color:var(--panel-border-hover)}.toggle-switch input{display:none}.slider-track{width:40px;height:24px;transition:var(--transition);background:#ffffff1a;border-radius:99px;position:relative}.slider-thumb{width:18px;height:18px;transition:var(--transition);background:#fff;border-radius:50%;position:absolute;top:3px;left:3px}.toggle-switch input:checked+.slider-track{background:var(--primary)}.toggle-switch input:checked+.slider-track .slider-thumb{transform:translate(16px)}.toggle-label{text-transform:capitalize;font-size:14px;font-weight:500}button{height:48px;font-family:var(--font-family);cursor:pointer;transition:var(--transition);border:none;border-radius:14px;justify-content:center;align-items:center;gap:8px;padding:0 24px;font-size:15px;font-weight:600;display:inline-flex}button:disabled{opacity:.5;cursor:not-allowed}.btn-primary{background:linear-gradient(135deg, var(--primary), var(--primary-hover));color:#fff;box-shadow:0 8px 24px var(--primary-glow)}.btn-primary:hover:not(:disabled){transform:translateY(-2px);box-shadow:0 12px 32px #e2374499}.btn-secondary{color:var(--text-main);border:1px solid var(--panel-border);background:#ffffff0d}.btn-secondary:hover:not(:disabled){border-color:var(--panel-border-hover);background:#ffffff1a}.btn-danger-ghost{color:var(--danger);background:0 0;border:1px solid #ef444433}.btn-danger-ghost:hover:not(:disabled){background:#ef44441a;border-color:#ef444466}.btn-sm{border-radius:10px;height:36px;padding:0 16px;font-size:13px}.upload-container{border:1px dashed var(--panel-border-hover);background:#0003;border-radius:16px;align-items:center;gap:24px;padding:24px;display:flex}.preview-thumb{object-fit:cover;border:1px solid var(--panel-border);border-radius:12px;width:80px;height:80px}.upload-card{border:1px dashed var(--panel-border-hover);text-align:center;background:#0003;border-radius:20px;padding:24px}.banner-preview-img{aspect-ratio:16/9;object-fit:cover;border:1px solid var(--panel-border);border-radius:16px;width:100%}.banner-placeholder{aspect-ratio:16/9;width:100%;color:var(--text-muted);background:#ffffff05;border-radius:16px;flex-direction:column;justify-content:center;align-items:center;gap:16px;display:flex}.muted-icon{opacity:.5}.data-list{flex-direction:column;gap:12px;display:flex}.data-row{transition:var(--transition);background:#00000026;border:1px solid #0000;border-radius:16px;align-items:center;gap:20px;padding:16px 24px;display:flex}.data-row:hover{border-color:var(--panel-border);background:#ffffff05}.row-thumb-wrap{background:#ffffff0d;border-radius:12px;place-items:center;width:56px;height:56px;display:grid;overflow:hidden}.row-thumb{object-fit:cover;width:100%;height:100%}.row-info{flex:1}.row-info h4{margin-bottom:4px;font-size:16px}.row-info p{color:var(--text-muted);font-size:14px}.row-info small{margin-top:4px;font-size:13px;display:block}.row-actions{gap:8px;display:flex}.grid-list{grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:20px;display:grid}.banner-card{border:1px solid var(--panel-border);transition:var(--transition);background:#0003;border-radius:20px;overflow:hidden}.banner-card:hover{border-color:var(--panel-border-hover);transform:translateY(-4px)}.banner-img-wrap{aspect-ratio:16/9;width:100%}.banner-img-wrap img{object-fit:cover;width:100%;height:100%}.banner-info{padding:20px}.banner-info h4{margin-bottom:4px}.filter-tabs{border-radius:16px;gap:8px;padding:8px;display:flex}.filter-tab{height:40px;color:var(--text-muted);cursor:pointer;transition:var(--transition);background:0 0;border:none;border-radius:12px;align-items:center;gap:8px;padding:0 18px;font-size:14px;font-weight:600;display:flex}.filter-tab:hover{color:var(--text-main);background:#ffffff0d}.filter-tab.active{background:var(--primary);color:#fff}.filter-count{background:#fff3;border-radius:99px;padding:1px 7px;font-size:12px;font-weight:700}.order-status-pill{white-space:nowrap;border-radius:99px;padding:5px 12px;font-size:12px;font-weight:700}.order-status-pill.lg{padding:8px 18px;font-size:15px}.order-row{border:1px solid var(--panel-border);transition:var(--transition);background:#00000026;border-radius:16px;padding:18px 24px}.order-row:hover{border-color:var(--panel-border-hover)}.order-row-main{grid-template-columns:130px 1fr 120px 150px auto;align-items:center;gap:16px;display:grid}.order-id-col{flex-direction:column;gap:4px;display:flex}.order-id{font-family:monospace;font-size:15px;font-weight:700}.order-time{color:var(--text-muted);font-size:12px}.order-customer{flex-direction:column;gap:3px;display:flex}.order-customer b{font-size:15px}.order-customer span{color:var(--text-muted);font-size:13px}.order-address{color:var(--text-muted);text-overflow:ellipsis;white-space:nowrap;max-width:200px;font-size:12px;overflow:hidden}.order-amount{flex-direction:column;gap:3px;display:flex}.order-amount b{font-size:18px;font-weight:800}.order-amount span{color:var(--text-muted);font-size:12px}.order-actions-col{justify-content:flex-end;gap:8px;display:flex}.order-quick-actions{border-top:1px solid var(--panel-border);flex-wrap:wrap;align-items:center;gap:10px;margin-top:14px;padding-top:14px;display:flex}.quick-action-label{color:var(--text-muted);font-size:13px;font-weight:600}.btn-status{cursor:pointer;height:36px;transition:var(--transition);color:var(--text-main);background:#ffffff14;border:none;border-radius:10px;padding:0 16px;font-size:13px;font-weight:700}.btn-status:hover:not(:disabled){transform:translateY(-1px)}.btn-status.accepted{color:#60a5fa;background:#3b82f626}.btn-status.accepted:hover{background:#3b82f64d}.btn-status.rejected{color:#f87171;background:#ef444426}.btn-status.rejected:hover{background:#ef44444d}.btn-status.preparing{color:#a78bfa;background:#8b5cf626}.btn-status.preparing:hover{background:#8b5cf64d}.btn-status.out_for_delivery{color:#fb923c;background:#f9731626}.btn-status.out_for_delivery:hover{background:#f973164d}.btn-status.delivered{color:#34d399;background:#10b98126}.btn-status.delivered:hover{background:#10b9814d}.order-detail-hero{border:1px solid var(--panel-border);border-radius:24px;margin-bottom:24px;padding:32px}.order-detail-header{justify-content:space-between;align-items:flex-start;margin-bottom:28px;display:flex}.order-detail-grid{grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:20px;display:grid}.order-progress{align-items:flex-start;gap:0;margin-top:12px;padding-bottom:4px;display:flex;overflow-x:auto}.progress-step{flex-direction:column;flex:1;align-items:center;gap:8px;min-width:90px;display:flex;position:relative}.progress-dot{border:2px solid var(--panel-border);width:20px;height:20px;transition:var(--transition);z-index:1;background:0 0;border-radius:50%}.progress-step.done .progress-dot{background:currentColor;border-color:currentColor}.progress-step span{color:var(--text-muted);text-align:center;font-size:11px;font-weight:600;line-height:1.2}.progress-step.done span{color:var(--text-main)}.progress-line{background:var(--panel-border);z-index:0;width:100%;height:2px;position:absolute;top:10px;left:50%}.progress-line.done{background:currentColor}.detail-rows{flex-direction:column;gap:0;display:flex}.detail-row{border-bottom:1px solid var(--panel-border);justify-content:space-between;align-items:center;gap:16px;padding:12px 0;display:flex}.detail-row:last-child{border-bottom:none}.detail-row span{color:var(--text-muted);flex-shrink:0;font-size:14px}.detail-row b{text-align:right;font-size:14px;font-weight:600}.detail-row.total b{color:var(--primary);font-size:18px}.metric-card{flex-direction:column;gap:8px;display:flex}.metric-icon{border-radius:14px;place-items:center;width:48px;height:48px;margin-bottom:4px;display:grid}.nav-badge{background:var(--primary);color:#fff;border-radius:99px;margin-left:auto;padding:2px 8px;font-size:11px;font-weight:800}.row-thumb-placeholder{width:100%;height:100%;color:var(--text-muted);place-items:center;display:grid}.upload-btn{cursor:pointer;-webkit-user-select:none;user-select:none}.order-status-badge{letter-spacing:.05em;background:#ffffff1a;border-radius:99px;padding:6px 14px;font-size:12px;font-weight:700}.login-screen{justify-content:center;align-items:center;min-height:100vh;padding:24px;display:flex}.login-card{width:100%;max-width:420px;padding:40px}.login-header{text-align:center;margin-bottom:32px}.logo-icon{background:linear-gradient(135deg, var(--primary), var(--primary-hover));width:64px;height:64px;box-shadow:0 12px 32px var(--primary-glow);color:#fff;border-radius:20px;place-items:center;margin:0 auto 20px;display:grid}.login-header h2{margin-bottom:8px;font-size:28px}.login-header p{color:var(--text-muted)}.login-form{flex-direction:column;gap:20px;display:flex}.error-message{color:#fca5a5;text-align:center;background:#ef44441a;border:1px solid #ef444433;border-radius:12px;padding:12px 16px;font-size:14px}.empty-state{text-align:center;color:var(--text-muted);border:1px dashed var(--panel-border);background:#0000001a;border-radius:16px;padding:40px}@media (width<=900px){.app-container{flex-direction:column}.sidebar{flex-direction:row;justify-content:space-between;align-items:center;width:auto;height:auto;margin:16px 16px 0;padding:16px;position:static}.sidebar-brand{margin-bottom:0}.sidebar-nav{flex-direction:row;flex:unset}.nav-item span{display:none}.nav-item{padding:12px}.main-content{padding:16px}}