/* ems500 共用樣式（覆寫 common.css 的綠色系為 ems500 藍色系） */
.btn-primary { background:#0369a1; color:#fff; }
.btn-primary:hover { background:#075985; }
.btn-primary:disabled, .btn:disabled { opacity:.5; cursor:not-allowed; }
.btn-sm { padding:.3rem .6rem; font-size:.72rem; }
.chip.active { background:#0369a1; border-color:#0369a1; }
.field input:focus, .field select:focus, .field textarea:focus { border-color:#0ea5e9; box-shadow:0 0 0 3px rgba(14,165,233,.15); }
.switch input:checked ~ .switch-track { background:#0ea5e9; }

.card { background:#fff; border-radius:.9rem; border:1px solid #e2e8f0; }
.kpi-label { font-size:.72rem; color:#64748b; font-weight:600; }
.kpi-value { font-size:1.5rem; font-weight:800; color:#0f172a; font-family:'Inter','Noto Sans TC',sans-serif; font-variant-numeric:tabular-nums; }

/* 側欄 */
.ems-side { width:15rem; background:#0b1220; color:#cbd5e1; flex-shrink:0; }
.ems-side a.nav { display:flex; align-items:center; gap:.65rem; padding:.55rem .9rem; margin:.1rem .6rem; border-radius:.55rem; font-size:.85rem; color:#cbd5e1; }
.ems-side a.nav:hover { background:#1f2937; color:#fff; }
.ems-side a.nav.active { background:#0369a1; color:#fff; }
@media (max-width: 1023px) {
  .ems-side { position:fixed; inset:0 auto 0 0; z-index:60; transform:translateX(-100%); transition:transform .2s; }
  .ems-side.open { transform:none; box-shadow: 0 0 0 100vmax rgba(15,23,42,.45); }
}

/* 表格 */
.tbl { width:100%; font-size:.82rem; border-collapse:collapse; }
.tbl th { text-align:left; font-size:.7rem; color:#64748b; font-weight:600; padding:.55rem .75rem; border-bottom:1px solid #e2e8f0; background:#f8fafc; white-space:nowrap; }
.tbl td { padding:.6rem .75rem; border-bottom:1px solid #f1f5f9; vertical-align:middle; }
.tbl tr.clickable { cursor:pointer; }
.tbl tr.clickable:hover td { background:#f8fafc; }
.tbl-wrap { overflow-x:auto; }

.tag { display:inline-flex; align-items:center; gap:.25rem; padding:.12rem .5rem; border-radius:999px; font-size:.68rem; font-weight:600; white-space:nowrap; }
.tag-slate { background:#f1f5f9; color:#475569; }
.tag-blue { background:#e0f2fe; color:#0369a1; }
.tag-green { background:#dcfce7; color:#15803d; }
.tag-amber { background:#fef3c7; color:#b45309; }
.tag-red { background:#ffe4e6; color:#be123c; }
.tag-violet { background:#ede9fe; color:#6d28d9; }

.empty { text-align:center; color:#94a3b8; font-size:.85rem; padding:2.5rem 1rem; }
.spin { width:1.2rem; height:1.2rem; border:2px solid #cbd5e1; border-top-color:#0369a1; border-radius:999px; animation:ems-spin .7s linear infinite; display:inline-block; }
@keyframes ems-spin { to { transform: rotate(360deg); } }