/* ============================================================================
 *  readability.css — opt-in "Easier reading" contrast boost.
 *  ----------------------------------------------------------------------------
 *  Every rule is scoped under `html.readable-boost`, so this stylesheet is
 *  completely inert until that class is present on the root element. The class
 *  is set before first paint by a tiny inline no-flash script (see
 *  objects/public_page.php renderShell() for user-facing pages, and
 *  Project::headHtml() for the admin chrome) and toggled at runtime from the
 *  footer control wired by /js/bsg-readability.js.
 *
 *  Loaded on EVERY page:
 *    - user-facing pages — <link> in PublicPage::renderShell
 *    - admin chrome       — via Project::projectStylesheets()
 *
 *  Two halves, because the two surfaces colour text differently:
 *    1. Public "In the Crowd" theme — warm muted tones on near-black. The
 *       theme drives almost all body/secondary text off a handful of custom
 *       properties, so redeclaring those brighter cascades site-wide.
 *    2. Framework admin chrome (base.css) — hardcoded light-grey text on white
 *       surfaces, no custom properties, so each low-contrast selector needs an
 *       explicit darker override.
 * ========================================================================== */

/* ----------------------------------------------------------------------------
 *  1. Public theme — lift the muted text variables.
 *  `html.readable-boost` (0,1,1) outranks the theme's `:root` (0,1,0), so these
 *  win and flow through every `var(--text-*)` consumer. Hue kept warm; only the
 *  luminance is raised so muted/secondary/faded copy clears WCAG AA on the dark
 *  background (--ink-rich #0E060B).
 * -------------------------------------------------------------------------- */
html.readable-boost {
    --text-warm:  #F0DCC8;   /* body            — was #E0C8B0 */
    --text-soft:  #E8D4BE;   /* soft secondary  — was #D0BCA3 */
    --text-faded: #D0B89E;   /* faded tertiary  — was #AB927A */
}

/* ----------------------------------------------------------------------------
 *  2. Admin chrome (base.css) — darken the low-contrast greys on light
 *  surfaces. Values bumped from the gray-400/500 range toward gray-700 so
 *  hints, headers, read-only fields and table headers read cleanly.
 * -------------------------------------------------------------------------- */
html.readable-boost .field-hint            { color: #4b5563; }  /* was #9ca3af */
html.readable-boost .user-menu-header      { color: #374151; }  /* was #6b7280 */
html.readable-boost .notify-dropdown-empty { color: #4b5563; }  /* was #6b7280 */
html.readable-boost .bspkfw-view-filter    { color: #374151; }  /* was #6b7280 */
html.readable-boost .form-control--readonly{ color: #374151; }  /* was #6b7280 */
html.readable-boost .notify-bell           { color: #4b5563; }  /* was #94a3b8 */
html.readable-boost .data-table th         { color: #374151; }  /* was #6b7280 */

/* ----------------------------------------------------------------------------
 *  Footer toggle control — small, quiet, matches the footer's link voice.
 *  Lives here (always loaded) so the control is styled on every page even
 *  before the boost is engaged.
 * -------------------------------------------------------------------------- */
.footer__readable-toggle {
    background: transparent;
    border: 0;
    padding: 0;
    margin: 0;
    cursor: pointer;
    font: inherit;
    color: inherit;
    text-decoration: underline;
    text-underline-offset: 2px;
    opacity: 0.85;
}
.footer__readable-toggle:hover { opacity: 1; }
.footer__readable-toggle[aria-pressed="true"] { font-weight: 600; }
/* Visible keyboard focus ring — the toggle is a real <button> and must show
   focus on the dark footer rather than relying on the browser default. */
.footer__readable-toggle:focus-visible {
    outline: 2px solid currentColor;
    outline-offset: 3px;
    opacity: 1;
}

/* ----------------------------------------------------------------------------
 *  First-run "Easier reading" nudge modal (pages/_readable_intro_modal.php).
 *  Reuses the framework .modal / .modal-box chrome; only the inner layout is
 *  styled here. NOT scoped under .readable-boost — the modal must look right
 *  whether or not the boost is engaged.
 * -------------------------------------------------------------------------- */
.readable-intro__body {
    display: flex;
    flex-direction: column;
    gap: 14px;
    padding: 18px 24px;
}
.readable-intro__lead { margin: 0; }
.readable-intro__switch {
    display: flex;
    align-items: center;
    gap: 10px;
    cursor: pointer;
    font-weight: 600;
}
.readable-intro__switch input { width: 18px; height: 18px; cursor: pointer; }
.readable-intro__note { margin: 0; font-size: 0.9em; opacity: 0.85; }
.readable-intro__footer {
    display: flex;
    justify-content: flex-end;
    padding: 4px 24px 18px;
}