/* ==========================================================
   TEAMS — standings table, homepage team cards, team.html
   (KPIs, game cards, cup, season picker, players table)
   ========================================================== */
.standings-table{width:100%;border-collapse:collapse;font-size:.9rem;min-width:560px}
.standings-table th,.standings-table td{padding:.6rem .75rem;text-align:left;border-bottom:1px solid var(--line)}
.standings-table th{color:var(--ink-muted);font-weight:600;font-size:.8rem;text-transform:uppercase}
.standings-table tr.is-own-team{background:#fdece4;font-weight:600}
.standings-table td:first-child,.standings-table th:first-child{text-align:center;width:2.5rem}
.standings-table__short{color:var(--ink-muted);font-weight:700;font-size:.8rem}
.standings-placeholder{color:var(--ink-muted);font-style:italic}
/* sits under the table as a footnote (both pages) */
.standings-updated{color:var(--ink-muted);font-size:.8rem;margin:.6rem 0 0}
.standings-updated:empty{display:none}
.team-title{margin-top:.5rem}
.team-long-name{color:var(--ink-muted);font-size:1.15rem;margin:.15rem 0 0}
.team-meta{color:var(--ink-muted)}
.league-meta{color:var(--ink-muted);font-size:.9rem;margin:.25rem 0 0}

/* ---- teams overview (index.html #teams) ---- */
.teams-list{display:flex;flex-direction:column;gap:2rem}
.teams-list__injected{display:contents}
.team-standings{
  background:#fff;border:1px solid var(--line);border-radius:var(--radius);
  box-shadow:var(--shadow);overflow:hidden;
}
.team-standings__head{
  display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:1rem;
  background:var(--navy-700);color:#fff;padding:1.5rem 1.75rem;
}
.team-standings__head h3{margin:0;font-size:1.4rem;color:#fff}
.team-standings__league{color:rgba(255,255,255,.75);font-size:.9rem;margin-top:.15rem}
.team-standings__link{
  display:inline-block;background:var(--orange);color:#fff;font-weight:600;
  text-decoration:none;font-size:.85rem;white-space:nowrap;
  padding:.65rem 1.25rem;border-radius:999px;transition:background .15s;
}
.team-standings__link:hover{background:var(--orange-dark)}
/* light strip between head and table: next fixture / cup status / note.
   Cells sit side by side with a divider, stacked on narrow screens. */
.team-standings__meta{
  display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));
  background:var(--bg-soft);border-bottom:1px solid var(--line);
}
.team-standings__meta-cell{
  padding:.9rem 1.75rem;font-size:.9rem;line-height:1.45;
  border-left:1px solid var(--line);
}
.team-standings__meta-cell:first-child{border-left:0}
.team-standings__meta-label{
  display:block;color:var(--orange);font-size:.7rem;font-weight:700;
  text-transform:uppercase;letter-spacing:.04em;margin-bottom:.2rem;
}
.team-standings__meta-value strong{color:var(--ink)}
.team-standings__meta-short{color:var(--ink-muted);font-weight:700;font-size:.75rem}
.team-standings__meta-muted{color:var(--ink-muted);font-size:.85rem}
.team-standings__meta-cell--note{color:var(--ink-muted);font-style:italic}
.team-standings__meta-cell--note .team-standings__meta-label{color:var(--ink-muted)}
@media(max-width:640px){
  .team-standings__meta{grid-template-columns:1fr}
  .team-standings__meta-cell{border-left:0;border-top:1px solid var(--line)}
  .team-standings__meta-cell:first-child{border-top:0}
}
.team-standings__body{padding:1.5rem 1.75rem}
.team-standings__text{margin:0}

.game-card{
  background:#fff;border:1px solid var(--line);border-left:4px solid transparent;
  border-radius:var(--radius);margin-bottom:1rem;overflow:hidden;
}
/* Result colours are Okabe-Ito (bluish green / vermillion) and never the
   only signal: the card is white, the status is a thick bar, and the
   chips differ in lightness (filled vs. outlined). Readable with red-green
   colour vision deficiency. */
