/* Standalone OMS — light/blue theme (matches the dashboard redesign). */
*{box-sizing:border-box}
:root{--blue:#2563eb;--blue-d:#1d4ed8;--bg:#eef2f7;--card:#fff;--text:#1e293b;--muted:#64748b;--line:#e2e8f0;--green:#16a34a;--amber:#d97706;--red:#dc2626}
body{margin:0;font-family:system-ui,-apple-system,"Segoe UI",Roboto,Arial,sans-serif;background:var(--bg);color:var(--text)}
a{color:var(--blue)}
button{cursor:pointer;border:1px solid var(--line);background:#fff;border-radius:8px;padding:8px 14px;font-size:14px}
button.primary{background:var(--blue);color:#fff;border-color:var(--blue)}
button.primary:hover{background:var(--blue-d)}
button.danger{color:var(--red);border-color:#fecaca}
button:disabled{opacity:.5;cursor:not-allowed}
input,select,textarea{border:1px solid var(--line);border-radius:8px;padding:8px 10px;font-size:14px;width:100%;background:#fff}
label{font-size:13px;color:var(--muted);display:block;margin:10px 0 4px}
h1{font-size:24px;margin:0}h2{font-size:18px;margin:0 0 12px}h3{font-size:15px;margin:16px 0 8px}
/* Layout */
.layout{display:flex;min-height:100vh}
.sidebar{width:240px;background:#fff;border-right:1px solid var(--line);padding:16px 12px;position:sticky;top:0;height:100vh;overflow:auto}
.sidebar .logo{font-weight:800;font-size:20px;padding:4px 8px 16px}
.sidebar .logo span{color:var(--blue)}
.navbtn{display:flex;justify-content:space-between;align-items:center;width:100%;text-align:left;margin:2px 0;padding:10px 12px;border:none;background:none;font-size:15px;border-radius:8px}
.navbtn:hover{background:#f1f5f9}
.navbtn.active{background:var(--blue);color:#fff}
.navbtn .badge{background:var(--red);color:#fff;border-radius:999px;font-size:11px;padding:1px 7px}
.main{flex:1;min-width:0;padding:20px}
.topbar{display:flex;gap:12px;align-items:center;flex-wrap:wrap;margin-bottom:16px}
.topbar .search{flex:1;min-width:220px}
.topbar .search input{width:100%}
.hamburger{display:none}
.bell{position:relative}
.bell .dot{position:absolute;top:-4px;right:-4px;background:var(--red);color:#fff;border-radius:999px;font-size:11px;padding:1px 6px}
.card{background:var(--card);border:1px solid var(--line);border-radius:14px;padding:16px;margin-bottom:16px}
.grid6{display:grid;grid-template-columns:repeat(6,1fr);gap:12px}
.grid2{display:grid;grid-template-columns:1fr 1fr;gap:16px}
.grid3{display:grid;grid-template-columns:repeat(3,1fr);gap:12px}
.stat{border-radius:14px;padding:16px}
.stat .v{font-size:26px;font-weight:800}
.stat .t{font-size:13px;color:var(--muted)}
.stat .tr{font-size:12px;margin-top:4px}
.up{color:var(--green)}.down{color:var(--red)}
.pastel-blue{background:#eff6ff}.pastel-green{background:#f0fdf4}.pastel-amber{background:#fffbeb}.pastel-red{background:#fef2f2}.pastel-purple{background:#faf5ff}.pastel-teal{background:#f0fdfa}
.pill{display:inline-block;padding:2px 10px;border-radius:999px;font-size:12px;font-weight:600}
.pill.booked{background:#dcfce7;color:#166534}.pill.pending{background:#fef3c7;color:#92400e}.pill.confirmed{background:#dbeafe;color:#1e40af}
.pill.dispatched{background:#e0e7ff;color:#3730a3}.pill.delivered{background:#dcfce7;color:#166534}.pill.cancelled{background:#fee2e2;color:#991b1b}
.pill.returned{background:#ffedd5;color:#9a3412}.pill.new{background:#fef3c7;color:#92400e}
.pill.platform{background:#dbeafe;color:#1e40af}.pill.cod{background:#fef9c3;color:#854d0e}.pill.attn{background:#fee2e2;color:#991b1b}
table{width:100%;border-collapse:collapse;font-size:14px}
th{text-align:left;color:var(--muted);font-weight:600;padding:8px;border-bottom:1px solid var(--line)}
td{padding:9px 8px;border-bottom:1px solid #f1f5f9;vertical-align:top}
tr.clickable{cursor:pointer}tr.clickable:hover{background:#f8fafc}
.tabs{display:flex;gap:6px;flex-wrap:wrap;margin:12px 0}
.tab{padding:8px 14px;border-radius:999px;border:1px solid var(--line);background:#fff;font-size:14px}
.tab.active{background:var(--blue);color:#fff;border-color:var(--blue)}
.headercard{display:flex;justify-content:space-between;gap:16px;flex-wrap:wrap}
.headercard .title{font-size:26px;font-weight:800}
.headercard .sub{color:var(--muted);margin-top:2px}
.tags{display:flex;gap:8px;flex-wrap:wrap;align-items:center}
.timeline{position:relative;margin:8px 0}
.tl{display:flex;gap:12px;padding:10px 0;border-bottom:1px solid #f1f5f9}
.tl .dot{width:26px;height:26px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:14px;flex-shrink:0}
.tl.done .dot{background:#dcfce7;color:#166534}.tl.current .dot{background:var(--blue);color:#fff}.tl.upcoming .dot{background:#e2e8f0;color:#94a3b8}
.tl.current{background:#eff6ff;border-radius:10px;padding:10px}
.tl .when{margin-left:auto;color:var(--muted);font-size:12px;white-space:nowrap}
.note{background:#f8fafc;border:1px solid var(--line);border-radius:10px;padding:10px;margin:8px 0}
.note .meta{color:var(--muted);font-size:12px}
.alert{padding:10px 14px;border-radius:10px;margin-bottom:12px;font-size:14px}
.alert.warn{background:#fffbeb;border:1px solid #fde68a}.alert.err{background:#fef2f2;border:1px solid #fecaca}.alert.ok{background:#f0fdf4;border:1px solid #bbf7d0}
.muted{color:var(--muted);font-size:13px}
.row{display:flex;gap:10px;flex-wrap:wrap;align-items:end}
.row>*{flex:1;min-width:160px}
.flex{display:flex;gap:10px;flex-wrap:wrap;align-items:center}
.bar{height:8px;background:#e2e8f0;border-radius:999px;overflow:hidden}
.bar>i{display:block;height:100%;background:#22c55e}
.login{max-width:420px;margin:8vh auto;background:#fff;border:1px solid var(--line);border-radius:16px;padding:28px}
.login h1{margin-bottom:4px}
.progress{display:flex;gap:6px;align-items:center}
.progress .seg{height:8px;flex:1;background:#e2e8f0;border-radius:999px}
.progress .seg.on{background:var(--blue)}
@media(max-width:900px){
  .grid6{grid-template-columns:repeat(2,1fr)}.grid3{grid-template-columns:1fr}.grid2{grid-template-columns:1fr}
  .sidebar{position:fixed;left:-260px;top:0;z-index:50;transition:left .2s;box-shadow:0 0 30px rgba(0,0,0,.2)}
  .sidebar.open{left:0}
  .hamburger{display:inline-block}
  .main{padding:12px}
}
