/* LIGHT_GOLD_THEME_1
   User-approved light UI: warm-white canvas, white cards, dark text and
   amber/gold interaction accents. Semantic football/result colors remain
   green/yellow/red and keep their existing meanings.
*/

:root {
  /* Existing production tokens */
  --bg: #f4f5f3;
  --frame: #f7f8f6;
  --panel: #ffffff;
  --surface: #ffffff;
  --card-header: #fafaf8;
  --table-header: #f6f7f5;
  --header-bar: #ffffff;
  --border: rgba(17, 24, 39, .12);
  --border-emphasis: rgba(200, 135, 0, .32);
  --text: #151515;
  --text-body: #2e312f;
  --muted: #626762;
  --accent: #c88700;
  --accent-hover: #e3a400;
  --accent-dark: #fff2bf;
  --accent-border: #d49a00;
  --accent-soft: #fff4cc;

  /* Claude/mobile override tokens */
  --cd-bg: #f4f5f3;
  --cd-panel: #ffffff;
  --cd-panel-2: #ffffff;
  --cd-panel-3: #f8f9f7;
  --cd-header: #ffffff;
  --cd-border: rgba(17, 24, 39, .12);
  --cd-border-soft: rgba(17, 24, 39, .08);
  --cd-text: #151515;
  --cd-body: #343936;
  --cd-muted: #626762;
  --cd-muted-2: #777d78;
  --cd-accent: #c88700;
  --cd-accent-2: #e3a400;
  --cd-accent-soft: #fff4cc;

  /* Result semantics remain distinct from the gold UI accent. */
  --p1: #e9f7ef;
  --p1-text: #18864b;
  --px: #fff7da;
  --px-text: #a66b00;
  --p2: #fdecec;
  --p2-text: #c13b3b;
  --diff: #d64545;
}

html,
body {
  background: var(--bg) !important;
  color: var(--text) !important;
}

body {
  background:
    radial-gradient(circle at 50% -12%, rgba(227, 164, 0, .09) 0, rgba(244, 245, 243, 0) 33%),
    var(--bg) !important;
}

/* Header and main navigation */
header {
  background: #ffffff !important;
  border-bottom: 1px solid var(--border) !important;
  box-shadow: 0 2px 12px rgba(17, 24, 39, .04);
}

header h1,
.main-tab.active,
.main-tab-today.active {
  color: var(--text) !important;
}

.brand-subtitle,
header .updated,
.main-tab,
.results-live-state,
.mc-meta,
.mc-confidence,
.detail-venue,
.detail-kickoff,
.detail-competition,
.detail-field > span:first-child,
.no-data {
  color: var(--muted) !important;
}

.main-tabs {
  background: #ffffff !important;
  border-bottom-color: var(--border) !important;
}

.main-tab.active,
.main-tab-today.active {
  background: transparent !important;
  border-bottom-color: var(--accent) !important;
}

/* Dashboard and controls */
.kpi,
.week-selector-row .filter-select,
.match-search,
.coupon-panel,
.coupon-form input,
.coupon-form select {
  background: #ffffff !important;
  color: var(--text) !important;
  border-color: var(--border) !important;
  box-shadow: 0 5px 16px rgba(17, 24, 39, .035);
}

.kpi:nth-child(1) { border-color: rgba(24, 134, 75, .48) !important; }
.kpi:nth-child(2) { border-color: rgba(200, 135, 0, .58) !important; }
.kpi:nth-child(3) { border-color: rgba(166, 107, 0, .42) !important; }

.kpi .value,
.kpi .label,
.coupon-panel h2 {
  color: var(--text) !important;
}

.kpi .kpi-sub,
.match-search::placeholder {
  color: var(--muted) !important;
}

.kpi-deadline {
  border-left-color: var(--border) !important;
}

.match-view-tab,
.coupon-tab,
.toggle-btn {
  background: #ffffff !important;
  border-color: var(--border) !important;
  color: #666d68 !important;
}

.match-view-tab.active,
.coupon-tab.active,
.toggle-btn.active {
  background: var(--accent-soft) !important;
  border-color: var(--accent-border) !important;
  color: #8a5a00 !important;
}

.match-view-tab-live.active.has-live {
  background: #fff0f0 !important;
  border-color: #dc4545 !important;
  color: #b42323 !important;
}

/* Duplicate week/deadline strip is intentionally removed from mobile UI. */
.week-head {
  display: none !important;
}

/* Match cards */
.match-card {
  background: #ffffff !important;
  border-color: var(--border) !important;
  box-shadow: 0 5px 16px rgba(17, 24, 39, .045) !important;
}

.match-card:last-child {
  border-bottom-color: var(--border) !important;
}

.match-card:hover,
.match-card:active {
  background: #fffbf0 !important;
}

.mc-team span {
  color: var(--text) !important;
}

.mc-no {
  color: #858b86 !important;
}

.mc-state-pending {
  background: #f5f6f4 !important;
  color: #626762 !important;
  border-color: var(--border) !important;
}

.match-picks .pick {
  background: var(--accent-soft) !important;
  border-color: var(--accent-border) !important;
  color: #8a5a00 !important;
}

.match-picks--correct .pick {
  background: #eaf8ef !important;
  border-color: #23a35b !important;
  color: #18864b !important;
}

