/* Rezilta Engine V5.61.4 - final semantic light-mode contrast layer.
   This file intentionally loads after legacy and page-specific styles. */

html[data-theme="light"] {
  color-scheme: light;
  --rz-bg-page: var(--bg);
  --rz-bg-surface: var(--surface);
  --rz-bg-elevated: var(--surface2);
  --rz-bg-soft: var(--surface2);
  --rz-border-default: var(--border);
  --rz-border-strong: color-mix(in srgb, var(--border) 76%, var(--text));
  --rz-text-primary: var(--text);
  --rz-text-secondary: var(--muted);
  --rz-text-muted: var(--muted);
  --rz-accent: var(--green);
  --rz-accent-hover: var(--semantic-action-hover);
  --rz-warning: var(--semantic-warning);
  --rz-danger: var(--semantic-danger);
  --rz-focus: var(--semantic-focus);
  --rz-shadow: var(--theme-shadow);
  --bs-body-color: var(--text);
  --bs-body-color-rgb: 16, 32, 25;
  --bs-body-bg: var(--bg);
  --bs-body-bg-rgb: 242, 246, 243;
  --bs-secondary-color: var(--muted);
  --bs-secondary-bg: var(--surface2);
  --bs-tertiary-color: var(--muted);
  --bs-tertiary-bg: var(--surface2);
  --bs-emphasis-color: var(--text);
  --bs-border-color: var(--border);
  --bs-link-color: var(--green);
  --bs-link-hover-color: var(--semantic-action-hover);
  background: var(--bg) !important;
}

/* Page modules introduced before the shared theme use their own token prefixes.
   Remap every known family so their existing selectors become light-aware too. */
html[data-theme="light"] {
  --fr-bg: var(--bg); --fr-card: var(--surface); --fr-text: var(--text); --fr-muted: var(--muted); --fr-line: var(--border); --fr-green: var(--green); --fr-yellow: var(--yellow);
  --bod-bg: var(--bg); --bod-card: var(--surface); --bod-text: var(--text); --bod-muted: var(--muted); --bod-line: var(--border); --bod-green: var(--green); --bod-yellow: var(--yellow);
  --coh-bg: var(--bg); --coh-card: var(--surface); --coh-muted: var(--muted); --coh-line: var(--border); --coh-green: var(--green); --coh-yellow: var(--yellow);
  --bcgr-bg: var(--bg); --bcgr-text: var(--text); --bcgr-muted: var(--muted); --bcgr-line: var(--border); --bcgr-green: var(--green);
  --hp42-bg: var(--bg); --hp42-muted: var(--muted); --hp42-line: var(--border); --hp42-green: var(--green);
  --lr45-bg: var(--bg); --lr45-text: var(--text); --lr45-muted: var(--muted); --lr45-line: var(--border); --lr45-green: var(--green);
  --lr46-bg: var(--bg); --lr46-text: var(--text); --lr46-muted: var(--muted); --lr46-line: var(--border); --lr46-green: var(--green);
  --ls-bg: var(--bg); --ls-text: var(--text); --ls-muted: var(--muted); --ls-line: var(--border); --ls-green: var(--green);
  --oc-bg: var(--bg); --oc-text: var(--text); --oc-muted: var(--muted); --oc-line: var(--border); --oc-green: var(--green);
  --r57-bg: var(--bg); --r57-text: var(--text); --r57-muted: var(--muted); --r57-line: var(--border); --r57-green: var(--green);
  --rr44-bg: var(--bg); --rr44-text: var(--text); --rr44-muted: var(--muted); --rr44-line: var(--border); --rr44-green: var(--green);
  --rt-bg: var(--bg); --rt-text: var(--text); --rt-muted: var(--muted); --rt-line: var(--border); --rt-green: var(--green);
  --rz50-bg: var(--bg); --rz50-text: var(--text); --rz50-muted: var(--muted); --rz50-line: var(--border); --rz50-green: var(--green);
  --rzbr-bg: var(--bg); --rzbr-text: var(--text); --rzbr-muted: var(--muted); --rzbr-line: var(--border); --rzbr-green: var(--green);
  --sg-bg: var(--bg); --sg-text: var(--text); --sg-muted: var(--muted); --sg-line: var(--border); --sg-green: var(--green);
  --st-bg: var(--bg); --st-text: var(--text); --st-muted: var(--muted); --st-border: var(--border); --st-green: var(--green); --st-yellow: var(--yellow); --st-red: var(--semantic-danger);
  --st41-bg: var(--bg); --st41-text: var(--text); --st41-muted: var(--muted); --st41-line: var(--border); --st41-green: var(--green);
  --wl-bg: var(--bg); --wl-card: var(--surface); --wl-text: var(--text); --wl-muted: var(--muted); --wl-line: var(--border); --wl-green: var(--green);
  --xbr-bg: var(--bg); --xbr-text: var(--text); --xbr-muted: var(--muted); --xbr-line: var(--border); --xbr-green: var(--green);
  --card-bg: var(--surface); --bg-card: var(--surface); --text-muted: var(--muted); --bs-border: var(--border);
}

