/* Final, deterministic overrides for W5OBM hero typography.
   Loaded site-wide to prevent theme/Bootstrap/inline CSS from forcing low-contrast titles.
*/

:root {
    /* Theme-aligned hero title ramp */
    --w5obm-hero-gold-top: var(--hero-title-gold-top, #fff7cf);
    --w5obm-hero-gold-mid: var(--hero-title-gold-mid, #ffd76a);
    --w5obm-hero-gold-bottom: var(--hero-title-gold-bottom, #c7901f);

    /* Warm outline for contrast without blue cast */
    --w5obm-hero-gold-outline: color-mix(in srgb, #5b3600 62%, transparent);

    /* Bevel + depth stack */
    --w5obm-hero-title-highlight: color-mix(in srgb, #fff2bf 62%, transparent);
    --w5obm-hero-title-shadow-1: color-mix(in srgb, #6c4300 46%, transparent);
    --w5obm-hero-title-shadow-2: color-mix(in srgb, #3a2200 34%, transparent);
    --w5obm-hero-title-shadow-deep: color-mix(in srgb, #1f1200 70%, black 12%);

    /* Site-wide readable secondary text baseline (light surfaces) */
    --w5obm-readable-secondary: var(--theme-text-secondary-strong, color-mix(in srgb, var(--theme-text-primary, #1f2937) 68%, var(--theme-text-secondary, #495057)));
    /* Site-wide readable secondary text baseline (dark surfaces) */
    --w5obm-readable-secondary-on-dark: var(--hero-text-secondary, #FFFFFFF0);
    --w5obm-readable-emphasis: var(--theme-text-primary, var(--bs-emphasis-color, var(--bs-body-color, #1f2937)));
    --w5obm-readable-emphasis-on-dark: var(--hero-text-primary, #ffffff);
    --w5obm-readable-link: var(--theme-link-color-strong, var(--theme-accent-primary, var(--bs-link-color, var(--w5obm-readable-emphasis))));
    --w5obm-readable-link-hover: var(--theme-link-hover-color-strong, color-mix(in srgb, var(--w5obm-readable-link) 78%, black));
    --w5obm-readable-link-on-dark: var(--hero-text-primary, #ffffff);
    --w5obm-readable-link-hover-on-dark: var(--hero-text-secondary, #FFFFFFF0);
    --w5obm-stat-value-readable: var(--theme-text-primary, var(--bs-emphasis-color, var(--bs-body-color, #1f2937)));
    --w5obm-stat-label-readable: var(--w5obm-readable-secondary);
    --w5obm-stat-value-readable-on-dark: var(--hero-text-primary, #ffffff);
    --w5obm-stat-label-readable-on-dark: var(--w5obm-readable-secondary-on-dark);
    --w5obm-surface-text: var(--theme-text-primary, var(--bs-body-color, #1f2937));
    --w5obm-surface-muted: var(--w5obm-readable-secondary);
    --w5obm-surface-link: var(--w5obm-readable-link);
    --w5obm-surface-link-hover: var(--w5obm-readable-link-hover);
    --w5obm-light-panel-bg: #ffffff;
    --w5obm-light-panel-alt-bg: #f8fafc;
    --w5obm-light-panel-text: #0f172a;
    --w5obm-light-panel-muted: #475569;
    --w5obm-light-panel-border: #cbd5e1;
    --bs-secondary-color: var(--w5obm-readable-secondary);
    --bs-link-color: var(--w5obm-readable-link);
    --bs-link-hover-color: var(--w5obm-readable-link-hover);
    --bs-nav-link-color: var(--w5obm-readable-link);
    --bs-nav-link-hover-color: var(--w5obm-readable-link-hover);
    --bs-pagination-color: var(--w5obm-readable-link);
    --bs-pagination-hover-color: var(--w5obm-readable-link-hover);
    --bs-pagination-focus-color: var(--w5obm-readable-link-hover);
    --bs-breadcrumb-item-active-color: var(--w5obm-readable-secondary);
    --bs-breadcrumb-divider-color: var(--w5obm-readable-secondary);
    --bs-list-group-color: var(--w5obm-readable-emphasis);
    --bs-list-group-action-color: var(--w5obm-readable-link);
    --bs-list-group-action-hover-color: var(--w5obm-readable-link-hover);
    --bs-list-group-action-active-color: var(--w5obm-readable-emphasis);
    --bs-accordion-btn-color: var(--w5obm-readable-link);
    --bs-accordion-active-color: var(--w5obm-readable-emphasis);

    /* Card-header title/caption text treatment */
    --w5obm-card-header-gold-top: var(--card-header-gold-top, #fff6c7);
    --w5obm-card-header-gold-mid: var(--card-header-gold-mid, #ffd66e);
    --w5obm-card-header-gold-bottom: var(--card-header-gold-bottom, #c78b24);
    --w5obm-card-header-gold-outline: color-mix(in srgb, #4e2d00 58%, transparent);
    --w5obm-card-header-bevel-highlight: color-mix(in srgb, #fff4cb 60%, transparent);
    --w5obm-card-header-bevel-shadow: color-mix(in srgb, #5f3a00 48%, transparent);
    --w5obm-card-header-bevel-deep: color-mix(in srgb, #1a0f00 72%, black 10%);
    --w5obm-card-header-readable: var(--w5obm-override-card_header_text, var(--w5obm-card-header-gold-mid));
    --w5obm-card-header-gradient-top: var(--w5obm-override-card_header_text, var(--w5obm-card-header-gold-top));
    --w5obm-card-header-gradient-mid: var(--w5obm-override-card_header_text, var(--w5obm-card-header-gold-mid));
    --w5obm-card-header-gradient-bottom: var(--w5obm-override-card_header_text, var(--w5obm-card-header-gold-bottom));
    --w5obm-card-header-text-shadow:
        -1px -1px 0 var(--w5obm-card-header-bevel-highlight),
        0 1px 0 #FFFFFF38,
        0 3px 8px var(--w5obm-card-header-bevel-shadow),
        0 8px 18px var(--w5obm-card-header-bevel-deep);
    --w5obm-card-header-stroke-width: 1px;
    --w5obm-card-header-stroke-color: var(--w5obm-card-header-gold-outline);
}

/* Enforce readable, bevel-styled gold text in card headers site-wide. */
.card-header {
    color: var(--w5obm-card-header-readable) !important;
    text-shadow: var(--w5obm-card-header-text-shadow) !important;
}

/* Push neutral readable tokens into common light-surface Bootstrap containers. */
:where(
    .card,
    .card-body,
    .card-footer,
    .modal-content,
    .modal-header,
    .modal-body,
    .modal-footer,
    .accordion-item,
    .accordion-body,
    .list-group-item,
    .dropdown-menu:not(.dropdown-menu-dark),
    .popover,
    .offcanvas,
    .toast,
    .toast-body,
    .table,
    .table-responsive
) {
    --bs-body-color: var(--w5obm-surface-text);
    --bs-secondary-color: var(--w5obm-surface-muted);
    --bs-emphasis-color: var(--w5obm-surface-text);
    --bs-link-color: var(--w5obm-surface-link);
    --bs-link-hover-color: var(--w5obm-surface-link-hover);
}

:where(.bg-light, .bg-white, .bg-body, .bg-body-tertiary):not(.btn):not(.badge):not(.nav-link):not(.dropdown-item) {
    --bs-body-color: var(--w5obm-surface-text);
    --bs-secondary-color: var(--w5obm-surface-muted);
    --bs-emphasis-color: var(--w5obm-surface-text);
    --bs-link-color: var(--w5obm-surface-link);
    --bs-link-hover-color: var(--w5obm-surface-link-hover);
    color: var(--w5obm-surface-text) !important;
}

:where(.card-header):not(.card-header-tabs) :is(
    h1,
    h2,
    h3,
    h4,
    h5,
    h6,
    .h1,
    .h2,
    .h3,
    .h4,
    .h5,
    .h6,
    strong,
    .card-title,
    .card-subtitle
):not(a):not(button):not(.btn):not(.badge):not(.nav-link):not(.dropdown-item) {
    color: var(--w5obm-card-header-readable) !important;
    text-shadow: var(--w5obm-card-header-text-shadow) !important;
    -webkit-text-stroke: var(--w5obm-card-header-stroke-width) var(--w5obm-card-header-stroke-color) !important;
}

:where(.card-header):not(.card-header-tabs) :is(
    p,
    small,
    span,
    label,
    .text-muted,
    .text-body-secondary,
    .text-secondary,
    .text-dark,
    .text-black-50,
    .text-white-50,
    .text-white-75
):not(a):not(button):not(.btn):not(.badge):not(.nav-link):not(.dropdown-item) {
    color: var(--w5obm-surface-muted) !important;
    text-shadow: none !important;
    -webkit-text-stroke: 0 !important;
    background-image: none !important;
    -webkit-text-fill-color: initial !important;
}

@supports ((-webkit-background-clip: text) or (background-clip: text)) {
    :where(.card-header):not(.card-header-tabs) :is(
        h1,
        h2,
        h3,
        h4,
        h5,
        h6,
        .h1,
        .h2,
        .h3,
        .h4,
        .h5,
        .h6,
        strong,
        .card-title,
        .card-subtitle
    ):not(a):not(button):not(.btn):not(.badge):not(.nav-link):not(.dropdown-item) {
        background-image: linear-gradient(180deg,
            var(--w5obm-card-header-gradient-top) 0%,
            var(--w5obm-card-header-gradient-mid) 48%,
            var(--w5obm-card-header-gradient-bottom) 100%) !important;
        background-size: 100% 100% !important;
        background-repeat: no-repeat !important;
        -webkit-background-clip: text !important;
        background-clip: text !important;
        -webkit-text-fill-color: transparent !important;
    }
}

/* Preserve interactive controls inside card headers. */
:where(.card-header) :is(a, button, .btn, .badge, .nav-link, .dropdown-item, .form-control, .form-select, .input-group-text) {
    -webkit-text-fill-color: initial !important;
    -webkit-text-stroke: 0 !important;
    text-shadow: none !important;
    background-image: none !important;
}

:where(.card, .card-body, .card-footer, .modal-content, .accordion-item, .list-group-item, .dropdown-menu:not(.dropdown-menu-dark), .popover, .offcanvas, .toast) :is(
    p,
    li,
    dt,
    dd,
    small,
    .card-text,
    .card-subtitle,
    .text-body-secondary,
    .text-secondary,
    .text-muted,
    .form-text,
    .form-label,
    .form-check-label,
    label,
    legend,
    .dropdown-header,
    .dropdown-item-text,
    .list-group-item-action:not(.active)
) {
    color: var(--w5obm-surface-muted) !important;
}

:where(.card, .card-body, .card-footer, .modal-content, .accordion-item, .list-group-item, .dropdown-menu:not(.dropdown-menu-dark), .popover, .offcanvas, .toast) :is(
    h1,
    h2,
    h3,
    h4,
    h5,
    h6,
    .h1,
    .h2,
    .h3,
    .h4,
    .h5,
    .h6,
    .card-title,
    .modal-title,
    .accordion-button,
    .list-group-item-action.active
) {
    color: var(--w5obm-surface-text) !important;
}

/* Final cascade guard: prevent low-contrast muted utilities anywhere on the site */
:is(.text-muted, .text-body-secondary, .text-black-50) {
    color: var(--w5obm-readable-secondary) !important;
    opacity: 1 !important;
}

:is(.text-body-emphasis, .link-body-emphasis) {
    color: var(--w5obm-readable-emphasis) !important;
    opacity: 1 !important;
}

:is(a.link-body-emphasis, .btn-link) {
    color: var(--w5obm-readable-link) !important;
}

:is(a.link-body-emphasis, .btn-link):hover,
:is(a.link-body-emphasis, .btn-link):focus {
    color: var(--w5obm-readable-link-hover) !important;
}

.dropdown-menu:not(.dropdown-menu-dark) :is(.dropdown-header, .dropdown-item-text) {
    color: var(--w5obm-readable-secondary) !important;
    opacity: 1 !important;
}

/* Bootstrap component guard: keep common navigation and helper text readable on themed light surfaces. */
:is(.form-text, .form-label, .col-form-label, .form-check-label, .form-floating > label, legend, .breadcrumb-item + .breadcrumb-item::before) {
    color: var(--w5obm-readable-secondary) !important;
    opacity: 1 !important;
}

:is(
    .breadcrumb-item > a,
    .list-group-item-action:not(.active),
    .nav-tabs .nav-link:not(.active),
    .nav-pills .nav-link:not(.active),
    .nav-underline .nav-link:not(.active),
    .pagination .page-item:not(.active) > .page-link,
    .accordion-button
) {
    color: var(--w5obm-readable-link) !important;
    opacity: 1 !important;
}

:is(
    .breadcrumb-item > a,
    .list-group-item-action:not(.active),
    .nav-tabs .nav-link:not(.active),
    .nav-pills .nav-link:not(.active),
    .nav-underline .nav-link:not(.active),
    .pagination .page-item:not(.active) > .page-link,
    .accordion-button
):hover,
:is(
    .breadcrumb-item > a,
    .list-group-item-action:not(.active),
    .nav-tabs .nav-link:not(.active),
    .nav-pills .nav-link:not(.active),
    .nav-underline .nav-link:not(.active),
    .pagination .page-item:not(.active) > .page-link,
    .accordion-button
):focus {
    color: var(--w5obm-readable-link-hover) !important;
}

:is(.form-control, .form-select)::placeholder {
    color: var(--w5obm-readable-secondary) !important;
    opacity: 1 !important;
}

/* Keep muted/secondary utilities readable inside dark sections */
:where(
    .bg-dark,
    .bg-primary,
    .bg-secondary,
    .bg-accent,
    .navbar-dark,
    .w5obm-navbar,
    .w5obm-footer,
    .page-hero,
    .hero,
    .hero-section,
    .hero-home,
    .club-banner,
    .cta-section,
    .donation-card,
    [data-bs-theme="dark"]
) :is(.text-muted, .text-body-secondary, .text-secondary, .text-black-50, .text-white-50, .text-white-75) {
    color: var(--w5obm-readable-secondary-on-dark) !important;
    opacity: 1 !important;
}

:where(
    .bg-dark,
    .bg-primary,
    .bg-secondary,
    .bg-accent,
    .navbar-dark,
    .w5obm-navbar,
    .w5obm-footer,
    .page-hero,
    .hero,
    .hero-section,
    .hero-home,
    .club-banner,
    .cta-section,
    .donation-card,
    [data-bs-theme="dark"]
) :is(.text-body-emphasis, .link-body-emphasis) {
    color: var(--w5obm-readable-emphasis-on-dark) !important;
    opacity: 1 !important;
}

:where(
    .bg-dark,
    .bg-primary,
    .bg-secondary,
    .bg-accent,
    .navbar-dark,
    .w5obm-navbar,
    .w5obm-footer,
    .page-hero,
    .hero,
    .hero-section,
    .hero-home,
    .club-banner,
    .cta-section,
    .donation-card,
    [data-bs-theme="dark"]
) :is(a.link-body-emphasis, .btn-link) {
    color: var(--w5obm-readable-link-on-dark) !important;
}

:where(
    .bg-dark,
    .bg-primary,
    .bg-secondary,
    .bg-accent,
    .navbar-dark,
    .w5obm-navbar,
    .w5obm-footer,
    .page-hero,
    .hero,
    .hero-section,
    .hero-home,
    .club-banner,
    .cta-section,
    .donation-card,
    [data-bs-theme="dark"]
) :is(a.link-body-emphasis, .btn-link):hover,
:where(
    .bg-dark,
    .bg-primary,
    .bg-secondary,
    .bg-accent,
    .navbar-dark,
    .w5obm-navbar,
    .w5obm-footer,
    .page-hero,
    .hero,
    .hero-section,
    .hero-home,
    .club-banner,
    .cta-section,
    .donation-card,
    [data-bs-theme="dark"]
) :is(a.link-body-emphasis, .btn-link):focus {
    color: var(--w5obm-readable-link-hover-on-dark) !important;
}

.dropdown-menu.dropdown-menu-dark :is(.dropdown-header, .dropdown-item-text),
:where(
    .bg-dark,
    .bg-primary,
    .bg-secondary,
    .bg-accent,
    .navbar-dark,
    .w5obm-navbar,
    .w5obm-footer,
    .page-hero,
    .hero,
    .hero-section,
    .hero-home,
    .club-banner,
    .cta-section,
    .donation-card,
    [data-bs-theme="dark"]
) .dropdown-menu :is(.dropdown-header, .dropdown-item-text) {
    color: var(--w5obm-readable-secondary-on-dark) !important;
    opacity: 1 !important;
}

:where(
    .bg-dark,
    .bg-primary,
    .bg-secondary,
    .bg-accent,
    .navbar-dark,
    .w5obm-navbar,
    .w5obm-footer,
    .page-hero,
    .hero,
    .hero-section,
    .hero-home,
    .club-banner,
    .cta-section,
    .donation-card,
    [data-bs-theme="dark"]
) {
    --bs-secondary-color: var(--w5obm-readable-secondary-on-dark);
    --bs-link-color: var(--w5obm-readable-link-on-dark);
    --bs-link-hover-color: var(--w5obm-readable-link-hover-on-dark);
    --bs-nav-link-color: var(--w5obm-readable-link-on-dark);
    --bs-nav-link-hover-color: var(--w5obm-readable-link-hover-on-dark);
    --bs-pagination-color: var(--w5obm-readable-link-on-dark);
    --bs-pagination-hover-color: var(--w5obm-readable-link-hover-on-dark);
    --bs-pagination-focus-color: var(--w5obm-readable-link-hover-on-dark);
    --bs-breadcrumb-item-active-color: var(--w5obm-readable-secondary-on-dark);
    --bs-breadcrumb-divider-color: var(--w5obm-readable-secondary-on-dark);
    --bs-list-group-color: var(--w5obm-readable-emphasis-on-dark);
    --bs-list-group-action-color: var(--w5obm-readable-link-on-dark);
    --bs-list-group-action-hover-color: var(--w5obm-readable-link-hover-on-dark);
    --bs-list-group-action-active-color: var(--w5obm-readable-emphasis-on-dark);
    --bs-accordion-btn-color: var(--w5obm-readable-link-on-dark);
    --bs-accordion-active-color: var(--w5obm-readable-emphasis-on-dark);
}

:where(
    .bg-dark,
    .bg-primary,
    .bg-secondary,
    .bg-accent,
    .navbar-dark,
    .w5obm-navbar,
    .w5obm-footer,
    .page-hero,
    .hero,
    .hero-section,
    .hero-home,
    .club-banner,
    .cta-section,
    .donation-card,
    [data-bs-theme="dark"]
) :is(.form-text, .form-label, .col-form-label, .form-check-label, .form-floating > label, legend, .breadcrumb-item + .breadcrumb-item::before) {
    color: var(--w5obm-readable-secondary-on-dark) !important;
    opacity: 1 !important;
}

:where(
    .bg-dark,
    .bg-primary,
    .bg-secondary,
    .bg-accent,
    .navbar-dark,
    .w5obm-navbar,
    .w5obm-footer,
    .page-hero,
    .hero,
    .hero-section,
    .hero-home,
    .club-banner,
    .cta-section,
    .donation-card,
    [data-bs-theme="dark"]
) :is(
    .breadcrumb-item > a,
    .list-group-item-action:not(.active),
    .nav-tabs .nav-link:not(.active),
    .nav-pills .nav-link:not(.active),
    .nav-underline .nav-link:not(.active),
    .pagination .page-item:not(.active) > .page-link,
    .accordion-button
) {
    color: var(--w5obm-readable-link-on-dark) !important;
    opacity: 1 !important;
}

:where(
    .bg-dark,
    .bg-primary,
    .bg-secondary,
    .bg-accent,
    .navbar-dark,
    .w5obm-navbar,
    .w5obm-footer,
    .page-hero,
    .hero,
    .hero-section,
    .hero-home,
    .club-banner,
    .cta-section,
    .donation-card,
    [data-bs-theme="dark"]
) :is(
    .breadcrumb-item > a,
    .list-group-item-action:not(.active),
    .nav-tabs .nav-link:not(.active),
    .nav-pills .nav-link:not(.active),
    .nav-underline .nav-link:not(.active),
    .pagination .page-item:not(.active) > .page-link,
    .accordion-button
):hover,
:where(
    .bg-dark,
    .bg-primary,
    .bg-secondary,
    .bg-accent,
    .navbar-dark,
    .w5obm-navbar,
    .w5obm-footer,
    .page-hero,
    .hero,
    .hero-section,
    .hero-home,
    .club-banner,
    .cta-section,
    .donation-card,
    [data-bs-theme="dark"]
) :is(
    .breadcrumb-item > a,
    .list-group-item-action:not(.active),
    .nav-tabs .nav-link:not(.active),
    .nav-pills .nav-link:not(.active),
    .nav-underline .nav-link:not(.active),
    .pagination .page-item:not(.active) > .page-link,
    .accordion-button
):focus {
    color: var(--w5obm-readable-link-hover-on-dark) !important;
}

:where(
    .bg-dark,
    .bg-primary,
    .bg-secondary,
    .bg-accent,
    .navbar-dark,
    .w5obm-navbar,
    .w5obm-footer,
    .page-hero,
    .hero,
    .hero-section,
    .hero-home,
    .club-banner,
    .cta-section,
    .donation-card,
    [data-bs-theme="dark"]
) :is(.form-control, .form-select)::placeholder {
    color: var(--w5obm-readable-secondary-on-dark) !important;
    opacity: 1 !important;
}

/* Dark page themes can still contain light cards, tables, and form panels. Keep text readable there. */
:where([data-bs-theme="dark"], .theme-dark, .dark-theme, .dark-mode, body.dark, html.dark) :where(
    .card,
    .card-body,
    .card-footer,
    .table,
    .table-responsive,
    .accordion-item,
    .accordion-body,
    .modal-content,
    .modal-body,
    .modal-footer,
    .dropdown-menu:not(.dropdown-menu-dark),
    .popover,
    .offcanvas,
    .toast,
    .toast-body,
    .list-group-item
) :is(.form-text, .form-label, .col-form-label, .form-check-label, .form-floating > label, legend, label, .text-muted, .text-body-secondary, .text-black-50, .dropdown-header, .dropdown-item-text) {
    color: var(--w5obm-light-panel-muted) !important;
    opacity: 1 !important;
}

:where([data-bs-theme="dark"], .theme-dark, .dark-theme, .dark-mode, body.dark, html.dark) :where(
    .card,
    .card-body,
    .card-footer,
    .table,
    .table-responsive,
    .accordion-item,
    .accordion-body,
    .modal-content,
    .modal-body,
    .modal-footer,
    .dropdown-menu:not(.dropdown-menu-dark),
    .popover,
    .offcanvas,
    .toast,
    .toast-body,
    .list-group-item
) :is(.form-control, .form-select)::placeholder {
    color: var(--w5obm-light-panel-muted) !important;
    opacity: 1 !important;
}

:where([data-bs-theme="dark"], .theme-dark, .dark-theme, .dark-mode, body.dark, html.dark) :where(
    .card,
    .card-body,
    .card-footer,
    .modal-content,
    .modal-body,
    .modal-footer,
    .accordion-item,
    .accordion-body,
    .dropdown-menu:not(.dropdown-menu-dark),
    .popover,
    .offcanvas,
    .toast,
    .toast-body,
    .list-group-item,
    .table,
    .w5obm-table,
    .table-responsive
) {
    background-color: var(--w5obm-light-panel-bg) !important;
    color: var(--w5obm-light-panel-text) !important;
    border-color: var(--w5obm-light-panel-border) !important;
    --bs-body-bg: var(--w5obm-light-panel-bg);
    --bs-body-color: var(--w5obm-light-panel-text);
    --bs-emphasis-color: var(--w5obm-light-panel-text);
    --bs-secondary-color: var(--w5obm-light-panel-muted);
    --bs-border-color: var(--w5obm-light-panel-border);
    --bs-card-bg: var(--w5obm-light-panel-bg);
    --bs-card-color: var(--w5obm-light-panel-text);
    --bs-modal-bg: var(--w5obm-light-panel-bg);
    --bs-modal-color: var(--w5obm-light-panel-text);
    --bs-dropdown-bg: var(--w5obm-light-panel-bg);
    --bs-dropdown-link-color: var(--w5obm-light-panel-text);
    --bs-accordion-bg: var(--w5obm-light-panel-bg);
    --bs-accordion-color: var(--w5obm-light-panel-text);
    --bs-table-bg: var(--w5obm-light-panel-bg);
    --bs-table-color: var(--w5obm-light-panel-text);
    --bs-table-border-color: var(--w5obm-light-panel-border);
    --bs-table-striped-bg: var(--w5obm-light-panel-alt-bg);
    --bs-table-striped-color: var(--w5obm-light-panel-text);
    --bs-table-hover-bg: #eef3f8;
    --bs-table-hover-color: var(--w5obm-light-panel-text);
    --bs-table-active-bg: #e2e8f0;
    --bs-table-active-color: var(--w5obm-light-panel-text);
}

:where([data-bs-theme="dark"], .theme-dark, .dark-theme, .dark-mode, body.dark, html.dark) :is(
    .form-control,
    .form-select,
    .input-group-text,
    textarea
) {
    background-color: var(--w5obm-light-panel-bg) !important;
    color: var(--w5obm-light-panel-text) !important;
    border-color: var(--w5obm-light-panel-border) !important;
    -webkit-text-fill-color: var(--w5obm-light-panel-text) !important;
}

:where([data-bs-theme="dark"], .theme-dark, .dark-theme, .dark-mode, body.dark, html.dark) :is(.form-control, .form-select, textarea)::placeholder {
    color: var(--w5obm-light-panel-muted) !important;
    opacity: 1 !important;
}

:where([data-bs-theme="dark"], .theme-dark, .dark-theme, .dark-mode, body.dark, html.dark) :is(
    .table tbody tr,
    .w5obm-table tbody tr,
    table.dataTable tbody tr
) {
    background-color: var(--w5obm-light-panel-bg) !important;
    color: var(--w5obm-light-panel-text) !important;
}

:where([data-bs-theme="dark"], .theme-dark, .dark-theme, .dark-mode, body.dark, html.dark) :is(
    .table tbody tr:nth-child(even),
    .w5obm-table tbody tr:nth-child(even),
    table.dataTable tbody tr:nth-child(even)
) {
    background-color: var(--w5obm-light-panel-alt-bg) !important;
}

/* Card heading guard: runtime typography can override .h5 globally; keep card titles readable. */
:where(.card, .card-body) :is(h3.h5, h4.h5, h5, .h5, .card-title) {
    color: var(--theme-text-primary, var(--bs-body-color, #1f2937)) !important;
}

:where(
    .bg-dark .card,
    .bg-primary .card,
    .bg-secondary .card,
    .bg-accent .card,
    [data-bs-theme="dark"] .card,
    .card.bg-dark,
    .card.bg-primary,
    .card.bg-secondary,
    .card.bg-accent
) :is(h3.h5, h4.h5, h5, .h5, .card-title) {
    color: var(--hero-text-primary, #ffffff) !important;
}

/* Standard page + home hero titles */
.page-hero .hero-title,
.page-hero .hero-title-accent,
.premium-hero .premium-hero__title,
.hero-home .hero-home__title,
.hero-home .hero-home__title-accent,
.hero-home-title {
    color: var(--w5obm-hero-gold-mid) !important;
    text-shadow:
        /* top-left highlight to simulate bevel */
        -1px -1px 0 var(--w5obm-hero-title-highlight),
        0 1px 0 #FFFFFF3D,
        /* warm inner depth */
        0 4px 0 #5C300061,
        /* outer drop shadows */
        0 8px 18px var(--w5obm-hero-title-shadow-1),
        0 18px 42px var(--w5obm-hero-title-shadow-2),
        0 34px 70px var(--w5obm-hero-title-shadow-deep) !important;

    /* Subtle outline improves contrast on busy/dark photography */
    -webkit-text-stroke: 1px var(--w5obm-hero-gold-outline) !important;
}

@supports ((-webkit-background-clip: text) or (background-clip: text)) {

    .page-hero .hero-title,
    .page-hero .hero-title-accent,
    .premium-hero .premium-hero__title,
    .hero-home .hero-home__title,
    .hero-home .hero-home__title-accent,
    .hero-home-title {
        background-image: linear-gradient(180deg,
                var(--w5obm-hero-gold-top) 0%,
                var(--w5obm-hero-gold-mid) 46%,
                var(--w5obm-hero-gold-bottom) 100%) !important;
        background-size: 100% 100% !important;
        background-position: center center !important;
        background-repeat: no-repeat !important;
        -webkit-background-clip: text !important;
        background-clip: text !important;
        -webkit-text-fill-color: transparent !important;
    }
}

/* Site-wide stat contrast guard */
:is(
    .stat-number,
    .stats-number,
    .stat-value,
    .metric-value,
    .events-metric-value,
    .counter-number,
    .hero-stat-value,
    .hero-home__stat-value,
    .hero-stat-card span,
    .net-stat-number,
    .crm-stat-value,
    .stat-block h3
) {
    color: var(--w5obm-stat-value-readable) !important;
}

:is(
    .stat-label,
    .stats-label,
    .metric-label,
    .events-metric-label,
    .counter-label,
    .hero-stat-label,
    .hero-home__stat-label,
    .hero-stat-card small,
    .net-stat-label,
    .stat-block p,
    .stat-block small
) {
    color: var(--w5obm-stat-label-readable) !important;
    opacity: 1 !important;
}

:where(
    .bg-dark,
    .bg-primary,
    .bg-secondary,
    .bg-accent,
    .navbar-dark,
    .w5obm-navbar,
    .w5obm-footer,
    .page-hero,
    .hero,
    .hero-section,
    .hero-home,
    .premium-hero,
    .club-banner,
    .stats-section,
    .stats-banner,
    .events-portal-hero,
    [data-bs-theme="dark"]
) :is(
    .stat-number,
    .stats-number,
    .stat-value,
    .metric-value,
    .events-metric-value,
    .counter-number,
    .hero-stat-value,
    .hero-home__stat-value,
    .hero-stat-card span,
    .net-stat-number,
    .crm-stat-value,
    .stat-block h3
) {
    color: var(--w5obm-stat-value-readable-on-dark) !important;
    text-shadow: 0 1px 2px #00000059;
}

:where(
    .bg-dark,
    .bg-primary,
    .bg-secondary,
    .bg-accent,
    .navbar-dark,
    .w5obm-navbar,
    .w5obm-footer,
    .page-hero,
    .hero,
    .hero-section,
    .hero-home,
    .premium-hero,
    .club-banner,
    .stats-section,
    .stats-banner,
    .events-portal-hero,
    [data-bs-theme="dark"]
) :is(
    .stat-label,
    .stats-label,
    .metric-label,
    .events-metric-label,
    .counter-label,
    .hero-stat-label,
    .hero-home__stat-label,
    .hero-stat-card small,
    .net-stat-label,
    .stat-block p,
    .stat-block small
) {
    color: var(--w5obm-stat-label-readable-on-dark) !important;
    opacity: 1 !important;
}

/* Preserve semantic stat variants while keeping readable contrast */
.stat-value-success {
    color: var(--bs-success-text-emphasis, var(--bs-success, #198754)) !important;
}

.stat-value-danger {
    color: var(--bs-danger-text-emphasis, var(--bs-danger, var(--color-danger))) !important;
}

.stat-value-primary {
    color: var(--bs-primary-text-emphasis, var(--bs-primary, #0d6efd)) !important;
}
