/* Shared base styles for every NAC Pickleball page.
   Loaded before each page's inline <style>, so page-specific rules
   still override anything here. Keep page-only styles inline. */

/* ===== Reset ===== */
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}

/* ===== Design tokens ===== */
:root{
  --navy:#1a2a6c;--navy-dark:#111d4e;
  --green:#4caf28;--green-dark:#3a8c1e;
  --blue:#4db8e8;--blue-dark:#2a9fd4;
  --gold:#d4a017;
  --white:#ffffff;--off-white:#f4f7fb;
  --surface:#f0f4f9;--surface2:#e3eaf4;
  --text:#1a2a6c;--muted:#5a6a9a;--border:rgba(26,42,108,0.12);
  --danger:#d93b3b;
  --font-display:'Barlow Condensed',sans-serif;
  --font-body:'Barlow',sans-serif;
  --radius:8px;--radius-lg:12px;
}

/* ===== Base ===== */
body{background:var(--off-white);color:var(--text);font-family:var(--font-body);font-size:15px;line-height:1.6;min-height:100vh;-webkit-text-size-adjust:100%}

/* ===== Navigation bar ===== */
nav{background:var(--navy);padding:0 max(1.5rem,env(safe-area-inset-right)) 0 max(1.5rem,env(safe-area-inset-left));display:flex;align-items:center;flex-wrap:wrap;position:sticky;top:0;z-index:100;border-bottom:3px solid var(--green)}
.nav-brand{display:flex;align-items:center;gap:12px;padding:.65rem 0;margin-right:1.2rem;text-decoration:none}
.nav-logo{height:44px;width:auto}
.nav-actions{display:flex;align-items:center;flex-wrap:wrap}
.nav-right{display:flex;align-items:center;flex-wrap:wrap;margin-left:auto}
.nav-link{padding:1rem .95rem;font-family:var(--font-display);font-size:14px;font-weight:700;letter-spacing:.5px;text-transform:uppercase;color:rgba(255,255,255,.6);text-decoration:none;border-bottom:3px solid transparent;transition:all .15s;white-space:nowrap;cursor:pointer}
.nav-link:hover{color:#fff}
.nav-link.current{color:var(--green);border-bottom-color:var(--green)}
.nav-btn{font-family:var(--font-display);font-size:13px;font-weight:700;text-transform:uppercase;letter-spacing:.5px;padding:7px 14px;border-radius:var(--radius);cursor:pointer;text-decoration:none;transition:all .12s;border:1.5px solid transparent;white-space:nowrap}
.nav-btn-ghost{color:#fff;border-color:rgba(255,255,255,.4)}
.nav-btn-ghost:hover{border-color:#fff;background:rgba(255,255,255,.1)}
.nav-btn-ghost.current{border-color:var(--green);color:#fff}
.nav-btn-solid{background:var(--green);color:#fff;border-color:var(--green)}
.nav-btn-solid:hover{background:var(--green-dark);border-color:var(--green-dark)}
.nav-greeting{color:rgba(255,255,255,.85);font-size:14px;font-weight:600;margin-right:1rem}

/* ===== Spinner / toast ===== */
@keyframes spin{to{transform:rotate(360deg)}}
.toast{position:fixed;bottom:1.5rem;right:1.5rem;background:var(--navy);color:var(--white);padding:10px 20px;border-radius:var(--radius);font-family:var(--font-display);font-weight:700;font-size:14px;text-transform:uppercase;letter-spacing:.5px;transform:translateY(80px);opacity:0;transition:all .25s;z-index:9999;pointer-events:none;border-left:4px solid var(--green)}
.toast.show{transform:translateY(0);opacity:1}