html[data-theme="light"] body {
  background: var(--bg) !important;
  color: var(--text) !important;
}

html[data-theme="light"] :where(main, .page-shell, .group-page-shell, .content-section, .content-section.alt, .home-section, .rz-section, .th-page, .lr46-shell, .rh-shell, .hp-shell, .coh-shell, .rch-shell) {
  background-color: var(--bg) !important;
  color: var(--text) !important;
}

/* Typography: no inherited white or dark-theme grey may survive on a light surface. */
html[data-theme="light"] :where(h1, h2, h3, h4, h5, h6, legend, label, summary, dt, dd, li, caption, figcaption, .title, .card-title, .panel-title, .section-title, .section-head, .brand, .brand span, .match-name, .team-name, .horse-name, .event-name, .competition-name, .fr-score, .ir-horse, .rz-value, .stat-value) {
  color: var(--text) !important;
}

html[data-theme="light"] :where(p, small, .small, .muted, .text-muted, .text-secondary, .section-date, .card-meta, .meta, .tip-reasoning, .field-help, .helper-text, .description, .subtitle, .subheading, .empty-copy, .footer-copy) {
  color: var(--muted) !important;
  opacity: 1 !important;
}

html[data-theme="light"] :where(strong, b):not(.btn *):not(.rz-button *):not(.bet-now *):not(.badge *):not(.chip *) {
  color: var(--text) !important;
}

html[data-theme="light"] :where(
  .preview-metric-box > div > span, .summary-stat-box > div > span,
  .preview-row-selection, .preview-profit-strip, .group-preview-card > p,
  .preview-row-main > strong, .preview-metric-box > div > strong,
  .summary-stat-box > div > strong, .card-top, .event-card em,
  .news-card p, .status-list small, .stat-grid span, .stat-grid small
) {
  color: var(--text) !important;
}

html[data-theme="light"] :where(
  .preview-metric-box > div > span, .summary-stat-box > div > span,
  .group-preview-card > p, .preview-profit-strip, .card-top,
  .event-card em, .news-card p, .status-list small, .stat-grid span, .stat-grid small
) {
  color: var(--muted) !important;
}

html[data-theme="light"] :where(.text-white, .text-light, [class*="text-white"], [class*="text-light"]) {
  color: var(--text) !important;
}

html[data-theme="light"] a:not(.btn):not(.rz-button):not(.bet-now):not([class*="badge"]):not([class*="chip"]) {
  color: var(--green) !important;
  text-decoration-color: color-mix(in srgb, var(--green) 45%, transparent);
}

html[data-theme="light"] a:not(.btn):not(.rz-button):hover {
  color: var(--semantic-action-hover) !important;
  text-decoration-color: currentColor;
}

