/* Public event pages and the Records page: results tables built on the shared design system in site.css. */

.sub-nav { display: flex; flex-wrap: wrap; gap: .6rem 1.6rem; margin-bottom: 3rem; padding-bottom: 1rem; border-bottom: 1px solid var(--line); }
.sub-nav a { font: 700 .85rem/1 var(--display); letter-spacing: .22em; text-transform: uppercase; color: var(--mute); }
.sub-nav a:hover { color: var(--paper); }

.facts { display: grid; grid-template-columns: repeat(auto-fit, minmax(14rem, 1fr)); gap: 1.5rem 2rem; margin-bottom: 2.5rem; }
.facts dt { font: 700 .75rem/1 var(--display); letter-spacing: .26em; text-transform: uppercase; color: var(--accent-text); margin-bottom: .5rem; }
.facts dd { margin: 0; font: 700 1.25rem/1.25 var(--display); text-transform: uppercase; }
.facts dd small { display: block; margin-top: .25rem; font: 400 .95rem/1.4 var(--body); text-transform: none; color: var(--mute); }

.res-group { margin-top: 3rem; }
.res-group:first-child { margin-top: 0; }
.res-group h3 { margin-bottom: 1rem; font: 800 clamp(1.4rem, 3vw, 1.9rem)/1.05 var(--display); text-transform: uppercase; }
.res-group h3 small { margin-left: .6rem; font: 700 .8rem/1 var(--display); letter-spacing: .22em; color: var(--mute); }
.res-note { margin-bottom: 2rem; color: var(--mute); max-width: 40rem; }

.tbl { width: 100%; border-collapse: collapse; border-top: 1px solid var(--line); }
.tbl th { padding: .7rem .8rem; text-align: left; font: 700 .72rem/1 var(--display); letter-spacing: .24em; text-transform: uppercase; color: var(--mute); border-bottom: 1px solid var(--line); }
.tbl td { padding: .8rem; border-bottom: 1px solid var(--line); vertical-align: baseline; }
.tbl .num { text-align: right; font: 700 1.05rem/1.2 var(--display); letter-spacing: .02em; white-space: nowrap; }
.tbl .pos { width: 3.2rem; font: 800 1.3rem/1 var(--display); color: var(--mute); }
.tbl .who b { font: 700 1.1rem/1.2 var(--display); text-transform: uppercase; letter-spacing: .02em; }
.tbl .who small { margin-left: .6rem; color: var(--mute); }
.tbl .meta { color: var(--mute); font-size: .92rem; }
.tbl .meta a:hover { color: var(--paper); text-decoration: underline; }

