/* Styles propres aux pages « pool » (refonte 2026-09). Tout dans @layer pages ; composants partagés : assets/css/site.css.
   Pages : classement (.standings-*), équipes (.team-*), échanges (.trades-*). */
@layer pages {
  .pool-empty-icon { display: flex; justify-content: center; margin-bottom: 8px; color: var(--muted); }

  /* ---------- Classement ---------- */
  .standings-layout {
    display: grid; gap: 16px; grid-template-columns: minmax(0, 1fr);
    grid-template-areas: "hero" "board" "side";
  }
  .standings-hero { grid-area: hero; }
  .standings-board { grid-area: board; min-width: 0; }
  .standings-side { grid-area: side; align-content: start; }
  .standings-hero-of { font-size: 22px; opacity: .8; }
  .standings-hero .hero-side { text-align: right; }
  .standings-hero-total { font-size: 40px; }
  @media (min-width: 64rem) {
    .standings-layout {
      grid-template-columns: minmax(0, 2fr) minmax(0, 1fr);
      grid-template-areas: "board hero" "board side";
      grid-template-rows: auto 1fr;
      align-items: start; gap: 16px 24px;
    }
    .standings-side { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
    .standings-side .stat-tile { padding: 12px; }
  }
  .standings-side .stat-value { font-size: 22px; }
  a.stat-hint { color: var(--blue); font-weight: 600; }
  .list-row[aria-current="true"] { box-shadow: inset 3px 0 0 var(--blue); }
  .standings-delta {
    display: inline-flex; align-items: center; gap: 1px; margin-top: 2px;
    font-size: 11px; font-weight: 700; line-height: 1; color: var(--muted);
  }
  .standings-delta.up { color: var(--up); }
  .standings-delta.down { color: var(--down); }
  .standings-delta.same { font-size: 12px; }
  table.data .standings-delta { margin: 0 0 0 6px; vertical-align: 2px; }
  .standings-rank { font-family: var(--font-cond); font-weight: 800; font-size: 22px; line-height: 1; color: var(--muted); }
  .standings-rank.gold { color: var(--gold); }
  a.standings-name { color: var(--text); font-weight: 700; }
  .standings-month.best { border-color: var(--gold); }
  .standings-month.worst { border-color: var(--red); }

  /* ---------- Mon équipe ---------- */
  .team-capbar { margin: 6px 0 4px; }
  .stat-tile .cap-line { flex-direction: column; gap: 0; }
  @media (min-width: 64rem) { .stat-tile .cap-line { flex-direction: row; } }
  .team-nhl { display: flex; flex-wrap: wrap; gap: 4px 12px; padding: 4px 0 2px; }
  .team-nhl-item { display: inline-flex; align-items: center; gap: 6px; font-family: var(--font-cond); font-size: 20px; line-height: 1.1; }
  .team-nhl-item .muted { font-family: var(--font); font-size: 13px; }
  .team-trophies { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; }
  @media (min-width: 64rem) { .team-trophies { grid-template-columns: repeat(4, minmax(0, 1fr)); } }
  .team-trophy { display: flex; gap: 10px; align-items: flex-start; min-width: 0; }
  .team-trophy-icon {
    flex-shrink: 0; width: 34px; height: 34px; border-radius: 50%;
    display: inline-flex; align-items: center; justify-content: center;
    background: color-mix(in srgb, var(--gold) 16%, transparent); color: var(--gold);
  }
  .team-trophy-pick { font-weight: 700; overflow-wrap: anywhere; }
  .team-trophy .good, .team-trophy .bad { display: inline-flex; align-items: center; gap: 3px; }
  .team-row .pos { min-width: 26px; }
  .team-pts { color: var(--blue); }
  /* Grille de formation (bureau) */
  .team-lineup { display: grid; grid-template-columns: 3fr 2fr; gap: 16px; }
  .team-lineup-grid { display: grid; gap: 8px; }
  .team-lineup-f { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .team-lineup-d, .team-lineup-g { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .team-slot { min-width: 0; padding: 8px 10px; border-radius: var(--r-sm); border: 1px solid var(--border); background: var(--surface-2); }
  .team-slot.empty { display: flex; align-items: center; justify-content: center; min-height: 68px; border-style: dashed; background: none; }
  .team-slot-name { font-weight: 700; font-size: .85rem; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
  .team-slot-pts { font-family: var(--font-cond); font-weight: 800; font-size: 18px; line-height: 1.1; color: var(--blue); }

  /* ---------- Échanges ---------- */
  .trades-calendar { grid-column: 1 / -1; }
  .trades-periods { list-style: none; display: flex; flex-wrap: wrap; gap: 6px; margin-top: 6px; }
  .trades-periods li {
    padding: 4px 10px; border-radius: var(--r-pill); background: var(--surface-2);
    font-size: 12.5px; font-weight: 600; color: var(--muted); white-space: nowrap;
  }
  .trades-periods li.on { background: color-mix(in srgb, var(--up) 16%, transparent); color: var(--up); font-weight: 700; }
  @media (min-width: 64rem) {
    .trades-stats { grid-template-columns: 1fr 1fr 2fr; }
    .trades-calendar { grid-column: auto; }
  }
  .trades-icon {
    width: 36px; height: 36px; border-radius: 50%;
    display: inline-flex; align-items: center; justify-content: center;
    background: var(--surface-2); color: var(--muted);
  }
  .trades-offer { flex-wrap: wrap; }
  .trades-offer .list-main { flex-basis: calc(100% - 48px); }
  .trades-offer .list-action { width: 100%; justify-content: flex-end; }
  @media (min-width: 48rem) {
    .trades-offer { flex-wrap: nowrap; }
    .trades-offer .list-main { flex-basis: auto; }
    .trades-offer .list-action { width: auto; }
  }
  .trades-offer-form { display: grid; grid-template-columns: minmax(0, 1fr); gap: 12px; }
  @media (min-width: 64rem) {
    .trades-offer-form { grid-template-columns: repeat(3, minmax(0, 1fr)) auto; align-items: end; }
    .trades-offer-form .btn { min-height: 48px; }
  }
  .trades-room { display: grid; grid-template-columns: minmax(0, 1fr); gap: 16px; }
  .trades-roster .pos { min-width: 26px; }
  #trade-drop-info:empty { display: none; }
  @media (min-width: 64rem) {
    .trades-room { grid-template-columns: minmax(0, 3fr) minmax(0, 2fr); gap: 24px; align-items: start; }
    .trades-add { position: sticky; top: calc(var(--header-h) + 64px); }
  }
}