/* ACE101 theme on top of Bootstrap 5.3: blue accent, Plex + JetBrains Mono. */
:root,
[data-bs-theme="light"] {
  --bs-body-font-family: "IBM Plex Sans", system-ui, -apple-system, "Segoe UI", sans-serif;
  --bs-font-monospace: "JetBrains Mono", ui-monospace, Consolas, monospace;
  --bs-body-bg: #f6f3ec;
  --bs-body-color: #1d232b;
  --bs-primary: #1f5fa8;
  --bs-primary-rgb: 31, 95, 168;
  --bs-link-color: #1f5fa8;
  --bs-link-color-rgb: 31, 95, 168;
  --bs-link-hover-color: #174a84;
  --bs-link-hover-color-rgb: 23, 74, 132;
  --bs-border-color: #ddd6c8;
  --ace-card-bg: #ffffff;
  --ace-code-bg: #1d232b;
  --ace-code-ink: #e9e4d8;
}
[data-bs-theme="dark"] {
  --bs-body-bg: #14181d;
  --bs-body-color: #e8e4da;
  --bs-primary: #79aef0;
  --bs-primary-rgb: 121, 174, 240;
  --bs-link-color: #79aef0;
  --bs-link-color-rgb: 121, 174, 240;
  --bs-link-hover-color: #a4c8f5;
  --bs-link-hover-color-rgb: 164, 200, 245;
  --bs-border-color: #2e3640;
  --ace-card-bg: #1c2229;
  --ace-code-bg: #0d1013;
  --ace-code-ink: #e9e4d8;
}
body { font-size: 1.0625rem; }
.card { --bs-card-bg: var(--ace-card-bg); }
.navbar.bg-body { background-color: var(--ace-card-bg) !important; }
.btn-primary {
  --bs-btn-bg: var(--bs-primary);
  --bs-btn-border-color: var(--bs-primary);
  --bs-btn-hover-bg: var(--bs-link-hover-color);
  --bs-btn-hover-border-color: var(--bs-link-hover-color);
  --bs-btn-active-bg: var(--bs-link-hover-color);
  --bs-btn-active-border-color: var(--bs-link-hover-color);
  --bs-btn-color: #fff;
  --bs-btn-hover-color: #fff;
  --bs-btn-active-color: #fff;
}
[data-bs-theme="dark"] .btn-primary { --bs-btn-color: #14181d; --bs-btn-hover-color: #14181d; --bs-btn-active-color: #14181d; }
.nav-link.active { color: var(--bs-primary) !important; font-weight: 600; }
.brand, .meta, .eyebrow, .members { font-family: var(--bs-font-monospace); }
.meta, .members { font-size: 0.82rem; }
.eyebrow { font-size: 0.82rem; letter-spacing: 0.04em; text-transform: uppercase; color: var(--bs-primary); margin-bottom: 0.25rem; }
.members { color: var(--bs-secondary-color); }
.prose { max-width: 46em; }
.list-group-numbered > .list-group-item { background-color: var(--ace-card-bg); padding-top: 0.85rem; padding-bottom: 0.85rem; }
.list-group-numbered > .list-group-item::before { font-family: var(--bs-font-monospace); font-weight: 700; color: var(--bs-primary); margin-right: 0.5rem; }
pre.code { background: var(--ace-code-bg); color: var(--ace-code-ink); padding: 14px 16px; border-radius: 8px; }
.post { max-width: 44em; }
@media print { header, footer, .no-print { display: none !important; } }

/* Bootstrap's own .text-bg-primary / .badge use the compiled blue; keep them on the theme color. */
.text-bg-primary { background-color: var(--bs-primary) !important; }
[data-bs-theme="dark"] .text-bg-primary { color: #14181d !important; }

/* Track colors: each course track sets --track (blue, green, indigo). */
/* --track comes from an inline style (a track card, or <main> on track pages) and is inherited. */
.track-card, .track-themed { --track-ink: var(--track, #1F5FA8); }
[data-bs-theme="dark"] .track-card, [data-bs-theme="dark"] .track-themed { --track-ink: color-mix(in srgb, var(--track, #1F5FA8) 45%, white); }
.track-card { border-top: 5px solid var(--track, #1F5FA8); }
.track-ink, .track-themed .eyebrow { color: var(--track-ink) !important; }
.track-badge { background-color: var(--track, #1F5FA8); color: #fff; }
.track-card .btn-primary, .track-themed .btn-primary,
[data-bs-theme="dark"] .track-card .btn-primary, [data-bs-theme="dark"] .track-themed .btn-primary {
  --bs-btn-bg: var(--track);
  --bs-btn-border-color: var(--track);
  --bs-btn-hover-bg: color-mix(in srgb, var(--track) 80%, black);
  --bs-btn-hover-border-color: color-mix(in srgb, var(--track) 80%, black);
  --bs-btn-active-bg: color-mix(in srgb, var(--track) 70%, black);
  --bs-btn-color: #fff; --bs-btn-hover-color: #fff; --bs-btn-active-color: #fff;
}
.track-themed a:not(.btn):not(.nav-link) { color: var(--track-ink); }

/* Unit page */
.unit-goal { border-left: 5px solid var(--track, var(--bs-primary)); padding: 0.75rem 1rem; background: var(--ace-card-bg); border-radius: 0 8px 8px 0; }
.unit-step { border-top: 1px solid var(--bs-border-color); padding-top: 1.5rem; }
.unit-note { background: var(--ace-card-bg); border: 1px solid var(--bs-border-color); border-radius: 8px; padding: 0.75rem 1rem; max-width: 46em; }
.rich h3 { font-size: 1.2rem; font-weight: 700; margin-top: 1.5rem; }
.rich table { --bs-table-bg: var(--ace-card-bg); font-size: 0.95rem; }
.rich td { min-height: 3rem; height: 3rem; }
.exit-ticket { border: 2px dashed var(--track, var(--bs-primary)); border-radius: 8px; padding: 1rem 1.25rem; max-width: 46em; }
@media print {
  .rich table { font-size: 10pt; }
  .rich td { height: 2.2cm; }
  .unit-step { break-inside: auto; }
}

/* Theme picker in the navbar */
.theme-pick { width: auto; min-width: 6.5rem; }
.navbar .nav-link, .navbar #account { white-space: nowrap; }
/* Site logo (RKS knight) in the main header: same size as the old >_ mark, subdued until hovered */
/* site header: Home icon (Bootstrap Icons house-door, inline so it shows on every page) */
.brand-home { display: inline-flex; align-items: center; color: var(--bs-secondary-color); padding: .15rem .25rem; border-radius: .4rem; }
.brand-home svg { width: 1.4rem; height: 1.4rem; }
.brand-home:hover, .brand-home:focus-visible { color: var(--bs-emphasis-color); background: var(--bs-tertiary-bg); }