.game-card.is-win{border-left:8px solid #009e73}
.game-card.is-loss{border-left:8px solid #d55e00}
.game-card.is-draw{border-left:8px solid #8a949e}
.game-card__head{
  display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:1rem;
  padding:1.1rem 1.5rem;cursor:pointer;list-style:none;
}
.game-card__head::-webkit-details-marker{display:none}
.game-card__head:hover{background:var(--bg-soft)}
.game-card__meta{grid-column:1;grid-row:1;display:flex;align-items:center;gap:.4rem}
.game-card__date{color:var(--ink-muted);font-size:.85rem;white-space:nowrap}
.game-card__venue-icon{width:1rem;height:1rem;color:var(--ink-muted);flex-shrink:0}
/* Sub-grid so the score sits exactly centered between the two team names,
   however long they are — each team column is the same width (1fr) and
   the score column stays a fixed, content-sized anchor in the middle. */
.game-card__matchup{
  grid-column:2;grid-row:1;display:grid;grid-template-columns:1fr auto 1fr;
  align-items:baseline;gap:.6rem;min-width:0;
}
/* long one-word club names ("Kindertischtennisakademie") must break
   inside their column instead of running over the score on phones;
   only long words get hyphenated, so "Sportunion" stays whole */
.game-card__team{
  font-weight:700;min-width:0;overflow-wrap:anywhere;
  hyphens:auto;hyphenate-limit-chars:12 5 5;
  -webkit-hyphenate-limit-before:5;-webkit-hyphenate-limit-after:5;
}
.game-card__team--home{text-align:right}
.game-card__team--away{text-align:left}
.game-card__team-short{color:var(--ink-muted);font-weight:700;font-size:.8rem}
.game-card__score{font-family:var(--font-display);font-weight:700;white-space:nowrap;text-align:center}
.game-card__chevron{
  grid-column:3;grid-row:1;
  width:.55rem;height:.55rem;border-right:2px solid var(--ink-muted);border-bottom:2px solid var(--ink-muted);
  transform:rotate(45deg);transition:transform .15s;flex-shrink:0;
}
.game-card[open] .game-card__chevron{transform:rotate(-135deg)}
@media(max-width:640px){
  .game-card__head{grid-template-columns:1fr auto;row-gap:.5rem}
  .game-card__meta{grid-column:1;grid-row:1}
  .game-card__chevron{grid-column:2;grid-row:1;justify-self:end}
  .game-card__matchup{grid-column:1 / -1;grid-row:2}
}
.game-card__body{padding:0 1.5rem 1.25rem;border-top:1px solid var(--line)}
.game-card__groups{display:flex;flex-wrap:wrap;gap:1.5rem 3rem;margin-top:1rem}
.game-card__group-label{
  color:var(--ink-muted);font-size:.7rem;font-weight:700;text-transform:uppercase;
  letter-spacing:.05em;margin-bottom:.4rem;
}
.game-card__players{font-size:.85rem;color:var(--ink-muted)}
.game-card__players span{display:block;margin-bottom:.3rem}
.game-card__report{display:inline-block;margin-top:1rem;font-size:.85rem;color:var(--orange);text-decoration:none}

/* ---- Spielbericht cross-table (game details) ---- */
.res{
  display:inline-block;min-width:2.6rem;padding:.2rem .45rem;border-radius:6px;
  font-weight:700;font-size:.85rem;text-align:center;line-height:1.3;font-variant-numeric:tabular-nums;
}
.res--w{background:#00775a;color:#fff}
.res--l{background:#fff;box-shadow:inset 0 0 0 1.5px #d55e00;color:#a34700}
/* section label (Einzel / Doppel) with its icon */
.xt-head{margin-top:1.4rem}
.xt-label{
  display:inline-flex;align-items:center;gap:.45rem;color:var(--navy-900);
  font-size:.9rem;font-weight:800;text-transform:uppercase;letter-spacing:.06em;
}
.xt-label svg{width:1.2rem;height:1.2rem;color:var(--orange)}
.xt{width:100%;border-collapse:separate;border-spacing:0;margin-top:.35rem;font-size:.85rem}
.xt th,.xt td{padding:.5rem .35rem;text-align:center;vertical-align:middle;border-bottom:1px solid var(--line)}
.xt thead th{font-weight:700;color:var(--navy-700);vertical-align:bottom;font-size:.8rem;line-height:1.2;padding-bottom:.45rem;white-space:nowrap}
.xt tbody th{text-align:left;font-weight:600;white-space:nowrap;padding-left:0}
.xt tbody tr:last-child th,.xt tbody tr:last-child td{border-bottom:0}
.xt__row{display:inline-flex;align-items:center;gap:.45rem}
.xt th.xt__them{font-weight:400;color:var(--ink-muted)}
.xt__none{color:var(--line);font-weight:700}
.xt__wo{color:var(--ink-muted);font-weight:600}
/* position letters/digits: secondary, so light and small */
.xt__pos{color:#9aa5b1;font-weight:600;font-size:.68rem;font-variant-numeric:tabular-nums}
.xt thead .xt__pos{display:block;margin-bottom:.1rem}
/* team codes on the axes, same quiet style as the position labels */
.xt thead .xt__team{
  color:#9aa5b1;font-size:.68rem;font-weight:700;letter-spacing:.04em;
  padding:0 0 .2rem;
}
.xt thead .xt__corner{border-bottom:0}
.xt thead .xt__team--rows{text-align:left;vertical-align:bottom;border-bottom:1px solid var(--line);padding-bottom:.45rem}
/* game number hangs left of its chip: the chip stays centred in the
   column and the number never sits on top of the score */
.xt__m{position:relative;display:inline-block}
.xt-doubles__row .xt__m{justify-self:center}
.xt__nr{
  position:absolute;right:100%;top:50%;transform:translateY(-50%);margin-right:.3rem;
  color:#9aa5b1;font-size:.68rem;font-weight:600;font-variant-numeric:tabular-nums;line-height:1;
}
.xt-doubles{font-size:.85rem}
.xt-doubles .xt-head{margin-bottom:.35rem}
.xt-doubles__row{
  display:grid;grid-template-columns:1fr 3rem 1fr;gap:.6rem;align-items:center;
  padding:.5rem 0;border-top:1px solid var(--line);
}
/* room for the game number hanging left of the chip */
.xt-doubles__us{text-align:right;font-weight:600;padding-right:1.1rem}
.xt-doubles__them{text-align:left;color:var(--ink-muted)}
/* team codes above the pairs, same quiet style as in the singles table */
.xt-doubles__teams{
  display:grid;grid-template-columns:1fr 3rem 1fr;gap:.6rem;padding-bottom:.2rem;
}
.xt-doubles__teams span{color:#9aa5b1;font-size:.68rem;font-weight:700;letter-spacing:.04em}
.game-card__walkover{margin:1rem 0 0;font-size:.85rem;color:var(--ink-muted)}
@media(max-width:640px){
  .game-card__body{padding:0 1rem 1rem}
  .xt{font-size:.8rem}
  .xt th,.xt td{padding:.4rem .2rem}
  .xt thead th{font-size:.72rem}
  /* opponents' surnames can be the columns now (when we sat senkrecht):
     header may hyphenate (lang="de") */
  .xt thead th{white-space:normal;hyphens:auto}
  .xt tbody th{white-space:normal;line-height:1.2}
  /* no room beside the chip on a phone: the number sits just above the
     chip's top-left corner, clear of both the chip and the row line
     (the extra top padding makes room for it inside the cell) */
  .xt__nr{right:auto;left:-.1rem;bottom:calc(100% + 2px);top:auto;transform:none;margin:0;font-size:.62rem}
  .xt tbody td,.xt tbody th{padding-top:.95rem}
  .xt-doubles__row{padding-top:.95rem}
  .xt-doubles__us{padding-right:0}
}

/* ---- cup ---- */
.cup-status{color:var(--ink-muted);font-size:.95rem;margin:-.5rem 0 1.25rem}
.cup-status strong{color:var(--ink)}
.game-card__round{
  display:inline-block;font-size:.7rem;font-weight:700;text-transform:uppercase;letter-spacing:.04em;
  color:var(--navy-700);background:var(--bg-soft);border:1px solid var(--line);
  border-radius:999px;padding:.15rem .55rem;white-space:nowrap;
}
/* not played yet: dashed outline, no colour bar — an orange bar read
   as a loss (too close to the loss vermillion) */
.game-card.is-upcoming{border:1.5px dashed #9aa5b1}
.game-card.is-bye .game-card__score{color:var(--ink-muted)}
.game-card__team--bye{color:var(--ink-muted);font-style:italic;font-weight:600}
.game-card.is-upcoming .game-card__score{color:var(--ink-muted);font-size:.9rem;font-weight:600}
.game-card__fixture{font-size:.85rem;color:var(--ink-muted);margin-top:1rem}
.game-card__fixture span{display:block;margin-bottom:.3rem}

/* ---- team page section spacing ---- */
.team-header{padding:2.5rem 0 0}
.team-kpis{padding:1.5rem 0 0}
.team-section{padding:2rem 0}
.team-section h2{text-align:left}
@media(max-width:768px){
  .team-header{padding:1.5rem 0 0}
  .team-kpis{padding:1rem 0 0}
  .team-section{padding:1.5rem 0}
}

/* ---- kpi grid ---- */
.kpi-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(160px,1fr));gap:1rem}
.kpi{background:var(--bg-soft);border:1px solid var(--line);border-radius:var(--radius);padding:1.1rem 1.25rem}
.kpi__label{font-size:.7rem;text-transform:uppercase;letter-spacing:.06em;color:var(--ink-muted);font-weight:600;margin-bottom:.4rem}
.kpi__value{font-size:1.6rem;font-weight:700;line-height:1.15}
.kpi__sub{font-size:.75rem;color:var(--ink-muted);margin-top:.2rem}

/* ---- season pills ---- */
.season-pills{display:flex;gap:.5rem;flex-wrap:wrap;margin-top:.5rem}
.season-pill{
  font-family:inherit;font-size:.9rem;font-weight:600;
  padding:.4rem 1rem;border-radius:999px;cursor:pointer;
  border:1px solid var(--line);background:transparent;color:var(--ink-muted);
  transition:all .15s;
}
.season-pill:hover{border-color:var(--orange);color:var(--orange)}
.season-pill.is-active{background:var(--orange);color:#fff;border-color:var(--orange)}

/* ---- season picker (fallback for >4 seasons) ---- */
.season-picker{
  font-size:.95rem;font-family:inherit;padding:.3rem .6rem;
  border:1px solid var(--line);border-radius:var(--radius);
  background:#fff;color:var(--ink);cursor:pointer;
}

/* ---- players table ---- */
.players-wrap{overflow-x:auto}
.players-table{width:100%;border-collapse:collapse;font-size:.85rem}
.players-table th,.players-table td{padding:.65rem .6rem;text-align:center;border-bottom:1px solid var(--line)}
.players-table th:first-child,.players-table td.name{text-align:left}
.players-table th{
  color:var(--ink-muted);font-weight:600;font-size:.7rem;text-transform:uppercase;
  letter-spacing:.04em;cursor:pointer;user-select:none;white-space:nowrap;
}
.players-table th:hover{color:var(--orange)}
.players-table th.sorted::after{content:" \2193";color:var(--orange)}
.players-table th.sorted-asc::after{content:" \2191";color:var(--orange)}
.players-table td.name{font-weight:600;white-space:nowrap}
.players-table td.num{font-variant-numeric:tabular-nums}
.players-table td.pct{font-variant-numeric:tabular-nums;font-weight:600}
.players-table__rate{color:var(--ink-muted)}
.players-table tr:hover td{background:var(--bg-soft)}
