/* ══════════════════════════════════════════════════════════════════════
   CARDIO SOCIAL — SCHEDULE STYLES
   Shared by index.html and cardio-tennis.html. Edit here only.
   Session-type colours must match the legend swatches in both pages.
     cardio    #c6dd34  chartreuse
     doubles   #7fb2ff  blue
     challenge #ff5f56  red
   ══════════════════════════════════════════════════════════════════════ */

.sched{max-width:940px;margin:2.6rem auto 0;text-align:left}
.sched-day{border-top:1px solid rgba(255,255,255,.16);padding:1.15rem 0}
.sched-day:last-child{border-bottom:1px solid rgba(255,255,255,.16)}
.sched-dayname{font-family:"Poppins",sans-serif;font-weight:700;font-size:.78rem;
  letter-spacing:.14em;text-transform:uppercase;color:var(--ball);margin-bottom:.7rem}

.sched-row{display:grid;grid-template-columns:8.6rem 1fr auto auto;align-items:center;
  gap:1rem;padding:.72rem .9rem;border-radius:14px;text-decoration:none;color:inherit;
  transition:background .16s,transform .16s}
.sched-row:hover{background:rgba(255,255,255,.07);transform:translateX(3px)}
.sched-row:focus-visible{outline:2px solid var(--ball);outline-offset:2px}

.sched-time{font-family:"Poppins",sans-serif;font-weight:600;font-size:.95rem;color:#fff;
  font-variant-numeric:tabular-nums;white-space:nowrap}
.sched-what{display:flex;flex-direction:column;gap:.2em;min-width:0}
.sched-name{font-weight:600;font-size:1rem;color:#fff;display:flex;align-items:center;
  gap:.55em;flex-wrap:wrap}

/* session-type dot — keep in sync with the legend swatches */
.sched-name::before{content:"";width:8px;height:8px;border-radius:50%;flex:none;
  background:#c6dd34}
.sched-row[data-type="doubles"]   .sched-name::before{background:#7fb2ff}
.sched-row[data-type="challenge"] .sched-name::before{background:#ff5f56}

.sched-level{font-style:normal;font-family:"Poppins",sans-serif;font-weight:500;
  font-size:.68rem;letter-spacing:.05em;text-transform:uppercase;
  color:rgba(255,255,255,.72);border:1px solid rgba(255,255,255,.26);
  border-radius:999px;padding:.16em .6em}
.sched-meta{font-size:.83rem;color:rgba(255,255,255,.58)}
/* price + Reserve button take the session-type colour (matches the dot + legend).
   cardio #c6dd34 (default) · doubles #7fb2ff · challenge #ff5f56.
   The per-type rules sit BEFORE the :hover rule below on purpose — they share
   equal specificity with it, so source order decides, and hover must still win
   to flip the button white. Don't reorder these. */
.sched-price{font-family:"Poppins",sans-serif;font-weight:700;color:#fff;font-size:1rem}
.sched-row[data-type="doubles"]   .sched-price{color:#fff}
.sched-row[data-type="challenge"] .sched-price{color:#fff}

.sched-go{font-family:"Poppins",sans-serif;font-weight:600;font-size:.82rem;color:var(--ink);
  background:var(--ball);border-radius:999px;padding:.44em 1em;white-space:nowrap}
.sched-row[data-type="doubles"]   .sched-go{background:#7fb2ff}
.sched-row[data-type="challenge"] .sched-go{background:#ff5f56}
.sched-row:hover .sched-go{background:#fff}

.sched-note{margin:1.6rem auto 0;font-size:.88rem;color:rgba(255,255,255,.55);max-width:60ch}
.sched-legend{display:flex;gap:1.2rem;justify-content:center;margin-top:1.5rem;
  flex-wrap:wrap;font-size:.82rem;color:rgba(255,255,255,.62)}
.sched-legend span{display:inline-flex;align-items:center;gap:.45em}
.sched-legend i{width:8px;height:8px;border-radius:50%;display:inline-block}

/* anchor target must clear the 72px sticky header */
#book{scroll-margin-top:88px}

@media(max-width:720px){
  .sched-row{grid-template-columns:1fr auto;gap:.5rem .8rem;padding:.8rem .7rem}
  .sched-time{grid-column:1;font-size:.9rem;color:var(--ball)}
  .sched-price{grid-column:2;grid-row:1;text-align:right}
  .sched-what{grid-column:1/-1;grid-row:2}
  .sched-go{grid-column:1/-1;grid-row:3;justify-self:start;margin-top:.5rem}
}