/* Generis app theme — premium graphite / white / phosphor green (shared override, loaded by all dashboard pages). 2026-10-16 */
@import url("https://fonts.googleapis.com/css2?family=IBM+Plex+Mono:wght@400;500;600;700&family=JetBrains+Mono:wght@400;500;600&display=swap");

html:root, :root body, body {
  --bg: #050714;
  --bg-card: #0c0f1f;
  --bg-card-hover: #121630;
  --bg-sidebar: #050714;
  --primary: #6366f1;
  --primary-rgb: 99,102,241;
  --primary-light: #818cf8;
  --accent: #a78bfa;
  --accent-rgb: 167,139,250;
  --accent2: #06d6a0;
  --accent2-rgb: 6,214,160;
  --text: #f1f5f9;
  --text-dim: #94a3b8;
  --border: #1e2235;
  --glow: rgba(99,102,241,.15);
  --success: #06d6a0;
  --warning: #e8e8e8;
  --danger: #ff6b6b;
}

html, body {
  font-family: "IBM Plex Mono", "JetBrains Mono", ui-monospace, monospace !important;
  background: var(--bg) !important;
  color: var(--text) !important;
  letter-spacing: -0.01em;
}

/* Surfaces */
.sidebar, .topbar { background: var(--bg-sidebar) !important; border-color: var(--border) !important; backdrop-filter: none !important; }
.auth-card, .card, .stat-card, .modal, .agent-card {
  background: var(--bg-card) !important;
  border: 1px solid var(--border) !important;
  border-radius: 16px !important;
  backdrop-filter: none !important;
  box-shadow: 0 1px 0 rgba(255,255,255,.03) inset, 0 12px 40px rgba(0,0,0,.35) !important;
}
.card:hover, .stat-card:hover, .agent-card:hover { background: var(--bg-card-hover) !important; border-color: #2a2f45 !important; }

/* Headings: plain, crisp white (no inverted bar, no gradient clip) */
.auth-card h1, h1 {
  background: none !important;
  color: #f1f5f9 !important;
  -webkit-text-fill-color: #f1f5f9 !important;
  font-weight: 800 !important;
  letter-spacing: -0.02em;
  box-shadow: none !important;
}
.auth-card .subtitle, .form-label, .stat-label, .auth-footer { color: var(--text-dim) !important; }

/* Brand / nav */
.sidebar-logo {
  background: none !important;
  color: #f1f5f9 !important;
  -webkit-text-fill-color: #f1f5f9 !important;
  box-shadow: none !important;
}
.nav-item.active {
  background: rgba(167,139,250,.10) !important;
  color: var(--accent) !important;
  -webkit-text-fill-color: var(--accent) !important;
  box-shadow: inset 2px 0 0 var(--accent) !important;
}
.plan-badge {
  background: rgba(167,139,250,.12) !important;
  color: var(--accent) !important;
  -webkit-text-fill-color: var(--accent) !important;
  border: 1px solid rgba(167,139,250,.35) !important;
  border-radius: 50px !important;
  font-weight: 700 !important;
  box-shadow: none !important;
}

/* Buttons */
.btn, .btn-sm { border-radius: 10px !important; font-weight: 600; }
.btn-primary {
  background: #6366f1 !important;
  color: #ffffff !important;
  -webkit-text-fill-color: #ffffff !important;
  border: 1px solid rgba(129,140,248,.6) !important;
  border-radius: 10px !important;
  font-weight: 700 !important;
  box-shadow: 0 0 0 1px rgba(99,102,241,.25), 0 8px 24px rgba(99,102,241,.35) !important;
  transition: all .2s ease !important;
}
.btn-primary:hover {
  background: #818cf8 !important;
  color: #ffffff !important;
  border-color: #a78bfa !important;
  box-shadow: 0 0 0 1px rgba(167,139,250,.35), 0 10px 28px rgba(167,139,250,.25) !important;
  transform: translateY(-1px);
}
.btn-logout:hover { color: var(--danger) !important; border-color: var(--danger) !important; }

/* Inputs */
.form-input, .form-select, .form-textarea, input[type="text"], input[type="email"], input[type="password"], textarea, select {
  background: #0a0d1c !important;
  border: 1px solid var(--border) !important;
  border-radius: 10px !important;
  color: var(--text) !important;
  transition: border-color .2s, box-shadow .2s;
}
.form-input:focus, .form-select:focus, .form-textarea:focus, input[type="text"]:focus, input[type="email"]:focus, input[type="password"]:focus, textarea:focus {
  outline: none !important;
  border-color: var(--accent) !important;
  box-shadow: 0 0 0 3px rgba(167,139,250,.18) !important;
}
::placeholder { color: #64748b !important; }

/* Links */
.auth-footer a, a.link, .link { color: #a78bfa !important; -webkit-text-fill-color: #a78bfa !important; text-decoration: none; }
.auth-footer a:hover, a.link:hover { text-decoration: underline; }

code, pre, .terminal-body, .browser-screen { font-family: "IBM Plex Mono", monospace !important; }