*{box-sizing:border-box;font-family:system-ui,Arial,sans-serif}
body{margin:0;background:#0f1115;color:#e8eaed}
header{display:flex;justify-content:space-between;align-items:center;padding:12px 16px;background:#151923;border-bottom:1px solid #23283a}
nav{display:flex;gap:8px;padding:8px 16px;border-bottom:1px solid #23283a;background:#111521}
nav button{background:#1b2132;color:#e8eaed;border:1px solid #2a3350;padding:8px 12px;border-radius:8px;cursor:pointer}
nav button:hover{background:#222a40}
.login-card{max-width:360px;margin:80px auto;background:#151923;padding:24px;border-radius:12px;border:1px solid #23283a}
.login-card input{width:100%;margin:8px 0;padding:10px;border-radius:8px;border:1px solid #2a3350;background:#0f1422;color:#e8eaed}
.login-card button{width:100%;padding:10px;border-radius:8px;background:#3a6df0;border:none;color:white;cursor:pointer}
.dashboard.hidden,.tab.hidden,.hidden{display:none}
.section-header{display:flex;justify-content:space-between;align-items:center;padding:0 0 8px 0}
.filters{display:flex;gap:8px;flex-wrap:wrap}
.grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}
.create-order{background:#151923;border:1px solid #23283a;padding:12px;border-radius:12px;margin:12px 0}
.create-order button{padding:10px 14px;background:#3a6df0;border:none;color:white;border-radius:8px;cursor:pointer}
.msg{margin-top:8px;color:#9ecbff}
.alert{margin-top:12px;padding:10px;border-radius:8px;background:#40211f;color:#ffb4a9;border:1px solid #8a2a21}
.cards{display:flex;gap:12px;flex-wrap:wrap;margin-top:8px}
.card{background:#151923;border:1px solid #23283a;border-radius:12px;padding:12px;min-width:220px}
table{width:100%;border-collapse:collapse;margin-top:12px}
th,td{border-bottom:1px solid #23283a;padding:8px}
td button{margin-right:6px;padding:6px 10px;border-radius:6px;border:1px solid #2a3350;background:#1b2132;color:#e8eaed;cursor:pointer}
input,select{padding:8px;border-radius:8px;border:1px solid #2a3350;background:#0f1422;color:#e8eaed}
#trendChart{background:#151923;border:1px solid #23283a;border-radius:12px;margin-top:12px}
/* Keep headers and body perfectly aligned */
#ordersTable.table-fixed {
  width: 100%;
  border-collapse: collapse;
  table-layout: fixed;            /* <-- Critical for alignment */
}

/* Consistent padding and typography */
#ordersTable th,
#ordersTable td {
  padding: 10px 12px;
  text-align: left;
  vertical-align: middle;
  border-bottom: 1px solid rgba(255,255,255,0.08);
}

/* Prevent long values from pushing columns */
#ordersTable td,
#ordersTable th {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

/* Optional: sticky header if the table scrolls */
#ordersTable thead th {
  position: sticky;
  top: 0;
  background: #12151d;            /* match your header background */
  z-index: 2;
}

/* Make number columns centered if you prefer */
#ordersTable th:nth-child(3),
#ordersTable td:nth-child(3) {     /* Packs column */
  text-align: center;
}

/* Action buttons wrap nicely inside fixed column */
#ordersTable td:last-child button {
  margin: 2px 4px 2px 0;
}