.match-picks--wrong .pick {
  background: #fdeeee !important;
  border-color: #d84c4c !important;
  color: #bd3636 !important;
}

.primary-btn,
.save-generated-btn {
  background: linear-gradient(135deg, #e3a400, #c88700) !important;
  color: #241800 !important;
  box-shadow: 0 8px 18px rgba(200, 135, 0, .22) !important;
}

/* Match Detail */
.modal-sheet,
.match-detail-sheet,
.modal-head,
.detail-tabs {
  background: #ffffff !important;
}

.modal-sheet,
.match-detail-sheet {
  color: var(--text) !important;
}

.modal-head,
.detail-tabs {
  border-color: var(--border) !important;
}

.detail-tab {
  color: var(--muted) !important;
}

.detail-tab.active {
  color: var(--text) !important;
  border-bottom-color: var(--accent) !important;
}

.detail-match-hero,
.detail-summary-card,
.detail-notes,
.injury-team,
.kpi-mini,
.odds-history-panel,
.team-stat-card,
.global-odds-cards > div,
.insight-scan-card,
.venue-card {
  background: #ffffff !important;
  border-color: var(--border) !important;
  box-shadow: 0 5px 16px rgba(17, 24, 39, .035);
}

/* Stronger, consistent section hierarchy on the light canvas. */
.detail-section > h4,
.detail-summary-card > h4,
#detailForm > h4,
#detailH2H > h4,
#detailStandings > h4,
#detailInjuries > h4,
.team-stats-section > h4,
.global-odds-title-row h4 {
  color: var(--text) !important;
  font-weight: 900 !important;
  letter-spacing: .015em;
}

.detail-section > h4 small,
.nesine-heading small {
  color: var(--muted) !important;
  font-weight: 650 !important;
}

/* Gold frame language for analysis/interactive cards, without recoloring
   football result semantics. */
.insight-scan-card,
.insight-confidence,
.insight-global-odds,
.h2h-filter-tabs .match-view-tab.active {
  border-color: var(--accent-border) !important;
}

.insight-scan-card.insight-primary {
  background: linear-gradient(135deg, #fff7d9, #ffffff) !important;
}

.insight-confidence {
  background: var(--accent-soft) !important;
  color: #6f4900 !important;
}

.insight-card-label,
.global-odds-meta,
.global-bookmaker-head,
.team-stat-row span {
  color: var(--muted) !important;
}

.global-odds-body,
.team-stat-row,
.global-bookmaker-head,
.global-bookmaker-row {
  border-color: var(--border) !important;
}

/* H2H */
.h2h-list,
.h2h-empty {
  background: #ffffff !important;
  border-color: var(--border) !important;
}

.h2h-match-row {
  border-bottom-color: rgba(17, 24, 39, .08) !important;
}

.h2h-team {
  color: #555c57 !important;
}

.h2h-team--focus,
.h2h-score-cell strong,
.h2h-team-block h5,
.h2h-pair-block h5 {
  color: var(--text) !important;
}

.h2h-date {
  color: var(--muted) !important;
}

.h2h-result-badge--win {
  background: #eaf8ef !important;
  color: #18864b !important;
  border-color: rgba(24, 134, 75, .35) !important;
}

.h2h-result-badge--draw {
  background: #fff7da !important;
  color: #a66b00 !important;
  border-color: rgba(166, 107, 0, .28) !important;
}

.h2h-result-badge--loss {
  background: #fdecec !important;
  color: #c13b3b !important;
  border-color: rgba(193, 59, 59, .28) !important;
}

.h2h-result-badge--empty {
  background: #f5f6f4 !important;
  color: var(--muted) !important;
  border-color: var(--border) !important;
}

/* Standings: provider-ID crest + compact canonical display name. */
.standings-table td.match {
  min-width: 118px !important;
  max-width: 140px;
}

.standing-team-cell {
  display: flex;
  align-items: center;
  gap: 6px;
  min-width: 0;
  width: 100%;
}

.standing-team-logo {
  width: 19px;
  height: 19px;
  flex: 0 0 19px;
  object-fit: contain;
}

.standing-team-name {
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  color: var(--text);
  font-weight: 650;
}

tr.standing-home .standing-team-name,
tr.standing-away .standing-team-name {
  font-weight: 850;
}

/* Tables and generic panels that are still styled by the legacy index CSS. */
table,
thead,
tbody,
.form-scope,
.detail-section,
.saved-coupon-card,
.coupon-card {
  color: var(--text);
}

thead,
.table-header {
  background: var(--table-header) !important;
}

tr,
td,
th {
  border-color: var(--border) !important;
}

/* Keep semantic live/success states vivid on the light canvas. */
.status-dot {
  background: #22a65e !important;
  box-shadow: 0 0 7px rgba(34, 166, 94, .30) !important;
}

.nesine-leader {
  border-color: #22a65e !important;
  background: #effaf3 !important;
}

@media (max-width: 640px) {
  .modal-head {
    background: #ffffff !important;
  }

  .match-card,
  .kpi,
  .team-stat-card,
  .insight-scan-card,
  .h2h-list,
  .injury-team {
    box-shadow: 0 3px 12px rgba(17, 24, 39, .04) !important;
  }

  .standings-table td.match {
    min-width: 112px !important;
    max-width: 128px;
  }

  .standing-team-logo {
    width: 18px;
    height: 18px;
    flex-basis: 18px;
  }
}