/* ========================================================================== */
/* DARK MODE → SYSTEM — TABLES                                                */
/* ========================================================================== */

/* ── table cell severity tints ── */
body.dark-mode td.cell-ok   { color: #4ade80; }
body.dark-mode td.cell-warn { color: #fbbf24; }
body.dark-mode td.cell-crit { color: #f87171; }

/* ── cell-gradient dark — parity with stat-value dark formula ── */
body.dark-mode td.cell-gradient {
    color: hsl(calc(120 - var(--cell-pct, 0) * 1.2), 78%, 68%);
}

/* ── last-error-text in dark ── */
body.dark-mode .last-error-text { color: rgba(255, 255, 255, 0.60); }

/* ── Enhanced tables — dark headers: clean neutral (no gradient, no blue border) ── */
body.dark-mode .service-system-table thead th,
body.dark-mode .security-system-table thead th,
body.dark-mode .device-system-table thead th {
    background: rgba(255, 255, 255, 0.05);
    border-bottom: none;
}

/* ── name column in dark ── */
body.dark-mode .service-system-table td:first-child,
body.dark-mode .security-system-table td:first-child,
body.dark-mode .device-system-table td:first-child {
    color: rgba(255, 255, 255, 0.82);
}

/* ── uptime column in dark ── */
body.dark-mode .service-system-table td:nth-child(2) {
    color: rgba(255, 255, 255, 0.43);
}

/* ── zebra rows in dark ── */
body.dark-mode .service-system-table tbody tr:nth-child(even),
body.dark-mode .security-system-table tbody tr:nth-child(even),
body.dark-mode .device-system-table tbody tr:nth-child(even) {
    background: rgba(255, 255, 255, 0.022);
}

/* ── stronger hover in dark ── */
body.dark-mode .service-system-table tbody tr:hover,
body.dark-mode .security-system-table tbody tr:hover,
body.dark-mode .device-system-table tbody tr:hover {
    background: rgba(45, 100, 216, 0.10) !important;
}

/* ── last-error code pill in dark ── */
body.dark-mode .service-system-table .last-error-text {
    color: rgba(255, 255, 255, 0.40);
    background: rgba(255, 255, 255, 0.05);
    border-color: rgba(255, 255, 255, 0.08);
}

/* ── badge pills in dark ── */
body.dark-mode .badge.ok {
    background: rgba(74, 222, 128, 0.14);
    color: #4ade80;
}

body.dark-mode .badge.warn {
    background: rgba(251, 191, 36, 0.14);
    color: #fbbf24;
}