/* JANUS · Terminal theme
   One skin for every page: black surfaces, Arial type, square edges, blue accent.
   Injected last into every HTML page by app.py, so it re-points each page's own design
   tokens and normalises the shared components without touching the per-page sheets. */

/* ── Tokens ─────────────────────────────────────────────── */
:root,
:root[data-theme="dark"],
:root[data-theme="light"] {
  color-scheme: dark;

  --t-bg: #000;
  --t-panel: #0a0a0a;
  --t-panel-2: #111;
  --t-line: #2a2a2a;
  --t-line-soft: #161616;
  --t-text: #e6e6e6;
  --t-muted: #8c8c8c;
  --t-blue: #00b0ff;
  --t-blue-dim: #0a6ea3;
  --t-blue-wash: rgba(0, 176, 255, 0.12);
  --t-pos: #4ec96a;
  --t-neg: #ff5f56;
  --t-mono: Arial, Helvetica, sans-serif;

  /* Re-pointed page tokens (index / home / contact / login / docs / styles) */
  --bg-body: var(--t-bg);
  --bg: var(--t-bg);
  --card-bg: var(--t-panel);
  --card: var(--t-panel);
  --panel2: var(--t-panel-2);
  --text-main: var(--t-text);
  --text: var(--t-text);
  --text-muted: var(--t-muted);
  --muted: var(--t-muted);
  --border: var(--t-line);
  --stroke: var(--t-line);
  --accent: var(--t-blue);
  --accent2: var(--t-blue);
  --accent-soft: var(--t-blue-wash);
  --accent-glow: transparent;
  --brand-dark: var(--t-text);
  --brand-mid: #cfcfcf;
  --brand-light: var(--t-blue);
  --good: var(--t-pos);
  --green: var(--t-pos);
  --bad: var(--t-neg);
  --red: var(--t-neg);
  --yellow: #e0b341;
  --code-bg: #050505;
  --code-text: var(--t-text);
  --shadow: none;
  --shadow-card: none;
  --shadow-soft: none;
  --radius: 0px;
  --radius-xl: 0px;
  --radius-lg: 0px;
  --radius-md: 0px;

  /* Compare page: the amber terminal accent becomes blue */
  --cmp-amber: var(--t-blue);
  --cmp-amber-dim: var(--t-blue-dim);
}

/* Compare page defines its tokens on .cmp-wrap; re-point them there too */
.cmp-wrap {
  --cmp-amber: var(--t-blue);
  --cmp-amber-dim: var(--t-blue-dim);
  --cmp-crosshair: rgba(0, 176, 255, 0.55);
  --accent: var(--t-blue);
  --accent-soft: var(--t-blue-wash);
}

/* ── Base ───────────────────────────────────────────────── */
html,
body {
  background: var(--t-bg) !important;
  color: var(--t-text);
}

body::before,
body::after { display: none !important; }

body,
button,
input,
select,
textarea,
table,
code,
pre {
  font-family: var(--t-mono) !important;
}

body { font-size: 13px; }

