:root {
  --eh-primary: #14b8a6;
  --eh-secondary: #6366f1;
  --eh-surface: #f8fafc;
  --eh-surface-soft: #eef2ff;
  --eh-text: #0f172a;
  --eh-muted: #475569;
  --eh-border: #dbe3ef;
  --eh-white: #ffffff;
  --eh-info-bg: #dff8f4;
  --eh-info-border: #b8eee5;
  --bs-body-bg: var(--eh-surface);
  --bs-body-color: var(--eh-text);
  --bs-tertiary-bg: var(--eh-surface-soft);
  --bs-border-color: var(--eh-border);
  --bs-secondary-color: var(--eh-muted);
  --bs-card-bg: var(--eh-white);
  --bs-list-group-bg: var(--eh-white);
  --bs-list-group-color: var(--eh-text);
  --bs-list-group-border-color: var(--eh-border);
  --bs-link-color: var(--eh-secondary);
  --bs-link-hover-color: #5155db;
  color-scheme: light;
}

@media (prefers-color-scheme: dark) {
  :root {
    --eh-primary: #2dd4bf;
    --eh-secondary: #818cf8;
    --eh-surface: #0b1220;
    --eh-surface-soft: #111a2d;
    --eh-text: #e5e7eb;
    --eh-muted: #94a3b8;
    --eh-border: #22314d;
    --eh-white: #0f172a;
    --eh-info-bg: #10242b;
    --eh-info-border: #1f4d5a;
    --bs-body-bg: var(--eh-surface);
    --bs-body-color: var(--eh-text);
    --bs-tertiary-bg: var(--eh-surface-soft);
    --bs-border-color: var(--eh-border);
    --bs-secondary-color: var(--eh-muted);
    --bs-card-bg: var(--eh-white);
    --bs-list-group-bg: var(--eh-white);
    --bs-list-group-color: var(--eh-text);
    --bs-list-group-border-color: var(--eh-border);
    --bs-link-color: #a5b4fc;
    --bs-link-hover-color: #c7d2fe;
    color-scheme: dark;
  }
}

body {
  background: linear-gradient(180deg, #f8fafc 0%, #eef2ff 100%);
  color: var(--eh-text);
}

@media (prefers-color-scheme: dark) {
  body {
    background: linear-gradient(180deg, #0b1220 0%, #0f172a 100%);
  }
}

.brand-navbar {
  background-color: var(--eh-white);
  border-bottom: 1px solid var(--eh-border);
}

.brand-logo {
  height: 34px;
  width: auto;
  display: block;
}

.nav-link {
  color: var(--eh-muted);
}

.nav-link.active,
.nav-link:hover {
  color: var(--eh-primary);
}

.navbar-toggler {
  border-color: var(--eh-border);
}

.navbar-toggler-icon {
  filter: invert(0.45);
}

@media (prefers-color-scheme: dark) {
  .navbar-toggler-icon {
    filter: invert(0.9);
  }
}

.btn-success,
.btn-primary {
  --bs-btn-bg: var(--eh-primary);
  --bs-btn-border-color: var(--eh-primary);
  --bs-btn-hover-bg: #0f9d8e;
  --bs-btn-hover-border-color: #0f9d8e;
  --bs-btn-active-bg: #0d8b7e;
  --bs-btn-active-border-color: #0d8b7e;
  --bs-btn-color: #ffffff;
}

.btn-dark,
.btn-outline-dark {
  --bs-btn-bg: var(--eh-secondary);
  --bs-btn-border-color: var(--eh-secondary);
  --bs-btn-hover-bg: #5155db;
  --bs-btn-hover-border-color: #5155db;
  --bs-btn-active-bg: #4548bf;
  --bs-btn-active-border-color: #4548bf;
}

.btn-outline-secondary {
  --bs-btn-color: var(--eh-secondary);
  --bs-btn-border-color: var(--eh-secondary);
  --bs-btn-hover-bg: var(--eh-secondary);
  --bs-btn-hover-border-color: var(--eh-secondary);
}

.badge.text-bg-success {
  --bs-success-rgb: 20, 184, 166;
}

.card {
  border: 1px solid var(--eh-border);
  background-color: var(--eh-white);
  color: var(--eh-text);
}

.bg-body-tertiary {
  background-color: var(--eh-surface-soft) !important;
}

.list-group-item {
  background-color: var(--eh-white);
  color: var(--eh-text);
  border-color: var(--eh-border);
}

.list-group-item-action:hover,
.list-group-item-action:focus {
  background-color: var(--eh-surface-soft);
  color: var(--eh-text);
}

.text-dark,
.fw-semibold.text-dark {
  color: var(--eh-text) !important;
}

.border-top,
hr {
  border-color: var(--eh-border) !important;
}

.alert-info {
  --bs-alert-color: var(--eh-text);
  --bs-alert-bg: var(--eh-info-bg);
  --bs-alert-border-color: var(--eh-info-border);
}

.text-secondary {
  color: var(--eh-muted) !important;
}

.brand-shell {
  background-color: var(--eh-surface);
  border: 1px solid var(--eh-border);
}

.form-control,
.form-select {
  background-color: var(--eh-white);
  color: var(--eh-text);
  border-color: var(--eh-border);
}

.form-control:focus,
.form-select:focus {
  border-color: var(--eh-primary);
  box-shadow: 0 0 0 0.2rem rgba(20, 184, 166, 0.2);
}

.form-control::placeholder {
  color: var(--eh-muted);
}