/* ---------- Season table on a match ---------- */

/* The stripes and the shared highlight are the same cream on the stage, so
   the two sides of the match get a tint of the home colour instead. */
.pitch-site--app .match-season-table .table tbody tr.is-highlighted {
  background-color: color-mix(in srgb, var(--theme-home) 14%, transparent);
  font-weight: 600;
}

/* ---------- Competition cards ---------- */

.pitch-site--app .competition-card {
  position: relative;
}

.pitch-site--app .competition-card__link {
  padding-inline-end: var(--space-xl);
}

.pitch-site--app .competition-card__identity {
  flex: 1 1 0;
  min-width: 0;
}

.pitch-site--app .competition-card--locked .competition-card__link {
  opacity: 0.72;
}

.pitch-site--app .competition-card__lock {
  align-items: center;
  color: var(--color-ink-medium);
  display: inline-flex;
  height: 1.75rem;
  justify-content: center;
  width: 1.75rem;
}

.pitch-site--app .competition-card__lock svg {
  height: 0.875rem;
  width: 0.875rem;
}

.pitch-site--app .competition-card__favorite {
  inset-block-start: var(--space-xxs);
  inset-inline-end: var(--space-xxs);
  position: absolute;
}

/* ---------- Match summary: the report beside the key events ---------- */

.pitch-site--app .match-summary {
  display: grid;
  grid-template-columns: minmax(0, 1.5fr) minmax(0, 1fr);
}

.pitch-site--app .match-summary__report {
  border-inline-end: 1px solid rgb(14 17 17 / 0.14);
  padding-inline-end: clamp(16px, 2.4vw, 28px);
}

.pitch-site--app .match-summary__events {
  padding-inline-start: clamp(16px, 2.4vw, 28px);
}

.pitch-site--app .match-summary .match-narrative {
  font-size: 1.1875rem;
  line-height: 1.5;
}

.pitch-site--app .match-summary__values-heading {
  padding-block-start: var(--space-s);
}

.pitch-site--app .match-summary__values {
  margin: 0;
}

.pitch-site--app .match-summary__value {
  align-items: baseline;
  border-block-end: 1px solid var(--color-border-subtle);
  display: flex;
  font-size: 14px;
  gap: 12px;
  justify-content: space-between;
  padding-block: 6px;
}

.pitch-site--app .match-summary__value dd {
  font-family: var(--font-mono);
  font-weight: 600;
  margin: 0;
}

.pitch-site--app .match-summary__meetings {
  color: var(--ps-ink-soft);
}

@media (max-width: 49.999rem) {
  .pitch-site--app .match-summary {
    grid-template-columns: minmax(0, 1fr);
    row-gap: var(--space-xl);
  }

  .pitch-site--app .match-summary__report {
    border-inline-end: 0;
    padding-inline-end: 0;
  }

  .pitch-site--app .match-summary__events {
    padding-inline-start: 0;
  }
}

/* ---------- Stat bars: home against away, stat by stat ----------
   Home is pitch green and away is the soft ink, on every match and in every
   theme, so the two columns read the same way as the scoreboard above them. */

.pitch-site--app .stat-duels {
  display: flex;
  flex-direction: column;
  gap: 9px;
  list-style: none;
  margin: 0;
  padding: 0;
}

.pitch-site--app .stat-duel {
  align-items: center;
  display: grid;
  font-size: 0.875rem;
  gap: 10px;
  grid-template-columns: 3.75rem minmax(0, 1fr) minmax(5.5rem, 8.5rem) minmax(0, 1fr) 3.75rem;
}

.pitch-site--app .stat-duel--sides {
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
  padding-block-end: 2px;
}

.pitch-site--app .stat-duel__side {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.pitch-site--app .stat-duel__side--home {
  color: var(--ps-turf);
}

.pitch-site--app .stat-duel__side--away {
  color: var(--ps-ink-soft);
  text-align: end;
}

.pitch-site--app .stat-duel__value {
  font-family: var(--font-mono);
  font-variant-numeric: tabular-nums;
}

.pitch-site--app .stat-duel__value--away {
  text-align: end;
}

.pitch-site--app .stat-duel__label {
  color: var(--ps-ink-soft);
  text-align: center;
}

.pitch-site--app .stat-duel__track {
  background: var(--ps-paper-shade);
  border-radius: 2px;
  block-size: 10px;
  display: flex;
}

.pitch-site--app .stat-duel__track--home {
  justify-content: flex-end;
}

.pitch-site--app .stat-duel__fill {
  border-radius: 2px;
  inline-size: calc(var(--share) * 100%);
}

.pitch-site--app .stat-duel__track--home .stat-duel__fill {
  background: var(--ps-turf);
}

.pitch-site--app .stat-duel__track--away .stat-duel__fill {
  background: var(--ps-ink-soft);
}

/* ---------- Key events on the summary: minute, kind, who ---------- */

.pitch-site--app .key-moments {
  list-style: none;
  margin: 0;
  padding: 0;
}

.pitch-site--app .key-moment {
  align-items: baseline;
  border-block-end: 1px solid rgb(14 17 17 / 0.1);
  display: grid;
  font-size: 0.875rem;
  gap: 8px;
  grid-template-columns: 2.75rem 4.5rem minmax(0, 1fr);
  padding-block: 9px;
}

.pitch-site--app .key-moment__minute {
  font-family: var(--font-mono);
  font-variant-numeric: tabular-nums;
  font-weight: 600;
}

.pitch-site--app .key-moment .status-chip {
  padding-inline: 0;
  text-align: center;
}

.pitch-site--app .key-moment__text a {
  color: inherit;
  font-weight: 600;
  text-decoration: none;
}

.pitch-site--app .key-moment__text a:hover {
  text-decoration: underline;
}