/* The top three on a list stand out; everyone else is quieter. */
.tbl tr.top td { background: var(--ink-2); }
.tbl tr.top .pos { color: var(--accent-text); }
.tbl tr.top .who b, .tbl tr.top .num { color: var(--paper); }
.tbl tr.top-1 td:first-child { box-shadow: inset 4px 0 0 var(--accent); }
.tbl tr.top-2 td:first-child { box-shadow: inset 4px 0 0 #aab4c0; }
.tbl tr.top-3 td:first-child { box-shadow: inset 4px 0 0 #a8683c; }
.tbl tr.dim .who b, .tbl tr.dim .num { color: #b5bfcb; font-weight: 600; }
.tbl tr.dim td { padding-block: .6rem; }
.tbl tr.dim .pos { font-size: 1.05rem; }

.more { margin-top: 1rem; }
.more > summary { cursor: pointer; display: inline-block; font: 700 .85rem/1 var(--display); letter-spacing: .22em; text-transform: uppercase; color: var(--accent-text); }
.more > summary:hover { color: var(--paper); }
.more[open] > summary { margin-bottom: 1rem; }

.history { margin-top: 1.4rem; }
.history .tbl td { padding-block: .55rem; }
.badge-now { margin-left: .6rem; padding: .25rem .5rem; font: 700 .68rem/1 var(--display); letter-spacing: .2em; text-transform: uppercase; color: #fff; background: var(--accent); }

.track-block { margin-top: 4.5rem; }
.track-block:first-of-type { margin-top: 0; }
.track-head { margin-bottom: 2rem; padding-bottom: 1rem; border-bottom: 1px solid var(--line); }
.track-head h2 { font: 800 clamp(1.9rem, 4.5vw, 3rem)/1 var(--display); text-transform: uppercase; }
.track-head p { margin-top: .5rem; color: var(--mute); }

.award-list { display: grid; grid-template-columns: repeat(auto-fit, minmax(18rem, 1fr)); gap: 1.2rem; }
.award { padding: 1.6rem; background: var(--ink-2); border: 1px solid var(--line); }
.award small { display: block; margin-bottom: .6rem; font: 700 .75rem/1 var(--display); letter-spacing: .24em; text-transform: uppercase; color: var(--accent-text); }
.award h3 { font: 800 1.7rem/1.05 var(--display); text-transform: uppercase; }
.award p { margin-top: .6rem; color: var(--mute); }
.award .sub { margin-top: 1rem; font: 700 .8rem/1 var(--display); letter-spacing: .2em; text-transform: uppercase; color: var(--mute); }

.sched td:first-child { width: 11rem; color: var(--mute); white-space: nowrap; }

@media (max-width: 40rem) {
  .tbl .hide-sm { display: none; }
  .tbl td, .tbl th { padding-inline: .5rem; }
}

/* Records summary: one row per track. */
.rec-filter { display: flex; flex-wrap: wrap; align-items: flex-end; gap: 1rem 1.2rem; margin-bottom: 2rem; }
.rec-filter label { display: block; margin-bottom: .4rem; font: 700 .72rem/1 var(--display); letter-spacing: .24em; text-transform: uppercase; color: var(--mute); }
.rec-filter input, .rec-filter select { min-width: 12rem; padding: .75rem .9rem; color: var(--paper); font: 500 1rem/1.2 var(--body); background: var(--ink-2); border: 1px solid var(--line); border-radius: 0; }
.rec-filter input:focus, .rec-filter select:focus { outline: 2px solid var(--accent-text); outline-offset: 1px; }
.rec-filter .clear { padding-bottom: .8rem; color: var(--mute); font: 700 .8rem/1 var(--display); letter-spacing: .2em; text-transform: uppercase; }
.rec-filter .clear:hover { color: var(--paper); }
.rec-count { margin-bottom: 1rem; color: var(--mute); }

.rec-sum td { padding-block: 1.1rem; }
.rec-sum .trk a { font: 800 1.35rem/1.1 var(--display); text-transform: uppercase; }
.rec-sum .trk a:hover { color: var(--accent-text); }
.rec-sum .trk small { display: block; margin-top: .3rem; color: var(--mute); font: 400 .92rem/1.3 var(--body); text-transform: none; }
.rec-sum .rec a { display: block; }
.rec-sum .rec .time { font: 800 1.5rem/1 var(--display); letter-spacing: .01em; }
.rec-sum .rec a:hover .time { color: var(--accent-text); }
.rec-sum .rec .holder { display: block; margin-top: .3rem; font: 700 .95rem/1.2 var(--display); text-transform: uppercase; letter-spacing: .03em; }
.rec-sum .rec .when { display: block; margin-top: .15rem; color: var(--mute); font-size: .85rem; }
.rec-sum .none { color: #4d5967; }
.rec-sum th.cls { width: 28%; }

.crumb { display: inline-flex; margin-bottom: 2rem; font: 700 .85rem/1 var(--display); letter-spacing: .22em; text-transform: uppercase; color: var(--accent-text); }
.crumb:hover { color: var(--paper); }

.pager-lite { display: flex; align-items: center; justify-content: space-between; gap: 1rem; margin-top: 2rem; color: var(--mute); }
.pager-lite a { font: 700 .85rem/1 var(--display); letter-spacing: .22em; text-transform: uppercase; color: var(--paper); }
.pager-lite a:hover { color: var(--accent-text); }

@media (max-width: 40rem) {
  .rec-filter input, .rec-filter select { min-width: 0; width: 100%; }
  .rec-filter > div { flex: 1 1 100%; }
  .rec-sum .rec .time { font-size: 1.2rem; }
  .rec-sum .rec .when { display: none; }
}

/* Results that come from the lap timing site (laps.esra.org.au) are always marked as theirs. */
.rec-sum .rec a + a { margin-top: .9rem; }
.rec-sum .rec .from-laps { padding-left: .7rem; border-left: 2px solid #3a4452; }
.rec-sum .rec .from-laps .time { font-size: 1.25rem; }
.rec-sum .rec .src { display: block; margin-top: .2rem; color: var(--mute); font: 700 .7rem/1.2 var(--display); letter-spacing: .18em; text-transform: uppercase; }
.laps-credit { margin: 1rem 0 1.6rem; max-width: 46rem; color: var(--mute); font-size: .95rem; }
.laps-credit a { color: var(--paper); text-decoration: underline; }
.laps-credit a:hover { color: var(--accent-text); }
.rec-sum + .laps-credit { margin-top: 1.5rem; }
.laps-board h4 { margin: 2rem 0 .8rem; font: 800 1.25rem/1.1 var(--display); text-transform: uppercase; }
.laps-board h4 small { margin-left: .6rem; font: 700 .75rem/1 var(--display); letter-spacing: .22em; color: var(--mute); }
.laps-board .more:last-child { margin-bottom: 0; }