/* Maps rapttor/yii2-themes tokens onto Bootstrap 5 variables, so the whole UI follows the chosen theme. */
:root:root {
  --bs-body-bg: var(--bg);
  --bs-body-color: var(--text);
  --bs-secondary-color: var(--muted);
  --bs-tertiary-bg: var(--surface);
  --bs-border-color: var(--line);
  --bs-link-color: var(--link);
  --bs-link-hover-color: var(--link);
  --bs-emphasis-color: var(--text);
}
.navbar.bg-dark { background: var(--surface) !important; border-bottom: 1px solid var(--line); box-shadow: var(--elev-sm); }
.navbar .navbar-brand, .navbar .nav-link { color: var(--text) !important; }
.navbar .nav-link:hover { color: var(--link) !important; }
.navbar-toggler { border-color: var(--line); }
.btn-primary, .btn-dark { --bs-btn-bg: var(--brand); --bs-btn-border-color: var(--brand); --bs-btn-color: var(--brand-ink);
  --bs-btn-hover-bg: var(--brand); --bs-btn-hover-border-color: var(--brand); --bs-btn-hover-color: var(--brand-ink);
  --bs-btn-active-bg: var(--brand); --bs-btn-active-color: var(--brand-ink); }
.card, .list-group-item, .table { --bs-card-bg: var(--surface); --bs-card-border-color: var(--line); --bs-table-bg: transparent; --bs-table-color: var(--text); color: var(--text); }
.card { box-shadow: var(--elev); }
.form-control, .form-select { background-color: var(--surface); color: var(--text); border-color: var(--line); box-shadow: var(--elev-in); }
.hero-banner { background: var(--surface) !important; color: var(--text) !important; border: 1px solid var(--line); box-shadow: var(--elev); }
.hero-banner .lead { color: var(--muted); }
footer { background: var(--surface) !important; border-top: 1px solid var(--line); }
.legal-links ul, .legal-languages ul { list-style: none; padding: 0; margin: 0; display: flex; flex-wrap: wrap; gap: .25rem 1rem; }
.bg-body-tertiary { background-color: var(--surface) !important; color: var(--text); }