/* Hidden Stowarly Maritime theme presets.
   No selector is exposed in the UI. The active theme is set in theme-config.js. */

:root,
html[data-theme="marine"] {
  --bg: #0b1220;
  --panel: #111b2d;
  --panel2: #162239;
  --border: #26354f;
  --text: #edf3fb;
  --muted: #8fa0b8;
  --accent: #36a3ff;
  --green: #37d67a;
  --red: #ff5d6c;
  --theme-topbar: #0d1626;
  --theme-input: #0c1422;
  --theme-inner: #0e1828;
  --theme-hover: #3c5377;
  --theme-accent-soft: rgba(54,163,255,.12);
  --theme-shadow: rgba(0,0,0,.18);
}

html[data-theme="graphite"] {
  --bg: #0d0f12;
  --panel: #171a1f;
  --panel2: #1e2228;
  --border: #343a43;
  --text: #f1f3f5;
  --muted: #9ca3ad;
  --accent: #b7c0ca;
  --green: #51d88a;
  --red: #ff6875;
  --theme-topbar: #111419;
  --theme-input: #101318;
  --theme-inner: #1a1e24;
  --theme-hover: #555e69;
  --theme-accent-soft: rgba(183,192,202,.12);
  --theme-shadow: rgba(0,0,0,.28);
}

html[data-theme="emerald"] {
  --bg: #071611;
  --panel: #0d221a;
  --panel2: #123025;
  --border: #235141;
  --text: #eafbf4;
  --muted: #8fb6a8;
  --accent: #30d99a;
  --green: #55e69b;
  --red: #ff6675;
  --theme-topbar: #091b15;
  --theme-input: #091a14;
  --theme-inner: #10291f;
  --theme-hover: #347b62;
  --theme-accent-soft: rgba(48,217,154,.12);
  --theme-shadow: rgba(0,0,0,.24);
}

html[data-theme="crimson"] {
  --bg: #18090d;
  --panel: #261015;
  --panel2: #34161d;
  --border: #5b2935;
  --text: #fff0f3;
  --muted: #c0969f;
  --accent: #ff526d;
  --green: #4fd58c;
  --red: #ff526d;
  --theme-topbar: #1f0b11;
  --theme-input: #1d0c11;
  --theme-inner: #2d1319;
  --theme-hover: #8a3b4d;
  --theme-accent-soft: rgba(255,82,109,.12);
  --theme-shadow: rgba(0,0,0,.28);
}

html[data-theme="amber"] {
  --bg: #171108;
  --panel: #241b0d;
  --panel2: #312512;
  --border: #5a4724;
  --text: #fff7e8;
  --muted: #c1ad86;
  --accent: #ffb52e;
  --green: #55dc8b;
  --red: #ff675f;
  --theme-topbar: #1c150a;
  --theme-input: #1b140a;
  --theme-inner: #2b210f;
  --theme-hover: #85672f;
  --theme-accent-soft: rgba(255,181,46,.12);
  --theme-shadow: rgba(0,0,0,.25);
}

html[data-theme="violet"] {
  --bg: #100b1c;
  --panel: #191228;
  --panel2: #241937;
  --border: #46345f;
  --text: #f5efff;
  --muted: #aa98c2;
  --accent: #a977ff;
  --green: #55dc93;
  --red: #ff607a;
  --theme-topbar: #140e22;
  --theme-input: #130d20;
  --theme-inner: #20162f;
  --theme-hover: #6a4d8f;
  --theme-accent-soft: rgba(169,119,255,.13);
  --theme-shadow: rgba(0,0,0,.27);
}

/* Convert the remaining common hard-coded dark surfaces to theme tokens. */
.topbar { background: var(--theme-topbar) !important; }
.login-card input,
.field input,
.field select,
.dev-input { background: var(--theme-input) !important; color: var(--text) !important; border-color: var(--border) !important; }
.check-card,
.permission-card,
.device-card-body div,
.dev-card,
.dev-secret,
.dev-tab { background: var(--theme-inner) !important; border-color: var(--border) !important; color: var(--text) !important; }
.vessel-card:hover,
.admin-card:hover,
.device-card:hover { border-color: var(--theme-hover) !important; }
.admin-icon,
.role-pill { background: var(--theme-accent-soft) !important; color: var(--accent) !important; }
.admin-card,
.summary-card,
.vessel-card,
.device-card,
.panel,
.form-panel,
.table-panel,
.notification-vessel-card,
.login-card,
.dev-card { box-shadow: 0 8px 30px var(--theme-shadow) !important; }

/* Brand, controls and links all follow the active accent. */
.brand span,
.login-brand span,
.eyebrow,
.open-row,
.admin-link,
td.right a,
.role-pill,
.back-link:hover { color: var(--accent) !important; }
.primary-btn,
.login-card button,
.dev-btn { background: var(--accent) !important; }
input[type="checkbox"], input[type="radio"] { accent-color: var(--accent); }