/* Structural surfaces, including legacy cards that previously retained dark fills. */
html[data-theme="light"] :where(
  .card, .panel, .box, .widget, .modal-content, .dropdown-menu, .offcanvas,
  .event-card, .news-card, .top-pick, .group-preview-card, .acca-template-card,
  .summary-stat-box, .preview-metric-box, .mockup-card, .daily-tip-card,
  .th-panel, .th-card, .th-match-row, .th-mini-row, .th-market-sweep,
  .lr46-panel, .lr46-card, .fr-league, .fr-match, .ir-card, .hf-racecard,
  .rch-section, .rr44-panel, .st41-panel, .search-card, .result-card,
  .stat-card, .metric-card, .bookmaker-card, .calculator-card, .learning-card,
  .race-card, .lotto-card, .lotto-result-card, .racing-meeting-card,
  .home-quick-card, .responsible-card, .notice-card, .content-card,
  .market-card, .prediction-card, .fixture-card, .profile-card
) {
  background: var(--surface) !important;
  background-image: none !important;
  color: var(--text) !important;
  border-color: var(--border) !important;
  box-shadow: var(--theme-shadow) !important;
}

html[data-theme="light"] :where(
  .market, .pick-line, .progress, .confidence, .metric,
  .enhanced-preview-row, .preview-row, .status-row, .data-row,
  .nav-card, .quick-link, .filter-bar, .toolbar, .pagination,
  .accordion-item, .accordion-body, details, pre, code:not(.search-preview code)
) {
  background-color: var(--surface2) !important;
  color: var(--text) !important;
  border-color: var(--border) !important;
}

/* Header, navigation, drawers and footers. */
html[data-theme="light"] :where(.site-header, .mega-site-header, .mega-nav-panel, .v5-mobile-nav, .mobile-bottom-nav, .site-footer, .responsible-footer, footer, .navbar, .nav-menu) {
  background: var(--surface) !important;
  color: var(--text) !important;
  border-color: var(--border) !important;
  box-shadow: 0 8px 26px rgba(20, 34, 27, .08) !important;
}

html[data-theme="light"] :where(.mega-nav-trigger, .mega-nav-panel a, .v5-mobile-nav a, .v5-mobile-nav summary, .mobile-bottom-nav a, .site-footer a, footer a) {
  color: var(--text) !important;
}

html[data-theme="light"] :where(.mega-nav-panel a:hover, .mega-nav-panel a.is-active, .v5-mobile-nav a:hover, .mobile-bottom-nav a:hover, .mobile-bottom-nav a.is-active) {
  background: var(--surface2) !important;
  color: var(--green) !important;
}

html[data-theme="light"] .v5-menu-backdrop {
  background: rgba(20, 34, 27, .46) !important;
}

/* Heroes retain imagery when present, but always receive a readable light text panel. */
html[data-theme="light"] :where(.hero, [class$="-hero"], [class*="-hero "]) {
  color: var(--text) !important;
  border-color: var(--border) !important;
}

html[data-theme="light"] :where(.hero-copy, [class$="-hero-copy"], [class*="-hero-copy "]) {
  background: color-mix(in srgb, var(--surface) 94%, transparent) !important;
  color: var(--text) !important;
  border-color: var(--border) !important;
  text-shadow: none !important;
}

html[data-theme="light"] :where(.hero h1, .hero h2, .hero h3, [class$="-hero"] h1, [class$="-hero"] h2, [class$="-hero"] h3, [class*="-hero "] h1, [class*="-hero "] h2, [class*="-hero "] h3) {
  color: var(--text) !important;
  text-shadow: none !important;
}

/* Forms and native controls. */
html[data-theme="light"] :where(input, select, textarea, .form-control, .form-select, .input-group-text) {
  background: var(--surface) !important;
  color: var(--text) !important;
  border-color: color-mix(in srgb, var(--border) 76%, var(--text)) !important;
  -webkit-text-fill-color: var(--text);
  opacity: 1;
}

html[data-theme="light"] :where(input, textarea)::placeholder {
  color: var(--muted) !important;
  opacity: 1 !important;
}

html[data-theme="light"] :where(input:disabled, select:disabled, textarea:disabled, .form-control:disabled, .form-select:disabled) {
  background: var(--surface2) !important;
  color: var(--semantic-disabled) !important;
  -webkit-text-fill-color: var(--semantic-disabled);
  opacity: 1 !important;
}

