/* The "good day" look for customer pages (sign-in, booking, my bookings,
   pay, café ordering, game pages, safety form). Loaded after app.css only
   when the new look is on — staff and admin pages never load it. */
:root,
:root:not([data-theme="light"]),
:root[data-theme="dark"]{
  --bg:#FBF6EC; --bg-2:#F3ECDD; --surface:#FFFFFF;
  --text:#141414; --text-dim:#5B564E;
  --line:rgba(20,20,20,.12); --line-hard:rgba(20,20,20,.28);
  --shadow:rgba(20,20,20,.10);
  --band-bg:#141414; --band-surface:#222; --band-text:#FBF6EC; --band-dim:#CFC8BB; --band-line:rgba(251,246,236,.18);
  --flare:#E5231B; --flare-ink:#FFFFFF;
  --volt:#FCEFB4; --volt-ink:#141414;
  --sky:#2E5BE8;
  --ok:#1E8E4E; --ok-bg:rgba(30,142,78,.10);
  --warn:#A66A00; --warn-bg:rgba(230,160,20,.14);
  --bad:#C4221A; --bad-bg:rgba(229,35,27,.09);
  --dot:rgba(20,20,20,.25);
  --radius:10px;
  --d:'Anton','Big Shoulders Display','Arial Narrow',Impact,sans-serif;
  --b:'Archivo','Helvetica Neue',Arial,sans-serif;
}
@media (prefers-color-scheme:dark){
  :root:not([data-theme="light"]){
    --bg:#FBF6EC; --bg-2:#F3ECDD; --surface:#FFFFFF; --text:#141414; --text-dim:#5B564E;
    --line:rgba(20,20,20,.12); --line-hard:rgba(20,20,20,.28); --shadow:rgba(20,20,20,.10);
    --flare:#E5231B; --flare-ink:#FFFFFF; --volt:#FCEFB4; --volt-ink:#141414;
    --ok:#1E8E4E; --ok-bg:rgba(30,142,78,.10); --warn:#A66A00; --warn-bg:rgba(230,160,20,.14);
    --bad:#C4221A; --bad-bg:rgba(229,35,27,.09); --dot:rgba(20,20,20,.25);
    --band-bg:#141414; --band-text:#FBF6EC; --band-dim:#CFC8BB;
  }
}
body.club{color-scheme:light}
.club .preview-bar{background:#141414;color:#fff;font:600 13px var(--b);text-align:center;padding:8px 14px}

/* headings: tall condensed, not shouty caps */
.club h1,.club h2{font-family:var(--d);font-weight:400;text-transform:none;letter-spacing:-.005em;line-height:1}
.club h1{font-size:clamp(38px,5.4vw,58px)}
.club h2{font-size:clamp(30px,4vw,44px)}
.club h3,.club h4{font-family:var(--b);font-weight:800;text-transform:none;letter-spacing:0}
.club h3{font-size:clamp(19px,2.2vw,23px)}
.club h4{font-size:17px}
.club .eyebrow,.club .field label,.club table.tbl th{font-family:var(--b);font-weight:700;letter-spacing:.14em}

/* header */
.club .hdr{background:rgba(251,246,236,.94);border-bottom:1px solid var(--line)}
.club .mark-img{display:flex;align-items:center;gap:8px}
.club .mark-img img{display:block;width:auto}
.club .nav a{font-family:var(--b);font-weight:600;font-size:14.5px;letter-spacing:0;text-transform:none;color:var(--text)}
.club .nav a.on{border-bottom-color:var(--flare)}

/* buttons: solid, rounded, calm */
.club .btn{font-family:var(--b);font-weight:700;font-size:15px;letter-spacing:0;text-transform:none;border-radius:8px;border-width:2px;padding:11px 20px}
.club .btn-sm{font-size:13.5px;padding:8px 14px}
.club .btn:hover{transform:translateY(-1px);box-shadow:0 6px 16px rgba(20,20,20,.12)}
.club .btn-ghost{border-color:var(--line-hard);color:var(--text)}
.club .btn-volt{border-color:var(--volt)}

/* cards: soft, no hard offset shadow */
.club .card{border:1px solid var(--line);border-radius:12px;box-shadow:0 4px 18px rgba(20,20,20,.06)}
.club .panel{border-color:var(--line);border-radius:12px}
.club .input,.club select.input,.club textarea.input{background:#fff;border-radius:8px;border-width:1.5px}
.club .pill{font-family:var(--b);font-weight:700;letter-spacing:.04em}
.club .mono{font-family:var(--b);font-variant-numeric:tabular-nums}

/* booking slots + choices */
.club .slot{border-radius:8px;font-family:var(--b);font-weight:600;background:#fff}
.club .slot:has(input:checked){background:var(--flare);border-color:var(--flare)}

/* footer */
.club .foot{border-top:1px solid var(--line);background:transparent}

@media (max-width:560px){
  .club .hdr-in{padding:10px 14px}
  .club .mark-img img:first-child{height:30px} .club .mark-img img:last-child{height:20px}
  .club .nav{gap:14px}
  .club .nav a.nav-home{display:none}
  .club .nav a.btn{padding:8px 12px;font-size:13px;white-space:nowrap}
}
