/*
 * Page not found and search results. No mock-up exists for either; both are
 * put together from the furniture of the other pages — the sheet, the heading,
 * the header's search, the rows of the club page.
 */

.fwd-page--narrow{max-width:760px}

/* the opening sheet: a heading, a line of text, the search box.
   A sheet clips its content, and the search results hang below this one:
   without the overflow they were cut off, and clicks past the first club
   landed on the sheet underneath. */
.fwd-lead{padding:36px 32px 28px;overflow:visible;position:relative;z-index:2}
.fwd-lead__code{font-size:12px;font-weight:800;letter-spacing:.08em;text-transform:uppercase;color:var(--gold-ink)}
.fwd-lead h1{margin:6px 0 10px;font-size:36px;font-weight:800;letter-spacing:-.03em;line-height:1.1;overflow-wrap:anywhere}
.fwd-lead p{margin:0;color:var(--ink-2);max-width:56ch}

/* the header's search, on a white ground */
.fwd-find--page{margin:24px 0 0;width:auto;max-width:520px}
.fwd-find--page input{font-size:16px;padding:12px 14px 12px 42px;color:var(--ink);
  background:var(--surface-2);border:1px solid var(--hair);border-radius:10px}
.fwd-find--page input::placeholder{color:var(--faint)}
.fwd-find--page input:focus{color:var(--ink);background:#fff;border-color:var(--gold);box-shadow:0 0 0 3px rgba(245,166,35,.22)}
.fwd-find--page .fwd-find__ic{left:14px;width:17px;height:17px;margin-top:-8.5px;color:var(--faint)}

.fwd-lead__links{display:flex;flex-wrap:wrap;gap:8px 24px;margin-top:22px}
.fwd-lead__links a{display:inline-flex;align-items:center;gap:5px;font-size:14px;font-weight:700;color:var(--navy-2)}
.fwd-lead__links a:hover{color:var(--gold-ink)}

/* leagues of the current cup, one row per age */
.fwd-agelinks{display:grid;grid-template-columns:88px minmax(0,1fr);gap:var(--s2);align-items:start;
  padding:14px 20px;border-top:1px solid var(--hair-2)}
.fwd-agelinks > b{font-size:15px;font-weight:800;padding-top:6px}
.fwd-agelinks__lgs{display:flex;flex-wrap:wrap;gap:8px}
.fwd-agelinks__lgs a{display:inline-flex;align-items:baseline;gap:6px;padding:6px 12px;border-radius:8px;
  background:var(--surface-2);font-size:14px;font-weight:600;color:var(--ink)}
.fwd-agelinks__lgs a:hover{background:var(--gold-soft);color:var(--gold-ink)}
.fwd-agelinks__lgs span{font-size:12px;font-weight:500;color:var(--faint)}

/* results: teams as a grid of crests */
.fwd-sclubs{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));border-top:1px solid var(--hair)}
.fwd-sclubs a{display:flex;align-items:center;gap:12px;padding:10px 20px;border-bottom:1px solid var(--hair-2);
  font-size:15px;font-weight:600;min-width:0}
.fwd-sclubs a:nth-child(odd){border-right:1px solid var(--hair-2)}
.fwd-sclubs a:hover{background:var(--surface-2)}
.fwd-sclubs img,.fwd-sclubs__none{width:32px;height:32px;object-fit:contain;flex:0 0 auto}

/* results: players */
.fwd-splayers{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));border-top:1px solid var(--hair)}
.fwd-sp{display:grid;grid-template-columns:44px minmax(0,1fr);gap:12px;align-items:center;
  padding:10px 20px;border-bottom:1px solid var(--hair-2)}
.fwd-sp:nth-child(odd){border-right:1px solid var(--hair-2)}
.fwd-sp:hover{background:var(--surface-2)}
.fwd-sp__ph{width:44px;height:44px;border-radius:8px;object-fit:cover;background:var(--surface-2);
  display:grid;place-items:center;font-weight:800;font-size:15px;color:var(--faint)}
.fwd-sp__tx{min-width:0}
.fwd-sp__tx b{display:block;font-size:15px;font-weight:600;line-height:1.25}
/* inline, not flex: a flex line put the crest on a row of its own as soon as
   a long club name wrapped */
.fwd-sp .fwd-sub{display:block;font-size:13px}
.fwd-sp .fwd-sub img{display:inline-block;width:16px;height:16px;object-fit:contain;vertical-align:-3px;margin-right:3px}

/* results: tournaments */
.fwd-scomp{display:flex;align-items:center;gap:var(--s2);padding:12px 20px;border-top:1px solid var(--hair-2)}
.fwd-scomp:hover{background:var(--surface-2)}
.fwd-scomp > span:first-child{min-width:0}
.fwd-scomp b{font-size:15px;font-weight:700}
.fwd-scomp__st{margin-left:6px;font-size:12.5px;color:var(--faint)}
.fwd-scomp .fwd-sub{display:block}
.fwd-scomp .fwd-go{margin-left:auto;flex:0 0 auto}

@media (max-width:620px){
  .fwd-lead{padding:24px 16px 20px}
  .fwd-lead h1{font-size:28px}
  .fwd-agelinks{grid-template-columns:1fr;gap:8px;padding:12px 16px}
  .fwd-agelinks > b{padding-top:0}
  .fwd-sclubs,.fwd-splayers{grid-template-columns:1fr}
  .fwd-sclubs a:nth-child(odd),.fwd-sp:nth-child(odd){border-right:0}
  .fwd-sclubs a,.fwd-sp,.fwd-scomp{padding:10px 16px}
}