html[data-theme="light"] option {
  background: var(--surface) !important;
  color: var(--text) !important;
}

/* Buttons: explicit on-colour text for filled actions and dark readable text for yellow accents. */
html[data-theme="light"] :where(.btn, .rz-button, button:not(.mega-nav-trigger):not([data-v5-menu-close])) {
  background: var(--surface2) !important;
  color: var(--text) !important;
  border-color: var(--border) !important;
}

html[data-theme="light"] :where(.btn.primary, .btn-success, .btn-primary, .rz-button--primary, .bet-now, .primary-action, [class*="btn-primary"], [class*="btn-success"]) {
  background: var(--green) !important;
  color: #fff !important;
  border-color: var(--green) !important;
  -webkit-text-fill-color: #fff;
}

html[data-theme="light"] :where(.btn-warning, .btn.yellow, .accent-action, [class*="btn-warning"]) {
  background: #f6c945 !important;
  color: #251b00 !important;
  border-color: #8a5a00 !important;
  -webkit-text-fill-color: #251b00;
}

html[data-theme="light"] :where(.btn-danger, [class*="btn-danger"]) {
  background: var(--semantic-danger) !important;
  color: #fff !important;
  border-color: var(--semantic-danger) !important;
  -webkit-text-fill-color: #fff;
}

html[data-theme="light"] :where(.btn-outline-light, .btn.ghost, .rz-button--secondary, .outline-action) {
  background: var(--surface) !important;
  color: var(--green) !important;
  border-color: var(--green) !important;
  -webkit-text-fill-color: var(--green);
}

html[data-theme="light"] :where(.btn:hover, .rz-button:hover, button:hover) {
  filter: brightness(.96);
}

/* Tables, lists and pagination. */
html[data-theme="light"] :where(.table, table, thead, tbody, tr, th, td) {
  color: var(--text) !important;
  border-color: var(--border) !important;
  --bs-table-color: var(--text);
  --bs-table-bg: transparent;
  --bs-table-border-color: var(--border);
  --bs-table-striped-color: var(--text);
  --bs-table-striped-bg: var(--surface2);
  --bs-table-hover-color: var(--text);
  --bs-table-hover-bg: var(--surface2);
}

html[data-theme="light"] :where(.table-responsive, .table-wrap) {
  background: var(--surface) !important;
  border-color: var(--border) !important;
}

html[data-theme="light"] :where(thead, th) {
  background: var(--surface2) !important;
  color: var(--text) !important;
}

html[data-theme="light"] :where(tbody tr:nth-child(even), .table-striped > tbody > tr:nth-of-type(odd) > *) {
  background-color: color-mix(in srgb, var(--surface2) 60%, var(--surface)) !important;
}

html[data-theme="light"] :where(.page-link, .pagination a) {
  background: var(--surface) !important;
  color: var(--green) !important;
  border-color: var(--border) !important;
}

html[data-theme="light"] :where(.page-item.active .page-link, .pagination .active) {
  background: var(--green) !important;
  color: #fff !important;
  border-color: var(--green) !important;
}

/* Semantic statuses use both colour and readable words/icons supplied by templates. */
html[data-theme="light"] :where(.success, .won, .ok, .is-success, .status-won, .badge-success, .badge.green) {
  background-color: color-mix(in srgb, var(--semantic-success) 12%, var(--surface)) !important;
  color: var(--semantic-success) !important;
  border-color: color-mix(in srgb, var(--semantic-success) 38%, var(--surface)) !important;
}

html[data-theme="light"] :where(.warning, .pending, .warn, .is-warning, .status-pending, .badge-warning, .badge.yellow) {
  background-color: color-mix(in srgb, var(--semantic-warning) 12%, var(--surface)) !important;
  color: var(--semantic-warning) !important;
  border-color: color-mix(in srgb, var(--semantic-warning) 38%, var(--surface)) !important;
}

