/*
 * Confidence palette - ONE definition for both sports (owner decision 2026-10-23).
 * Green and red are reserved for RESULTS (WON / LOST). Confidence has its own family:
 *   HIGH = violet, MED = blue, LOW = amber. Change a colour here and every surface follows.
 * Text contrast on the darkest chip backgrounds (>= 4.5:1, WCAG AA): violet 4.5+, blue 4.8, amber 5.6+.
 * Chips always carry their text label (HIGH / MED / LOW); colour is never the only signal.
 */
:root {
  --conf-high: #a78bfa;  --conf-high-rgb: 167, 139, 250;
  --conf-med:  #60a5fa;  --conf-med-rgb:  96, 165, 250;
  --conf-low:  #f59e0b;  --conf-low-rgb:  245, 158, 11;
}

/* Plain text colour (percentages, picks tables) */
.conf-text--high { color: var(--conf-high); }
.conf-text--med  { color: var(--conf-med); }
.conf-text--low  { color: var(--conf-low); }

/* Chips: shared by football cards (.fb-conf), the landing football card (.fpf-conf) and generic chips (.conf-chip) */
.fb-conf--high, .fpf-conf.high, .conf-chip--high {
  background: rgba(var(--conf-high-rgb), 0.15); color: var(--conf-high);
  border-width: 1px; border-style: solid; border-color: rgba(var(--conf-high-rgb), 0.45);
}
.fb-conf--medium, .fpf-conf.medium, .conf-chip--med {
  background: rgba(var(--conf-med-rgb), 0.15); color: var(--conf-med);
  border-width: 1px; border-style: solid; border-color: rgba(var(--conf-med-rgb), 0.45);
}
.fb-conf--low, .fpf-conf.low, .conf-chip--low {
  background: rgba(var(--conf-low-rgb), 0.15); color: var(--conf-low);
  border-width: 1px; border-style: solid; border-color: rgba(var(--conf-low-rgb), 0.45);
}
.conf-chip {
  display: inline-block; font-size: 10px; font-weight: 700; padding: 1px 6px; border-radius: 4px;
}

/* "High Conf." stat tile (both sports) */
.stat-chip.stat-chip--conf { border-color: rgba(var(--conf-high-rgb), 0.35); background: rgba(var(--conf-high-rgb), 0.07); }
.stat-chip.stat-chip--conf .val { color: var(--conf-high); }

/* Guide legend rows */
.conf-table tr.high td { background: rgba(var(--conf-high-rgb), 0.06); }
.conf-table tr.med td  { background: rgba(var(--conf-med-rgb), 0.06); }
.conf-table tr.low td  { background: rgba(var(--conf-low-rgb), 0.06); }