/* ==========================================================================
   a11y.css — colour-contrast corrections (WCAG 2.1 AA)
   Added 2026-09-21. This file only deepens or lightens tones that carry
   small text; it does not change layout, spacing or the brand hue.
   Remove this one <link> to revert everything in it.
   ========================================================================== */

/* --- Body and muted text --------------------------------------------------
   Was #64748b body / rgba(100,116,139,.75) muted: 4.3:1 and 2.8:1 on the
   pale section backgrounds. */
:root {
   --bs-body-color: #566274;
   --bs-body-color-rgb: 86, 98, 116;
   --bs-secondary-color: #5b6879;
   --bs-secondary-color-rgb: 91, 104, 121;
}
[data-bs-theme="dark"] {
   --bs-body-color: #aab6c6;
   --bs-body-color-rgb: 170, 182, 198;
   --bs-secondary-color: #9aa7b8;
   --bs-secondary-color-rgb: 154, 167, 184;
}

/* --- Main navigation ------------------------------------------------------
   The navbar is white in light mode and #1e293b in dark mode, but the links
   stayed mid-grey in both (3.1:1 dark, 2.1:1 on the program page).
   The leading `body` only raises specificity over the theme's own rule. */
body .navbar .navbar-nav .nav-item .nav-link { color: #566274; }
[data-bs-theme="dark"] body .navbar .navbar-nav .nav-item .nav-link { color: #cbd5e1; }
[data-bs-theme="dark"] body .navbar .navbar-nav .nav-item .nav-link:hover,
[data-bs-theme="dark"] body .navbar .navbar-nav .nav-item .nav-link:focus,
[data-bs-theme="dark"] body .navbar .navbar-nav .nav-item .nav-link.active,
[data-bs-theme="dark"] body .navbar .navbar-nav .nav-item .nav-link.show { color: #ffffff; }

/* --- Dropdown menus ------------------------------------------------------- */
.dropdown-item { color: var(--bs-body-color); }
[data-bs-theme="dark"] .dropdown-item { color: #cbd5e1; }

/* --- Amber badges ---------------------------------------------------------
   `.text-dark` flips to near-white in dark mode, leaving white on #ffc107
   at 1.6:1. Amber always carries dark text. */
.badge.bg-warning,
.bg-warning.text-dark { color: #0f172a !important; }

/* --- Danger text ---------------------------------------------------------- */
.text-danger { color: #c0102f !important; }
[data-bs-theme="dark"] .text-danger { color: #ff8da0 !important; }

/* --- Focus visibility ----------------------------------------------------- */
a:focus-visible,
button:focus-visible,
.btn:focus-visible,
.nav-link:focus-visible { outline: 3px solid currentColor; outline-offset: 2px; }

/* --- Cards that stay light in dark mode -----------------------------------
   speakers.php paints its cards white in both themes, so their contents
   must keep dark text rather than inherit the dark-mode body colour. */
[data-bs-theme="dark"] .speaker-card { color: #334155; }

/* --- Stragglers -----------------------------------------------------------
   `.text-secondary` falls back to Bootstrap's #6c757d on pages that load
   their own Bootstrap after the theme. Inline <code> inside an alert took a
   pink that only works on white. */
[data-bs-theme="dark"] .text-secondary { color: #adb5bd !important; }
.alert code { color: inherit; }

/* --- Coloured card headings -----------------------------------------------
   Committee cards colour their headings with .text-secondary / .text-warning
   / .text-success, which in this theme resolve to tints meant for fills,
   not for text (down to 1.2:1 on a white card). */
.card-title.text-secondary { color: #5b6879 !important; }
.card-title.text-warning   { color: #8a6100 !important; }
.card-title.text-success   { color: #16704a !important; }
.card-title.text-info      { color: #17627d !important; }
[data-bs-theme="dark"] .card-title.text-secondary { color: #9aa7b8 !important; }
[data-bs-theme="dark"] .card-title.text-warning   { color: #ffca2c !important; }
[data-bs-theme="dark"] .card-title.text-success   { color: #5dd39e !important; }
[data-bs-theme="dark"] .card-title.text-info      { color: #7cc7e0 !important; }

/* --- Inline pure red ------------------------------------------------------
   `style="color:red"` is only 4.0:1 on white. */
[style*="color:red"], [style*="color: red"] { color: #d10000 !important; }
[data-bs-theme="dark"] [style*="color:red"],
[data-bs-theme="dark"] [style*="color: red"] { color: #ff8da0 !important; }

/* --- Image dimensions -----------------------------------------------------
   <img> tags now carry width/height attributes so the browser can reserve
   space before the file arrives. Those attributes are presentational hints
   with zero specificity; width/height:auto keeps every existing CSS rule
   authoritative and leaves the attributes supplying only the aspect ratio. */
img { width: auto; height: auto; }

/* --- Brand purple ---------------------------------------------------------
   #8b3dff clears 4.5:1 on white but only 4.3:1 on the pale purple section
   tint. #7a2ee8 is the same hue one step deeper: 5.4:1 there.
   Button backgrounds keep #8b3dff, which already passes with white text. */
:root {
   --fl-accent: #7a2ee8;
   --bs-link-color: #7a2ee8;
   --bs-link-color-rgb: 122, 46, 232;
   --bs-link-hover-color: #6b24c9;
}
.text-primary { color: #7a2ee8 !important; }
[data-bs-theme="dark"] {
   --fl-accent: #b98bff;
   --bs-link-color: #b98bff;
   --bs-link-color-rgb: 185, 139, 255;
   --bs-link-hover-color: #d4bbff;
}
[data-bs-theme="dark"] .text-primary { color: #b98bff !important; }
.dropdown-item.active, .dropdown-item:active,
[data-bs-theme="dark"] .dropdown-item.active,
[data-bs-theme="dark"] .dropdown-item:active { color: #fff; background-color: #7a2ee8; }
[data-bs-theme="dark"] .btn-outline-primary {
   --bs-btn-color: #b98bff;
   --bs-btn-border-color: #b98bff;
   --bs-btn-hover-bg: #7a2ee8;
   --bs-btn-hover-border-color: #7a2ee8;
   --bs-btn-hover-color: #fff;
}
[data-bs-theme="dark"] .speaker-card a { color: #7a2ee8; }
[data-bs-theme="dark"] .badge.bg-primary-subtle,
[data-bs-theme="dark"] .bg-primary-subtle.text-primary { color: #e2d3ff !important; }

/* --- program.php ----------------------------------------------------------
   That page ships its own light-only palette: white cards and pale yellow
   session rows. In dark mode the text turned light while those surfaces
   stayed pale, leaving the whole schedule at 1.2-1.3:1. */
[data-bs-theme="dark"] .content-card {
   background: #0f172a;
   border-color: #334155;
}
[data-bs-theme="dark"] .sticky-topbar {
   background: rgba(15, 23, 42, .92);
   border-bottom-color: #334155;
}
[data-bs-theme="dark"] .centered-schedule .time,
[data-bs-theme="dark"] .centered-schedule .session-title {
   background: #3b300c;
   color: #fde68a;
}
[data-bs-theme="dark"] .centered-schedule .muted {
   background: #122a45;
   color: #d3e5ff;
}
[data-bs-theme="dark"] .room-badge { background: #312e81; color: #e0e7ff; }
[data-bs-theme="dark"] .slot { border-left-color: #475569; }
[data-bs-theme="dark"] .paper-title,
[data-bs-theme="dark"] .section-title { color: #e2e8f0; }
[data-bs-theme="dark"] .search-input { background: #0b1220; color: #e2e8f0; border-color: #334155; }

/* Light mode: pale-blue note rows were 4.2:1 */
.centered-schedule .muted,
.content-card .muted { color: #515d6e; }

/* Text inside the now-dark program card */
[data-bs-theme="dark"] .content-card { color: #e2e8f0; }
[data-bs-theme="dark"] .content-card .muted,
[data-bs-theme="dark"] .content-card .muted.small { color: #cbd5e1; }
[data-bs-theme="dark"] .centered-schedule .muted { color: #d3e5ff; }
[data-bs-theme="dark"] .content-card .time,
[data-bs-theme="dark"] .slot .time { color: #93c5fd; }
[data-bs-theme="dark"] .centered-schedule .time { color: #fde68a; }
[data-bs-theme="dark"] .content-card a { color: #b98bff; }
/* <strong> inside the schedule picks up an emphasis colour meant for light */
[data-bs-theme="dark"] .content-card strong,
[data-bs-theme="dark"] .content-card b { color: inherit; }