html[data-theme="light"] :where(.danger, .lost, .bad, .error, .is-danger, .is-error, .status-lost, .badge-danger) {
  background-color: color-mix(in srgb, var(--semantic-danger) 10%, var(--surface)) !important;
  color: var(--semantic-danger) !important;
  border-color: color-mix(in srgb, var(--semantic-danger) 36%, var(--surface)) !important;
}

html[data-theme="light"] :where(.info, .review, .is-info, .status-review, .badge-info) {
  background-color: color-mix(in srgb, var(--semantic-info) 10%, var(--surface)) !important;
  color: var(--semantic-info) !important;
  border-color: color-mix(in srgb, var(--semantic-info) 36%, var(--surface)) !important;
}

html[data-theme="light"] :where(.badge, .chip, .pill, [class*="badge"], [class*="chip"]) {
  opacity: 1 !important;
}

html[data-theme="light"] :where(.eyebrow, .kicker, .accent, .market strong, .pick-line strong, .section-head > a, .th-section-head > a) {
  color: var(--green) !important;
}

html[data-theme="light"] :where(.odds, .odds-value, .price, .highlight-odds strong) {
  color: var(--yellow) !important;
}

html[data-theme="light"] :where(.preview-metric-box.metric-highlight strong, .summary-stat-box.highlight-odds strong, .enhanced-preview-row > em) {
  color: var(--yellow) !important;
}

html[data-theme="light"] :where(.preview-metric-box.metric-return strong, .summary-stat-box.highlight-return strong, .preview-profit-strip strong) {
  color: var(--green) !important;
}

/* Known dense legacy modules with important dark-only declarations. */
html[data-theme="light"] :where(.bod-faq-market-head h3, .bod-market-link, .bod-match-link, .fr-match strong, .fr-result strong, .lr46-card strong, .rr44-panel strong, .st41-panel strong) {
  color: var(--text) !important;
}

/* Dialogs, notices, tooltips and empty states. */
html[data-theme="light"] :where(.alert, .notice, .toast, .popover, .tooltip-inner, .empty-state, .public-empty) {
  background: var(--surface) !important;
  color: var(--text) !important;
  border-color: var(--border) !important;
}

html[data-theme="light"] :where(.modal-header, .modal-footer, .accordion-header, .accordion-button) {
  background: var(--surface2) !important;
  color: var(--text) !important;
  border-color: var(--border) !important;
}

html[data-theme="light"] .accordion-button::after {
  filter: none !important;
}

html[data-theme="light"] :where(hr, .divider) {
  border-color: var(--border) !important;
  opacity: 1;
}

/* Skeletons must remain visible without becoming heavy in light mode. */
html[data-theme="light"] {
  --rz-loader-panel: var(--surface);
  --rz-loader-line: #dbe5df;
  --skeleton-base: #dbe5df;
  --skeleton-highlight: #f7faf8;
}

html[data-theme="light"] :where([data-rz-skeleton], .skeleton, .skeleton-line, .rz-page-skeleton-card, .rz-page-skeleton-hero) {
  border-color: var(--border) !important;
}

/* Browser-native selection and keyboard focus remain visible. */
html[data-theme="light"] ::selection {
  background: #b9e8ce;
  color: #102019;
}

html[data-theme="light"] :where(a, button, input, select, textarea, summary, [tabindex]):focus-visible {
  outline-color: var(--semantic-focus) !important;
}

@media (prefers-contrast: more) {
  html[data-theme="light"] {
    --border: #52655b;
    --muted: #33483d;
  }

  html[data-theme="light"] :where(.card, .panel, .event-card, table, input, select, textarea, .btn) {
    border-width: 2px !important;
  }
}

@media (forced-colors: active) {
  html[data-theme="light"] :where(.card, .panel, .event-card, .btn, input, select, textarea, table, th, td) {
    forced-color-adjust: auto;
  }
}

@media print {
  html[data-theme="light"] body,
  html[data-theme="light"] :where(.card, .panel, .event-card, table) {
    background: #fff !important;
    color: #000 !important;
    box-shadow: none !important;
  }
}
