/* fifteen-dark.css
 *
 * Dark-mode contrast overrides on top of Metronic's style.bundle.css.
 *
 * SHARED — served from the Fifteen.Web.Shared RCL as
 * _content/Fifteen.Web.Shared/css/fifteen-dark.css and linked by EVERY module
 * layout (Nexus, Hub, Reach, Site, Pulse, Operonn), exactly like its sibling
 * fifteen-theme.css.
 *
 * This file used to be forked into six per-host copies under
 * <host>/wwwroot/assets/css/. Only Nexus's copy was ever migrated onto the
 * --fx-* tokens; the other five stayed byte-identical and unmigrated
 * (md5 82978f38417d8b442a9ff1c6d3f728f0), which is why a theme recoloured body
 * text on Nexus but not on Reach/Site/Pulse/Hub/Operonn. Do NOT re-fork it:
 * the module standard says core features ship via a shared mechanism, and six
 * divergent copies is precisely how this rotted.
 *
 * Metronic's bundle inverts the gray scale in dark mode: --kt-text-gray-100
 * becomes #1b1b29 (near-black) and --kt-text-gray-900 becomes #FFFFFF.
 * Our Razor pages were authored against the light-mode mental model where
 * text-gray-100 means "near-white", so dropping them onto the dark body bg
 * (#1e1e2d) makes headings invisible.
 *
 * Rather than rewriting every cshtml, we override the offending text colors
 * here. Loaded AFTER style.bundle.css from the layout. Scoped to BOTH
 * data-bs-theme="dark" (set by the layout) and data-theme="dark" (what the
 * Metronic bundle actually keys off) so it works regardless of which
 * attribute the active build of Metronic respects.
 *
 * Keep this file small. If a rule is ever needed in light mode, lift the
 * scope. If a fix is ever rolled into the Metronic bundle itself, delete
 * the corresponding rule here.
 */

/* ---------- Body baseline ----------
 * These dark contrast overrides now READ the --fx-* content tokens (with the
 * current hex as the fallback) so a company branding override flows through in
 * dark mode too — not just light. The token default (emitted per-mode by
 * _BrandStyle) EQUALS the fallback here, so the Default theme renders byte-for-byte
 * as before; only a SET override changes the surface. */
[data-bs-theme="dark"],
[data-theme="dark"] {
    color: var(--fx-text, #f5f8fa);
}

[data-bs-theme="dark"] body,
[data-theme="dark"] body {
    color: var(--fx-text, #f5f8fa);
}

/* ---------- Headings ----------
 * Force headings to inherit the body color rather than picking up any
 * Bootstrap default that resolves to a darker swatch. */
[data-bs-theme="dark"] h1,
[data-bs-theme="dark"] h2,
[data-bs-theme="dark"] h3,
[data-bs-theme="dark"] h4,
[data-bs-theme="dark"] h5,
[data-bs-theme="dark"] h6,
[data-theme="dark"] h1,
[data-theme="dark"] h2,
[data-theme="dark"] h3,
[data-theme="dark"] h4,
[data-theme="dark"] h5,
[data-theme="dark"] h6 {
    color: var(--fx-heading-text, #f5f8fa);
}

/* ---------- Card labels / titles ---------- */
[data-bs-theme="dark"] .card-label,
[data-bs-theme="dark"] .card-title,
[data-theme="dark"] .card-label,
[data-theme="dark"] .card-title {
    color: var(--fx-heading-text, #f5f8fa);
}

/* ---------- text-gray-* utility remap ----------
 * Metronic's bundle inverts these in dark mode. Razor pages were authored
 * with the light-mode meaning where gray-100 = subtle near-white and
 * gray-900 = strong near-black. Restore that meaning so the markup works
 * on the dark body bg without per-page rewrites.
 *
 * Scale (matches light-mode --kt-text-gray-* values):
 *   gray-100 = #f5f8fa
 *   gray-200 = #eff2f5
 *   gray-300 = #E4E6EF
 *   gray-400 = #B5B5C3
 *   gray-500 = #A1A5B7
 *   gray-600 = #7E8299
 *   gray-700 = #5E6278
 *   gray-800 = #3F4254
 *   gray-900 = #181C32  -- but on dark bg this is invisible, so we lift it
 */
[data-bs-theme="dark"] .text-gray-100,
[data-theme="dark"] .text-gray-100 {
    color: #f5f8fa !important;
}

[data-bs-theme="dark"] .text-gray-200,
[data-theme="dark"] .text-gray-200 {
    color: #eff2f5 !important;
}

[data-bs-theme="dark"] .text-gray-300,
[data-theme="dark"] .text-gray-300 {
    color: #E4E6EF !important;
}

/* gray-400/500/600 are middling gray on both backgrounds — leave as-is */

/* gray-900: in light mode this is near-black ink; on dark bg it's invisible.
 * Map to near-white so any markup using text-gray-900 for high-contrast ink
 * still reads. */
[data-bs-theme="dark"] .text-gray-900,
[data-theme="dark"] .text-gray-900 {
    color: #FFFFFF !important;
}

/* ---------- text-muted ----------
 * Bootstrap default #6c757d is too dark on the navy body bg; Metronic's
 * dark-mode value #565674 is also too dark for body subtext. Lift to a
 * legible mid-gray. */
[data-bs-theme="dark"] .text-muted,
[data-theme="dark"] .text-muted {
    color: var(--fx-text-muted, #9899ac) !important;
}

/* ---------- Description-list terms ----------
 * Bootstrap doesn't ship a color override for <dt>, so it falls back to
 * body color — that's fine now that we've set body color above, but make
 * it explicit so future bundle drift can't darken it. */
[data-bs-theme="dark"] dt,
[data-theme="dark"] dt {
    color: inherit;
}

/* ---------- Page heading lockup ----------
 * The header uses .page-heading.text-gray-100 — already covered by the
 * text-gray-100 remap above. No extra rule needed. */
