/* ========================================================================== */
/* DARK MODE → SYSTEM — MODALS                                                */
/* ========================================================================== */

/* ── SM MODAL hero ── */
body.dark-mode .sm-modal-hero-title            { color: rgba(255, 255, 255, 0.88); }
body.dark-mode .sm-modal-hero-sub              { color: rgba(255, 255, 255, 0.44); }
body.dark-mode .sm-modal .sm-modal-hero        { border-bottom-color: rgba(255, 255, 255, 0.08); }
body.dark-mode .sm-modal-hero-icon             { background: rgba(45, 100, 216, 0.22); color: #93b8ff; }
body.dark-mode .sm-icon-security               { background: rgba(234, 88, 12, 0.18); color: #fb923c; }
body.dark-mode .sm-icon-device                 { background: rgba(255, 255, 255, 0.10); color: rgba(255, 255, 255, 0.72); }
body.dark-mode .sm-icon-issues                 { color: #fbbf24; }
body.dark-mode .sm-icon-ok                     { color: #4ade80; }

/* ── close btn ── */
body.dark-mode .sm-modal .sm-close-btn         { color: rgba(255, 255, 255, 0.55); }
body.dark-mode .sm-modal .sm-close-btn:hover   { background: rgba(255, 255, 255, 0.08); color: rgba(255, 255, 255, 0.90); }

/* ── meta chip bar ── */
body.dark-mode .sm-modal-meta                  { border-bottom-color: rgba(255, 255, 255, 0.06); }
body.dark-mode .sm-meta-chip                   { background: rgba(255, 255, 255, 0.07); color: rgba(255, 255, 255, 0.72); }
body.dark-mode .sm-chip-live                   { background: rgba(74, 222, 128, 0.12); color: #4ade80; }
body.dark-mode .sm-chip-warn                   { background: rgba(251, 191, 36, 0.12); color: #fbbf24; }

/* ── state containers ── */
body.dark-mode .sm-state-text                  { color: rgba(255, 255, 255, 0.50); }
body.dark-mode .sm-state-icon                  { color: rgba(255, 255, 255, 0.20); }
body.dark-mode .sm-modal-state.sm-state-error .sm-state-icon { color: #f87171; }
body.dark-mode .sm-modal-state.sm-state-ok    .sm-state-icon { color: #4ade80; }

/* ── device stat chips ── */
body.dark-mode .sm-stat-chip                   { background: rgba(255, 255, 255, 0.04); border-color: rgba(255, 255, 255, 0.08); }
body.dark-mode .sm-stat-chip-label             { color: rgba(255, 255, 255, 0.44); }
body.dark-mode .sm-stat-chip-value             { color: rgba(255, 255, 255, 0.82); }
body.dark-mode .sm-stat-chip-icon              { color: rgba(255, 255, 255, 0.40); }

body.dark-mode .sm-val-ok                      { color: #4ade80; }
body.dark-mode .sm-val-warn                    { color: #fbbf24; }
body.dark-mode .sm-val-crit                    { color: #f87171; }

/* ── device meta row ── */
body.dark-mode .sm-device-meta                 { color: rgba(255, 255, 255, 0.44); border-bottom-color: rgba(255, 255, 255, 0.06); }
body.dark-mode .sm-device-meta-icon            { color: rgba(255, 255, 255, 0.40); }

/* ── status badges ── */
body.dark-mode .sm-badge-ok                    { background: rgba(74, 222, 128, 0.14);  color: #4ade80; }
body.dark-mode .sm-badge-warn                  { background: rgba(251, 191, 36, 0.14);  color: #fbbf24; }
body.dark-mode .sm-badge-offline               { background: rgba(255, 255, 255, 0.08); color: rgba(255, 255, 255, 0.50); }

/* ── section label ── */
body.dark-mode .sm-section-label               { color: rgba(255, 255, 255, 0.70); }

/* ── log block top-border accents ── */
body.dark-mode .sm-log-security                { border-top-color: #fb923c; }
body.dark-mode .sm-log-issues                  { border-top-color: #fbbf24; }
