/*
 * Club page. Ported from the approved mock-up (etalon-2026-09-11/club.html).
 * Shared page furniture lives in redesign.css; the card, the tiles and the
 * games row are shaped like the player's and share their classes.
 */

/* club card */
.fwd-card--club{grid-template-columns:104px minmax(0,1fr);align-items:center}
.fwd-crest{width:104px;height:104px;object-fit:contain}
.fwd-card--club .fwd-facts{margin-top:14px}
.fwd-facts dd img{border-radius:50%;width:26px;height:26px;object-fit:cover}

.fwd-tiles--3{grid-template-columns:repeat(3,minmax(0,1fr))}

/* tournaments of the season */
.fwd-cups{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));border-top:1px solid var(--hair)}
.fwd-cupc{display:grid;grid-template-columns:auto minmax(0,1fr) auto;gap:6px 16px;align-items:center;padding:16px 20px}
.fwd-cupc{border-bottom:1px solid var(--hair-2)}
.fwd-cupc:nth-child(even){border-left:1px solid var(--hair-2)}
/* an odd one out at the end leaves no hairline under the sheet's edge */
.fwd-cupc:last-child,.fwd-cupc:nth-last-child(2):nth-child(odd){border-bottom:0}
.fwd-place--cup svg{display:block;width:32px;height:32px;margin:0 auto}
.fwd-cupc:hover{background:var(--surface-2)}
.fwd-place{grid-row:1/3;font-size:34px;font-weight:800;letter-spacing:-.03em;line-height:1;
  min-width:44px;text-align:center}
.fwd-place small{display:block;font-size:11px;font-weight:700;letter-spacing:.05em;text-transform:uppercase;
  color:var(--muted);margin-top:4px}
/* medal colours darkened for a white ground */
.fwd-place--m1{color:var(--gold-ink)}
.fwd-place--m2{color:#6B7489}
.fwd-place--m3{color:#9A5F33}
.fwd-cupc b{font-size:16px;font-weight:800}
.fwd-meta{grid-column:2;font-size:13.5px;color:var(--muted)}
.fwd-cupc .fwd-go{grid-row:1/3;grid-column:3;font-size:13.5px;font-weight:700}
.fwd-cupc:hover .fwd-go{color:var(--gold-ink)}

/* squad as cards */
.fwd-squad{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));border-top:1px solid var(--hair)}
.fwd-pc{display:grid;grid-template-columns:64px minmax(0,1fr) auto;gap:14px;align-items:center;
  padding:12px 20px;border-bottom:1px solid var(--hair-2)}
.fwd-pc:nth-child(odd){border-right:1px solid var(--hair-2)}
.fwd-pc:hover{background:var(--surface-2)}
.fwd-pc img,.fwd-ph{width:64px;height:64px;border-radius:10px;object-fit:cover;background:var(--surface-2)}
.fwd-ph{display:grid;place-items:center;font-weight:800;font-size:20px;color:var(--faint)}
.fwd-nm{display:block;font-weight:700;font-size:15.5px;line-height:1.25}
.fwd-nm:hover{color:var(--gold-ink)}
.fwd-pc .fwd-sub{display:block;margin-top:2px;font-size:13px;color:var(--muted)}
.fwd-no{font-size:22px;font-weight:800;color:var(--ink-2);letter-spacing:-.02em;min-width:36px;text-align:right}
.fwd-no--none{font-size:14px;color:var(--faint);font-weight:600}
.fwd-coach{display:grid;grid-template-columns:64px minmax(0,1fr);gap:14px;align-items:center;
  padding:14px 20px;background:var(--surface-2);border-top:1px solid var(--hair)}
.fwd-coach img{width:64px;height:64px;border-radius:10px;object-fit:cover}
.fwd-coach b{display:block;font-size:15.5px}
.fwd-coach b a:hover{color:var(--gold-ink)}
.fwd-coach span span{font-size:13px;color:var(--muted)}

/* games of the season */
/* the club's row carries a result chip where the player's carries goals; the
   list has no cup headings, so rows are separated from the top */
.fwd-mt{border-top:1px solid var(--hair-2);border-bottom:0}
/* desktop only: on a phone the row keeps the stacked grid of redesign.css */
@media (min-width:761px){.fwd-mt{grid-template-columns:92px minmax(0,1fr) auto minmax(0,1fr) 34px 100px}}
/* a game ahead: the time with a clock in a cool dashed frame, as on the
   front page and in the competition calendar */
.fwd-sc--soon{display:inline-flex;align-items:center;justify-content:center;gap:5px;font-size:14px;
  font-weight:700;color:#4A5D86;border:1px dashed #AFC0DE;border-radius:8px;background:#EEF2FA;padding:4px 10px;min-width:0;
  --fwd-clock:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='none' stroke='%23000' stroke-width='1.6'%3E%3Ccircle cx='8' cy='8' r='6.2'/%3E%3Cpath d='M8 4.6V8l2.2 1.4' stroke-linecap='round'/%3E%3C/svg%3E");
}
.fwd-sc--soon::before{content:"";width:14px;height:14px;flex:0 0 auto;background:currentColor;
  -webkit-mask:var(--fwd-clock) center/contain no-repeat;mask:var(--fwd-clock) center/contain no-repeat}
/* the result gets the same quiet chip as the form column of a table */
.fwd-outcome{width:24px;height:24px;border-radius:5px;display:grid;place-items:center;font-size:12px;font-weight:700}
.fwd-outcome--w{background:var(--win-bg);color:var(--win)}
.fwd-outcome--d{background:var(--draw-bg);color:var(--draw)}
.fwd-outcome--l{background:var(--loss-bg);color:var(--loss)}

@media (max-width:820px){
  .fwd-cups,.fwd-squad{grid-template-columns:1fr}
  .fwd-cupc:nth-child(even){border-left:0}
  .fwd-cupc:nth-last-child(2):nth-child(odd){border-bottom:1px solid var(--hair-2)}
  .fwd-pc:nth-child(odd){border-right:0}
}
@media (max-width:760px){
  .fwd-tiles--3{grid-template-columns:1fr}
  .fwd-tiles--3 .fwd-tile + .fwd-tile{border-left:0;border-top:1px solid var(--hair-2)}
  .fwd-outcome{grid-column:1/4;justify-self:start}
  .fwd-go{grid-column:1/4;justify-self:start;text-align:left;justify-content:flex-start}
}
@media (max-width:620px){
  .fwd-card--club{grid-template-columns:72px minmax(0,1fr);padding:16px;gap:var(--s2)}
  .fwd-crest{width:72px;height:72px}
}

/* cups as group headings and the older seasons behind a button, as on a
   player's page */
.fwd-dayh{display:flex;align-items:baseline;gap:10px;padding:12px 20px;background:var(--surface-2);
  border-top:1px solid var(--hair);border-bottom:1px solid var(--hair-2)}
.fwd-dayh b{font-size:14.5px;font-weight:800}
.fwd-dayh span{font-size:13px;color:var(--faint)}
.fwd-dayh + .fwd-mt{border-top:0}
.fwd-won{font-weight:800;color:var(--gold-ink)}
.fwd-more{display:block;width:100%;font:inherit;cursor:pointer;background:none;border:0;
  border-top:1px solid var(--hair);padding:14px 20px;font-weight:600;color:var(--navy-2)}
/* Rookie paints every focused or pressed button teal */
.fwd-more:focus,.fwd-more:active{background:none}
.fwd-more:hover{background:var(--surface-2);color:var(--gold-ink)}
.fwd-past[hidden]{display:none}