::selection { background: var(--t-blue); color: #000; }

a { color: var(--t-blue); }

h1, h2, h3, h4 { color: var(--t-text); letter-spacing: 0.01em; }

*,
*::before,
*::after {
  border-radius: 0 !important;
  box-shadow: none !important;
  text-shadow: none !important;
}

/* Keep circles that are meant to be circles */
.user-avatar,
.user-status-dot,
.udrop-avatar,
.janus-avatar,
.janus-fab,
.dot,
.status-dot,
.profile-img { border-radius: 50% !important; }

/* Scrollbars */
* { scrollbar-color: #333 #000; scrollbar-width: thin; }
::-webkit-scrollbar { width: 10px; height: 10px; background: #000; }
::-webkit-scrollbar-thumb { background: #333; border: 2px solid #000; }
::-webkit-scrollbar-thumb:hover { background: var(--t-blue-dim); }

/* ── Top bar & sidebar (all pages) ──────────────────────── */
.top-nav,
.topbar,
header.top-nav {
  background: var(--t-bg) !important;
  border-bottom: 1px solid var(--t-line) !important;
  backdrop-filter: none !important;
}

.brand-title { color: var(--t-text) !important; }
.brand-title span { color: var(--t-blue) !important; }
.brand-sub { color: var(--t-muted) !important; }

.nav-links a,
.top-nav-links a {
  color: var(--t-muted) !important;
  text-transform: uppercase;
  font-size: 12px;
  letter-spacing: 0.06em;
}

.nav-links a:hover,
.top-nav-links a:hover,
.nav-links a.active,
.top-nav-links a.active,
.top-nav-links a[aria-current="page"] { color: var(--t-blue) !important; }

.nav-links a:hover::after,
.top-nav-links a::after { background: var(--t-blue) !important; }

.nav-links.nav-open,
.top-nav-links.nav-open { background: var(--t-bg) !important; border-color: var(--t-line) !important; }

.nav-hamburger span { background: #b5b5b5 !important; }

.sidebar {
  background: var(--t-bg) !important;
  border-right: 1px solid var(--t-line) !important;
  backdrop-filter: none !important;
}

.sidebar-search,
.sidebar-search input,
.sidebar-footcard {
  background: var(--t-bg) !important;
  border-color: var(--t-line) !important;
}

.menu-eyebrow,
.footcard-title { color: var(--t-blue) !important; }

.nav-item {
  color: #b5b5b5 !important;
  background: transparent !important;
  border: 1px solid transparent !important;
  text-transform: uppercase;
  font-size: 12px !important;
  letter-spacing: 0.04em;
}

.nav-item:hover { color: var(--t-blue) !important; background: var(--t-panel-2) !important; }
.nav-item.active { color: #000 !important; background: var(--t-blue) !important; border-color: var(--t-blue) !important; }
.nav-item.active .nav-svg,
.nav-item.active svg { fill: #000; stroke: #000; }

.pill,
.footcard-pills .pill { background: var(--t-panel-2) !important; color: #b5b5b5 !important; border-color: var(--t-line) !important; }

/* Light/dark switch: the terminal theme is dark-only */
#themeToggle,
.theme-toggle { display: none !important; }

/* User menu */
.user-dropdown { background: var(--t-panel) !important; border: 1px solid var(--t-line) !important; }
.user-avatar { background: var(--t-panel) !important; border-color: var(--t-blue) !important; color: var(--t-text) !important; }

/* ── Surfaces ───────────────────────────────────────────── */
.card,
.panel,
.page-panel > .card,
.cmp-card,
.feature-card,
.content-card,
section.card {
  background: var(--t-panel) !important;
  border: 1px solid var(--t-line) !important;
  backdrop-filter: none !important;
}

.card-head h2,
.card h2,
.card h3 {
  color: var(--t-blue) !important;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  font-size: 12px !important;
  font-weight: 700;
}

.card-sub,
.muted,
.hint { color: var(--t-muted) !important; }

/* ── Buttons ────────────────────────────────────────────── */
.btn,
.btn-primary,
.btn-ghost,
.btn-mini,
.cbar-btn,
.discover-run-btn,
.analyst-btn-pdf,
.analyst-btn-docx,
.analyst-btn-extend,
.login-btn,
input[type="submit"],
a.btn,
a.button,
.cta,
.cta-btn {
  font-family: var(--t-mono) !important;
  text-transform: uppercase;
  letter-spacing: 0.06em;
}

.btn-primary,
.cbar-btn,
.discover-run-btn,
.analyst-btn-pdf,
.login-btn,
button[type="submit"],
input[type="submit"],
a.btn-primary,
.cta-primary {
  background: var(--t-blue) !important;
  border: 1px solid var(--t-blue) !important;
  color: #000 !important;
  font-weight: 700 !important;
}

.btn-primary:hover,
.cbar-btn:hover,
.discover-run-btn:hover,
.analyst-btn-pdf:hover,
.login-btn:hover,
button[type="submit"]:hover,
input[type="submit"]:hover,
a.btn-primary:hover,
.cta-primary:hover { background: #33c1ff !important; border-color: #33c1ff !important; }

.btn-primary:disabled,
.btn-primary[disabled],
button[type="submit"]:disabled {
  background: var(--t-panel-2) !important;
  border-color: var(--t-line) !important;
  color: #555 !important;
  cursor: not-allowed;
}

.btn-ghost,
.btn-mini,
.analyst-btn-docx,
.analyst-btn-extend,
.btn-secondary,
a.btn-ghost,
.cta-secondary {
  background: transparent !important;
  border: 1px solid var(--t-line) !important;
  color: var(--t-text) !important;
}

.btn-ghost:hover,
.btn-mini:hover,
.analyst-btn-docx:hover,
.analyst-btn-extend:hover,
.btn-secondary:hover,
a.btn-ghost:hover,
.cta-secondary:hover { border-color: var(--t-blue) !important; color: var(--t-blue) !important; }

.btn-mini.danger,
.danger { color: var(--t-neg) !important; }

/* Segmented presets (range buttons, tabs) */
.cbar-preset,
.dctrl-presets button,
.manage-tab,
.cmp-presets button {
  background: var(--t-bg) !important;
  border: 1px solid var(--t-line) !important;
  color: var(--t-muted) !important;
  font-family: var(--t-mono) !important;
  text-transform: uppercase;
  font-size: 11px !important;
}

.cbar-preset:hover,
.dctrl-presets button:hover,
.manage-tab:hover,
.cmp-presets button:hover { color: var(--t-blue) !important; }

.cbar-preset.active,
.dctrl-presets button.active,
.manage-tab.active,
.cmp-presets button.active { background: var(--t-blue) !important; border-color: var(--t-blue) !important; color: #000 !important; }

/* ── Form controls ──────────────────────────────────────── */
input[type="text"],
input[type="email"],
input[type="password"],
input[type="search"],
input[type="number"],
input[type="date"],
input:not([type]),
select,
textarea,
.cbar-select,
.cbar-date,
.cbar-number,
.dctrl-input {
  background: var(--t-bg) !important;
  color: var(--t-text) !important;
  border: 1px solid var(--t-line) !important;
  font-family: var(--t-mono) !important;
}

input::placeholder,
textarea::placeholder { color: #5c5c5c !important; text-transform: uppercase; }

input:focus,
select:focus,
textarea:focus {
  outline: none !important;
  border-color: var(--t-blue) !important;
}

input[type="checkbox"],
input[type="radio"] { accent-color: var(--t-blue); }

input[type="date"]::-webkit-calendar-picker-indicator { filter: invert(0.7); }

label,
.cbar-label,
.dctrl-label {
  color: var(--t-muted);
}

.cbar-label,
.dctrl-label,
.cmp-label {
  color: var(--t-blue) !important;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  font-weight: 700;
}

.controls-bar,
.discover-controls {
  background: var(--t-panel) !important;
  border: 1px solid var(--t-line) !important;
  backdrop-filter: none !important;
}

/* ── Tables ─────────────────────────────────────────────── */
table { font-variant-numeric: tabular-nums; }

th {
  background: var(--t-panel-2) !important;
  color: var(--t-blue) !important;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  font-size: 11px !important;
  border-color: var(--t-line) !important;
}

td {
  border-color: var(--t-line-soft) !important;
  color: var(--t-text);
}

tbody tr:hover td { background: #04131c !important; }

.table-wrap,
.discover-table-wrap,
.cmp-table-wrap { border-color: var(--t-line) !important; }

/* ── Status / feedback text ─────────────────────────────── */
.status { color: var(--t-blue-dim) !important; text-transform: uppercase; font-size: 11px; }

/* ── Janus AI panel ─────────────────────────────────────── */
.janus-panel {
  background: var(--t-bg) !important;
  border-left: 1px solid var(--t-line) !important;
}

.janus-header { background: var(--t-blue) !important; color: #000 !important; border-bottom: none !important; }
.janus-header *,
.janus-title,
.janus-title span,
.janus-status { color: #000 !important; }
.janus-avatar { background: #000 !important; }
.janus-avatar svg { stroke: var(--t-blue) !important; fill: none; }
.janus-close { background: transparent !important; border-color: #000 !important; color: #000 !important; }

.janus-messages { background: var(--t-bg) !important; }
.janus-msg,
.janus-bubble { border: 1px solid var(--t-line) !important; background: var(--t-panel) !important; color: var(--t-text) !important; }
.janus-msg.user,
.janus-bubble.user { border-color: var(--t-blue-dim) !important; }

.janus-form { background: var(--t-bg) !important; border-top: 1px solid var(--t-line) !important; }
.janus-send { background: var(--t-blue) !important; color: #000 !important; border: none !important; }

.janus-fab { background: var(--t-blue) !important; color: #000 !important; }

/* ── Coliseo frame wrapper inside Janus ─────────────────── */
.coliseo-frame-wrap,
.coliseo-frame { background: var(--t-bg) !important; border-color: var(--t-line) !important; }

/* Names keep their case (strategy ids, portfolio ids) */
.cmp-chip,
.cmp-table td,
.cmp-input,
.cmp-input::placeholder { text-transform: none !important; }

/* ── Header / sidebar details ───────────────────────────── */
.brand { background: transparent !important; border: none !important; }
.sidebar-search { border: 1px solid var(--t-line) !important; }
.sidebar-search input { border: none !important; background: transparent !important; }
.sidebar-search input::placeholder { text-transform: uppercase; }
.lang-btn { background: var(--t-bg) !important; color: var(--t-muted) !important; border: none !important; }
.lang-btn.active { background: var(--t-blue) !important; color: #000 !important; }
.lang-toggle { border-color: var(--t-line) !important; }

/* Footers */
footer,
.footer,
.site-footer {
  background: var(--t-bg) !important;
  border-top: 1px solid var(--t-line) !important;
  color: var(--t-muted) !important;
  font-size: 11px;
}

/* ── Home ───────────────────────────────────────────────── */
.hero-centered {
  background:
    linear-gradient(to right, rgba(0, 176, 255, 0.07) 1px, transparent 1px),
    linear-gradient(to bottom, rgba(0, 176, 255, 0.07) 1px, transparent 1px) !important;
  background-size: 40px 40px !important;
  border-bottom: 1px solid var(--t-line) !important;
}

.hero-centered-eyebrow,
.section-eyebrow,
.eyebrow { color: var(--t-blue) !important; }

.layer-card,
.layer-visual,
.layer-highlight-box,
.layer-chip,
.lv-step,
.card-footer-pill,
.strip-item,
.h-dropdown {
  background: var(--t-panel) !important;
  border: 1px solid var(--t-line) !important;
  color: var(--t-text) !important;
}

.layer-card::before,
.lv-block,
.lv-line { background: var(--t-line) !important; }
.chip-dot,
.card-bullet { background: var(--t-blue) !important; }
.strip-item * ,
.layer-card * { color: inherit; }
.strip-item strong,
.strip-item b,
.strip-item h3,
.strip-item h4 { color: var(--t-blue) !important; }
.h-user-avatar { background: var(--t-panel) !important; border: 1px solid var(--t-blue) !important; color: var(--t-text) !important; }
.h-drop-name { color: var(--t-text) !important; }
.h-org-badge { background: var(--t-blue-wash) !important; color: var(--t-blue) !important; }
.h-drop-item:hover,
.h-drop-logout:hover { background: var(--t-panel-2) !important; }

/* ── Contact ────────────────────────────────────────────── */
.institutional {
  background: var(--t-panel) !important;
  border: 1px solid var(--t-line) !important;
  border-top: 2px solid var(--t-blue) !important;
}

.institutional-label { color: var(--t-blue) !important; }
.institutional-title { color: var(--t-text) !important; }
.institutional-text { color: var(--t-muted) !important; }

.institutional-email {
  color: #000 !important;
  background: var(--t-blue) !important;
  border-color: var(--t-blue) !important;
  font-weight: 700 !important;
}

.institutional-email:hover { background: #33c1ff !important; }

/* ── API docs ───────────────────────────────────────────── */
.endpoint-card { background: var(--t-panel) !important; border: 1px solid var(--t-line) !important; }
.endpoint-header { background: var(--t-panel-2) !important; border-bottom: 1px solid var(--t-line) !important; }
.endpoint-method { background: var(--t-blue) !important; color: #000 !important; }
.endpoint-path { color: var(--t-text) !important; }
.endpoint-desc { color: var(--t-muted) !important; }

.response-schema,
.auth-method code,
.params-table td code {
  background: #050505 !important;
  border: 1px solid var(--t-line) !important;
  color: var(--t-text) !important;
}

.params-table th,
.error-table th { background: var(--t-panel-2) !important; }
.badge-post { background: var(--t-blue-wash) !important; color: var(--t-blue) !important; }
.badge-get { background: rgba(78, 201, 106, 0.14) !important; color: var(--t-pos) !important; }
.http-2xx { background: rgba(78, 201, 106, 0.14) !important; color: var(--t-pos) !important; }
.http-4xx { background: rgba(255, 95, 86, 0.14) !important; color: var(--t-neg) !important; }
.http-5xx { background: rgba(224, 179, 65, 0.14) !important; color: #e0b341 !important; }

.tab-bar { background: var(--t-panel-2) !important; border-color: var(--t-line) !important; }
.tab-btn { background: transparent !important; color: var(--t-muted) !important; border: none !important; }
.tab-btn.active { color: var(--t-blue) !important; box-shadow: inset 0 -2px 0 var(--t-blue) !important; }
pre { background: #050505 !important; border: 1px solid var(--t-line) !important; }

/* Docs sidebar */
.docs-sidebar,
aside.sidebar nav { background: var(--t-bg) !important; }

/* ── Notice boxes (docs note, feedback disclaimers) ─────── */
.note-box,
.ai-disclaimer,
.fb-disclaimer,
.alert-warn {
  background: rgba(224, 179, 65, 0.07) !important;
  border: 1px solid rgba(224, 179, 65, 0.35) !important;
  border-left: 3px solid #e0b341 !important;
  color: #d9c38a !important;
}

.note-box *,
.ai-disclaimer *,
.fb-disclaimer * { color: inherit !important; }
.note-box strong,
.ai-disclaimer strong,
.fb-disclaimer strong,
.ai-disclaimer-title,
.fb-disclaimer-title { color: #e0b341 !important; }

/* The issue lists were flex rows, which split sentences around <strong> */
.ai-issues li,
.fb-issues li { display: block !important; }
.ai-issues li::before,
.fb-issues li::before { margin-right: 0.5rem; color: #e0b341 !important; }

.alert-error { background: rgba(255, 95, 86, 0.08) !important; border: 1px solid rgba(255, 95, 86, 0.4) !important; color: var(--t-neg) !important; }
.alert-success { background: rgba(78, 201, 106, 0.08) !important; border: 1px solid rgba(78, 201, 106, 0.4) !important; color: var(--t-pos) !important; }
.login-error { background: rgba(255, 95, 86, 0.08) !important; border: 1px solid rgba(255, 95, 86, 0.4) !important; color: var(--t-neg) !important; }

/* ── Account ────────────────────────────────────────────── */
.section-card {
  background: var(--t-panel) !important;
  border: 1px solid var(--t-line) !important;
}

.section-icon { background: var(--t-panel-2) !important; border: 1px solid var(--t-line) !important; }
.section-title,
.account-title { color: var(--t-text) !important; }
.section-desc,
.account-sub,
.form-label { color: var(--t-muted) !important; }
.form-input { background: var(--t-bg) !important; color: var(--t-text) !important; border: 1px solid var(--t-line) !important; }
.form-input:focus { border-color: var(--t-blue) !important; }

.btn-danger {
  background: transparent !important;
  border: 1px solid var(--t-neg) !important;
  color: var(--t-neg) !important;
  font-weight: 700 !important;
  text-transform: uppercase;
  letter-spacing: 0.06em;
}

.btn-danger:hover { background: rgba(255, 95, 86, 0.1) !important; }
.badge-on { background: var(--t-blue-wash) !important; color: var(--t-blue) !important; border: 1px solid var(--t-blue-dim) !important; }
.badge-off { background: var(--t-panel-2) !important; color: var(--t-muted) !important; border: 1px solid var(--t-line) !important; }
.back-link { color: var(--t-blue) !important; }

/* Appearance card: the terminal theme is dark-only, so hide the light/dark
   switch and keep only the profile icon picker */
.theme-options:has(#themeOptLight) { display: none !important; }
#appearance .opt-label { margin-top: 0 !important; }
#appearance .theme-opt[data-avatar-value] { border-radius: 0 !important; }

/* ── Late fixes ─────────────────────────────────────────── */
/* Inline code chips carry inline light backgrounds in the docs markup */
code[style] {
  background: #050505 !important;
  color: var(--t-blue) !important;
  border: 1px solid var(--t-line) !important;
}

.rs-key { color: var(--t-blue) !important; }
.rs-req { color: var(--t-neg) !important; }

.fb-field-label,
.fb-cat-label,
.fb-toggle-label,
.fb-label,
.fb-section-label { color: var(--t-blue) !important; }
.fb-card-sub,
.fb-page-desc,
.fb-hint { color: var(--t-muted) !important; }

/* Danger buttons beat the generic submit-button rule */
button.btn-danger,
button[type="submit"].btn-danger {
  background: transparent !important;
  border: 1px solid var(--t-neg) !important;
  color: var(--t-neg) !important;
}

button.btn-danger:hover,
button[type="submit"].btn-danger:hover { background: rgba(255, 95, 86, 0.1) !important; }
