/* ── Dashboard shared palette ───────────────────────────────────────────────
   Light-mode tokens (override per-page if needed)
   ──────────────────────────────────────────────────────────────────────── */
:root {
  --accent:       #2666CB;
  --accent-hover: #0C3AAC;
  --border-r:     #e5e7eb;
  --muted:        #6b7280;
}

/* ── Dark-mode tokens ───────────────────────────────────────────────────── */
html.wiki-dark {
  --accent:       #619ce3;
  --accent-hover: #4a85d8;
  --bg-elevated:  #1e2a3a;
  --text:         #e0e0e0;
  --muted:        #a0aab4;
  --border:       #253040;
  --border-r:     #2e4550;
}

/* ── Dark-mode base ─────────────────────────────────────────────────────── */
html.wiki-dark body                   { background-color: #121c27 !important; color: var(--text); }

/* Cards */
html.wiki-dark .card,
html.wiki-dark .card-header,
html.wiki-dark .card-body             { background-color: var(--bg-elevated) !important; border-color: var(--border) !important; color: var(--text); }

/* Text */
html.wiki-dark .text-muted,
html.wiki-dark .text-secondary        { color: var(--muted) !important; }
html.wiki-dark h4,
html.wiki-dark h6                     { color: var(--text) !important; }

/* Tables */
html.wiki-dark table                  { color: var(--text); }
html.wiki-dark table thead th         { color: var(--muted) !important; border-bottom-color: var(--border) !important; }
html.wiki-dark table tbody td         { border-color: var(--border) !important; }
html.wiki-dark .classifications-table             { color: var(--text) !important; }
html.wiki-dark .classifications-table thead th    { color: var(--muted) !important; border-bottom-color: var(--border) !important; }
html.wiki-dark .classifications-table tbody td    { color: var(--text) !important; border-color: var(--border) !important; }
html.wiki-dark .incorrect-answers-table td p      { color: var(--text) !important; }
html.wiki-dark .incorrect-answers-table tbody td,
html.wiki-dark .incorrect-answers-table tbody p   { color: var(--text) !important; }
html.wiki-dark .incorrect-answers-table thead th  { opacity: 1 !important; }
html.wiki-dark .incorrect-answers-table a         { color: var(--accent); }

/* Sidenav */
html.wiki-dark #sidenav-main          { background: var(--bg-elevated) !important; border-color: var(--border) !important; }
html.wiki-dark .sidenav-header        { border-bottom-color: var(--border) !important; }
html.wiki-dark .sidenav-header a,
html.wiki-dark .sidenav-header span   { color: var(--text) !important; }
html.wiki-dark .sidenav-divider       { border-top-color: var(--border) !important; }
html.wiki-dark .sidenav-section-label { color: var(--muted) !important; }
html.wiki-dark .sidenav-nav .nav-link { color: var(--muted) !important; }
html.wiki-dark .sidenav-nav .nav-link:hover  { background-color: #1a2a40 !important; color: var(--text) !important; }
html.wiki-dark .sidenav-nav .nav-link.active { background-color: #1a2a40 !important; color: var(--accent) !important; }
html.wiki-dark .sidenav-nav .nav-link.active .material-icons-round {
  background-image: none !important;
  -webkit-background-clip: unset !important;
  -webkit-text-fill-color: unset !important;
  color: var(--accent) !important;
}
html.wiki-dark .sidenav-scroll                          { scrollbar-color: transparent transparent; }
html.wiki-dark .sidenav-scroll:hover                    { scrollbar-color: rgba(255,255,255,0.2) transparent; }
html.wiki-dark .sidenav-scroll::-webkit-scrollbar-thumb        { background: transparent; }
html.wiki-dark .sidenav-scroll:hover::-webkit-scrollbar-thumb  { background: rgba(255,255,255,0.2); }

/* Navbar */
html.wiki-dark .navbar-main           { background-color: transparent !important; }
html.wiki-dark .navbar-main.blur      { background-color: rgba(26,37,53,0.9) !important; }
html.wiki-dark .header-banner         { background-color: #619ce3 !important; }

/* Profile dropdown */
html.wiki-dark .profile-dropdown-menu        { background: var(--bg-elevated) !important; border-color: var(--border) !important; }
html.wiki-dark .profile-dropdown-item        { color: var(--text) !important; }
html.wiki-dark .profile-dropdown-item:hover  { background-color: #1a2e38 !important; color: var(--accent) !important; }

/* Misc */
html.wiki-dark .progress              { background-color: #2a3a4a !important; border-color: var(--border) !important; }
html.wiki-dark .test-score-link:hover { background-color: #1a2e38 !important; }

/* ── Dashboard footer (partials/dashboard_footer.blade.php) ─────────────────
   Uses the shared tokens above, so it already adapts to dark mode with no
   extra html.wiki-dark rules needed. Pinned to the bottom of the viewport via
   a flex sticky-footer pattern, so it never floats up with a gap below it on
   pages whose content is shorter than the viewport. The auto bottom-margin
   lives on the content siblings (not on the footer itself) so it only ever
   *adds* slack space above the footer's own fixed margin-top — guaranteeing
   that fixed gap as a minimum instead of collapsing it to 0 whenever content
   is tall enough to already fill the viewport. ─────────────────────────── */
.main-content {
  display: flex;
  flex-direction: column;
  min-height: 100vh;
}
.main-content > .container-fluid {
  display: flex;
  flex-direction: column;
  flex: 1 0 auto;
}
.main-content > .container-fluid > :not(.dashboard-footer) {
  margin-bottom: auto;
}
.dashboard-footer {
  border-top: 2px solid var(--border-r);
  margin-top: 2rem;
  padding: 1.25rem 0.75rem;
}
.dashboard-footer-inner {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
  font-size: 0.85rem;
  color: var(--muted);
}
.dashboard-footer-copyright {
  white-space: nowrap;
}
.dashboard-footer-right {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 1.25rem;
}
.dashboard-footer-links {
  display: flex;
  align-items: center;
}
.dashboard-footer-links a {
  color: var(--muted);
  text-decoration: none;
  font-weight: 600;
  transition: color 0.15s ease;
}
.dashboard-footer-links a:hover {
  color: var(--accent);
}
.dashboard-footer-separator {
  color: var(--border-r);
  margin: 0 0.6rem;
}
.dashboard-footer-support {
  display: inline-flex;
  align-items: center;
  gap: 0.4rem;
  border: 2px solid var(--border-r);
  padding: 0.35rem 0.75rem;
  color: var(--muted);
  text-decoration: none;
  font-weight: 600;
  white-space: nowrap;
  transition: border-color 0.15s ease, color 0.15s ease;
}
.dashboard-footer-support:hover {
  border-color: var(--accent);
  color: var(--accent);
}
.dashboard-footer-support .material-icons-round {
  font-size: 1rem;
  line-height: 1;
}