/* Golf Pool — 2026 US Open. Builds on css/styles.css (vars, .btn, .card, .container). */
:root { --golf: #1a4d2e; --golf-soft: #2e7d4f; --golf-tint: #eaf5ee; }

/* "Last update at HH:MM" freshness tracker (top of the page) */
.gp-updated { width: fit-content; max-width: 100%; margin: 0 auto 14px; padding: 6px 14px;
  font-size: .82rem; font-weight: 700; color: var(--golf); background: var(--golf-tint);
  border: 1px solid #d4e6d8; border-radius: 999px; text-align: center; }
.gp-updated.is-waiting { color: var(--ink-soft); font-weight: 600; background: #f3f4f2; border-color: var(--line); }

/* The "OO" in POOL, with a little dot centered in each (per request, lol) */
.gp-oo { position: relative; }
.gp-oo::after { content: ""; position: absolute; left: 50%; top: 54%; transform: translate(-50%, -50%);
  width: 0.15em; height: 0.15em; border-radius: 50%; background: currentColor; }

.golf-header { background: linear-gradient(135deg, var(--golf), var(--golf-soft)); color: #fff; }
.golf-header .back-link { color: #eafff0; }
.golf-header .site-title, .golf-header .subtitle { color: #fff; }
.golf-title { letter-spacing: .01em; }
.golf-main { display: grid; gap: 14px; padding-bottom: 40px; }

/* rules */
.gp-rules { padding: 0; }
.gp-rules > summary { cursor: pointer; font-weight: 800; padding: 14px 16px; list-style: none; }
.gp-rules > summary::-webkit-details-marker { display: none; }
.gp-rules ul { margin: 0; padding: 0 18px 16px 34px; display: grid; gap: 6px; color: var(--ink-soft); font-size: .9rem; }
.gp-rules li b { color: var(--ink); }

/* card head */
.gp-standings-card .card-head, .gp-admin-card .card-head { display: flex; align-items: baseline; justify-content: space-between; gap: 10px; padding: 14px 16px 6px; }
.gp-standings-card h2 { margin: 0; font-size: 1.05rem; }
.gp-money-toggle { font-size: .72rem; font-weight: 800; text-transform: uppercase; letter-spacing: .04em; color: var(--golf-soft); }

/* search + filter + expand controls */
.gp-controls { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; justify-content: space-between; padding: 4px 12px 8px; }
.gp-search-wrap { display: inline-flex; align-items: stretch; gap: 0; flex: 1 1 240px; min-width: 200px; max-width: 420px;
  border: 1px solid var(--line); border-radius: 999px; overflow: hidden; background: #fff; }
.gp-search-wrap #gp-filter-mode { font: inherit; border: 0; border-right: 1px solid var(--line); background: var(--golf-tint);
  padding: 0 10px; font-weight: 800; color: var(--golf); min-height: 40px; cursor: pointer; }
.gp-search-wrap #gp-search { font: inherit; border: 0; padding: 0 12px; min-height: 40px; flex: 1; min-width: 0; background: #fff; }
.gp-search-wrap #gp-search:focus { outline: none; }
.gp-expand-controls { display: inline-flex; gap: 6px; }

/* standings */
.gp-standings { padding: 6px; display: grid; gap: 6px; }
.gp-empty { color: var(--ink-soft); text-align: center; padding: 18px; }
.gp-row { border: 1px solid var(--line); border-radius: var(--radius-sm); overflow: hidden; background: #fff; }
.gp-row.is-leader { border-color: var(--gold); box-shadow: 0 0 0 1px var(--gold); }
.gp-row-head { width: 100%; display: grid; grid-template-columns: 34px 1fr auto 18px; align-items: center; gap: 10px;
  background: none; border: 0; padding: 12px 12px; cursor: pointer; font: inherit; text-align: left; min-height: 48px; }
.gp-row-head:hover { background: var(--golf-tint); }
.gp-rank { font-weight: 800; color: var(--golf); text-align: center; font-variant-numeric: tabular-nums; }
.gp-row.is-leader .gp-rank { color: var(--gold); }
.gp-team { font-weight: 800; color: var(--ink); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; display: flex; align-items: baseline; gap: 7px; }
.gp-tie-badge { font-size: .64rem; font-weight: 800; text-transform: uppercase; letter-spacing: .03em; color: #fff;
  background: var(--golf-soft); padding: 2px 7px; border-radius: 999px; white-space: nowrap; flex: 0 0 auto; }
.gp-total { font-weight: 800; font-variant-numeric: tabular-nums; color: var(--golf); white-space: nowrap; }
.gp-caret { color: var(--ink-soft); font-size: .8rem; }
.gp-row-head[aria-expanded="true"] .gp-caret { transform: rotate(180deg); }

.gp-row-body { padding: 4px 12px 10px; display: grid; gap: 4px; background: #fbfdfb; }
.gp-row-body[hidden] { display: none !important; } /* the hidden attr must beat display:grid */
.gp-golfer.is-hit { background: #fff6da; border-radius: 6px; }
.gp-golfer.is-hit .gp-g-nm { color: var(--mets-orange, #d35400); }
.gp-golfer { display: grid; grid-template-columns: 1fr auto auto; align-items: start; gap: 10px; padding: 6px 4px; border-top: 1px dashed var(--line); font-size: .9rem; }
.gp-golfer:first-child { border-top: 0; }
.gp-g-name { display: flex; flex-direction: column; gap: 1px; min-width: 0; }
.gp-g-nm { color: var(--ink); font-weight: 700; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.gp-g-rounds { font-size: .72rem; color: var(--ink-soft); font-variant-numeric: tabular-nums; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.gp-g-pos { color: var(--ink-soft); font-size: .8rem; font-variant-numeric: tabular-nums; white-space: nowrap; }
.gp-g-money { color: var(--golf-soft); font-weight: 800; font-variant-numeric: tabular-nums; white-space: nowrap; }

/* live leaderboard (verification) */
.gp-lb-card details > summary { cursor: pointer; font-weight: 800; padding: 14px 16px; list-style: none; color: var(--golf); }
.gp-lb-card details > summary::-webkit-details-marker { display: none; }
.gp-lb-head, .gp-lb-row { display: grid; grid-template-columns: 96px minmax(0, 1fr) 44px 96px; align-items: baseline; column-gap: 12px; padding: 7px 14px; }
.gp-lb-head { font-size: .68rem; font-weight: 800; text-transform: uppercase; letter-spacing: .05em; color: var(--ink-soft); border-bottom: 1px solid var(--line); }
.gp-lb-head span:last-child { text-align: right; }
.gp-leaderboard { max-height: 60vh; overflow-y: auto; }
.gp-lb-row { border-top: 1px solid #eef2ee; font-size: .9rem; }
.gp-lb-row:first-child { border-top: 0; }
.gp-lb-pos { font-weight: 800; font-size: .82rem; color: var(--golf); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.gp-lb-name { color: var(--ink); font-weight: 700; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.gp-lb-score { color: var(--ink-soft); font-variant-numeric: tabular-nums; }
.gp-lb-money { text-align: right; font-weight: 800; color: var(--golf-soft); font-variant-numeric: tabular-nums; white-space: nowrap; }

/* admin */
.gp-admin-card details > summary { cursor: pointer; font-weight: 800; padding: 14px 16px; list-style: none; }
.gp-admin-card details > summary::-webkit-details-marker { display: none; }
.gp-admin-body { padding: 0 16px 16px; display: grid; gap: 14px; }
.gp-lock { display: grid; gap: 10px; max-width: 340px; }
.gp-lock .btn { justify-self: start; }
.gp-lock-note { color: var(--ink-soft); font-size: .82rem; }
.gp-field { display: grid; gap: 4px; font-size: .8rem; font-weight: 700; color: var(--ink-soft); }
.gp-field input { font: inherit; padding: 9px 11px; border: 1px solid var(--line); border-radius: var(--radius-sm); min-height: 42px; background: #f7faf8; }
.gp-builder { display: grid; gap: 10px; padding: 12px; border: 1px solid var(--line); border-radius: var(--radius-sm); background: var(--golf-tint); }
.gp-picks { display: grid; gap: 8px; }
.gp-pick-wrap { display: grid; grid-template-columns: 34px 1fr; align-items: center; gap: 8px; }
.gp-pick-num { font-weight: 800; color: var(--golf); }
.gp-pick { font: inherit; padding: 9px 10px; border: 1px solid var(--line); border-radius: var(--radius-sm); min-height: 42px; background: #fff; width: 100%; }
.gp-elig { margin: 0; font-size: .85rem; font-weight: 800; color: var(--ink-soft); }
.gp-elig.ok { color: var(--golf-soft); }
.gp-elig.bad { color: #c0392b; }

.gp-entries h3 { margin: 0 0 8px; font-size: .95rem; }
.gp-entry { display: grid; grid-template-columns: minmax(80px, 1fr) 2fr auto auto; align-items: center; gap: 8px; padding: 8px; border: 1px solid var(--line); border-radius: var(--radius-sm); margin-bottom: 6px; font-size: .85rem; }
.gp-entry.bad { border-color: #e8b4ab; background: #fdf3f1; }
.gp-entry-name { font-weight: 800; color: var(--ink); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.gp-entry-picks { color: var(--ink-soft); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.gp-entry-sum { font-weight: 800; font-variant-numeric: tabular-nums; color: var(--golf); }
.gp-save-note { margin-left: 10px; font-size: .82rem; color: var(--ink-soft); }

@media (min-width: 620px) {
  .gp-picks { grid-template-columns: 1fr 1fr; }
}
