/* ===== 2026 Schedule — calendar cube grid + detail panels + list/print views ===== */
.wrap{max-width:900px;margin:0 auto;padding:0 22px 220px;position:relative;z-index:1}
.lead{font-family:var(--disp);font-weight:500;text-transform:uppercase;font-size:clamp(16px,2.6vw,20px);color:var(--leaf);text-align:center;letter-spacing:1px;margin-top:6px}
/* ── Race alerts on WhatsApp — animated icon between "RACE ALERTS" / "ON WHATSAPP" where the MMCC
      crest used to sit; clicking the icon drops a box with the channel text + join button ── */
/* v1.12.1: the WhatsApp + calendar folds became two ALWAYS-OPEN glass boxes side by side */
.alertrow{display:grid;grid-template-columns:1fr 1fr;gap:16px;max-width:880px;margin:20px auto 26px}
@media(max-width:760px){.alertrow{grid-template-columns:1fr}}
.glassbox{background:rgba(0,0,0,.55);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);border:1px solid rgba(228,228,216,.14);border-radius:16px;padding:22px 22px 20px;text-align:center;display:flex;flex-direction:column;align-items:center}
.gb-head{display:flex;align-items:center;justify-content:center;gap:14px;margin:0 0 12px}
.glassbox p{font-family:var(--body);font-size:14.5px;line-height:1.6;color:var(--cream);opacity:.95;margin:0 0 16px}
.glassbox p b{color:var(--leaf)}
.glassbox .join{background:#25D366;color:#11281B}
.glassbox .join.soon{opacity:.5;pointer-events:none}
.glassbox .join.calbtn{background:var(--orange);color:#fff;border:0;cursor:pointer;font-size:13.5px;padding:11px 16px}
.glassbox .join.calbtn.ghostbtn{background:transparent;border:1px solid rgba(228,228,216,.4);color:var(--cream)}
.glassbox .soonnote{display:block;font-family:var(--data);letter-spacing:1px;text-transform:uppercase;font-size:11px;color:var(--cream);opacity:.55;margin-top:10px}
.cal-btns{display:flex;flex-wrap:wrap;gap:9px;justify-content:center}
.cal-ic{position:relative;width:52px;height:52px;display:grid;place-items:center;color:var(--orange)}
.cal-ic svg{width:42px;height:42px}
.was-t{transition:color .2s ease}
.was-t{font-family:var(--disp);font-weight:700;text-transform:uppercase;letter-spacing:2px;font-size:clamp(14px,2vw,18px);color:var(--cream)}
.was-ic{appearance:none;-webkit-appearance:none;background:none;border:0;cursor:pointer;position:relative;width:66px;height:66px;display:grid;place-items:center;padding:0}
.was-ic svg{width:48px;height:48px;position:relative;z-index:2;animation:waBob 2.8s ease-in-out infinite}
.was-ic .ring{position:absolute;top:50%;left:50%;width:48px;height:48px;margin:-24px 0 0 -24px;border-radius:50%;border:2px solid #25D366;opacity:0;animation:waPulse 2.6s ease-out infinite;pointer-events:none}
.was-ic .ring.r2{animation-delay:1.3s}
@keyframes waBob{0%,100%{transform:translateY(0)}50%{transform:translateY(-5px)}}
@keyframes waPulse{0%{transform:scale(.7);opacity:.7}100%{transform:scale(1.7);opacity:0}}
@media(prefers-reduced-motion:reduce){.was-ic svg,.was-ic .ring{animation:none}.was-ic .ring{display:none}}
.intro{font-family:var(--body);font-size:16px;line-height:1.65;font-weight:600;color:var(--cream);text-align:center;max-width:660px;margin:0 auto 30px}

.legend{display:flex;flex-wrap:wrap;justify-content:center;gap:16px;margin:0 0 22px}
.legend span{display:inline-flex;align-items:center;gap:9px;font-family:var(--disp);font-weight:700;letter-spacing:.5px;text-transform:uppercase;font-size:16px;color:var(--cream);opacity:1}
.legend i{width:17px;height:17px;border-radius:4px;display:block}
.updated{text-align:center;font-family:var(--disp);font-weight:500;letter-spacing:.5px;text-transform:uppercase;font-size:15px;color:var(--cream);opacity:.85;margin:0 0 20px}
.allpast{text-align:center;font-family:var(--disp);font-weight:500;text-transform:uppercase;color:var(--leaf);opacity:.85;padding:30px 0}

/* calendar grid — big date cubes, Sunday-start, two clean week rows */
/* the day cubes flow at a fixed comfortable size — however many fit per row at this width */
.days{display:grid;grid-template-columns:repeat(auto-fit,minmax(118px,1fr));gap:10px;margin-bottom:18px}
@media(min-width:1000px){.days{grid-template-columns:repeat(auto-fit,minmax(130px,148px));justify-content:center}}

.cube{position:relative;aspect-ratio:1/1;border-radius:12px;background:rgba(20,22,20,.55);border:1px solid var(--line);appearance:none;-webkit-appearance:none;color:inherit;font:inherit;display:flex;flex-direction:column;align-items:center;justify-content:center;padding:16px 6px 34px;cursor:pointer;overflow:hidden;transition:transform .2s cubic-bezier(.2,.7,.3,1.2),box-shadow .2s,background .2s}
.cube.empty{background:transparent;border:0;cursor:default;pointer-events:none}
.cube:not(.empty):not(.past):hover{transform:translateY(-3px)}
.cube:focus-visible{outline:2px solid var(--leaf);outline-offset:2px}
.cube .bar{position:absolute;top:0;left:0;right:0;height:6px}
.cube .num{font-family:var(--cameo);font-weight:700;font-size:clamp(26px,4.6vw,44px);line-height:1;color:var(--cream)}   /* day numbers in Gravesend Cameo (trial) */
.cube .tag{position:absolute;left:0;right:0;bottom:0;z-index:3;height:34px;display:flex;align-items:center;justify-content:center;text-align:center;background:#000;color:var(--cream);font-family:var(--disp);font-weight:600;text-transform:uppercase;letter-spacing:.3px;font-size:11px;line-height:1.08;padding:3px 5px}
.cube .tag::before{content:"";position:absolute;top:0;left:0;right:0;height:3px}
.cube.mgp .tag::before{background:var(--leaf)}
.cube.mixed .tag::before{background:linear-gradient(90deg,var(--leaf) 0 50%,#16255f 50% 100%)}
.cube.classic .tag::before{background:linear-gradient(90deg,#16255f 0 42%,#ffc400 42% 70%,#F39200 70% 100%)}

/* day-type colours — MGP = green · Combined = green+navy · Classic TT = navy / yellow / orange (2026 logo palette) */
.cube.mgp .bar{background:var(--leaf)}
.cube.mgp .num{color:var(--leaf)}
.cube.mixed .bar{background:linear-gradient(135deg,var(--leaf) 0 50%,#16255f 50% 100%)}
.cube.mixed .num{color:var(--leaf)}
.cube.classic .bar{background:linear-gradient(135deg,#16255f 0 42%,#ffc400 42% 70%,#F39200 70% 100%)}
.cube.classic .num{color:#6f9dff}

/* blended event logo behind each cube — blurred by default, snaps into focus on hover / when selected */
.cube::before,.cube::after{content:"";position:absolute;inset:0;z-index:0;pointer-events:none;background-repeat:no-repeat;background-position:center;background-size:cover;opacity:0;filter:blur(2px) brightness(.82);transform:scale(1.07);transition:filter .35s ease,transform .35s ease}
.cube.mgp::before{background-image:url(/assets/images/logo.svg);background-size:120%;background-position:center 52%;opacity:.26}
.cube.classic::before{background-image:url(/assets/images/classic-tt-logo.png);opacity:.52}
.cube.mixed::before{background-image:url(/assets/images/logo.svg);background-size:150%;background-position:26% 34%;opacity:.28;clip-path:polygon(0 0,100% 0,0 100%)}
.cube.mixed::after{background-image:url(/assets/images/classic-tt-logo.png);background-position:62% center;opacity:.52;clip-path:polygon(100% 0,100% 100%,0 100%)}
.cube:not(.empty):not(.past):hover::before,.cube:not(.empty):not(.past):hover::after,
.cube.active::before,.cube.active::after{filter:blur(0) brightness(.98);transform:scale(1.04)}
.cube .num{position:relative;z-index:1;text-shadow:0 1px 4px rgba(0,0,0,.6)}
.cube .bar{z-index:2}
@media(prefers-reduced-motion:reduce){.cube::before,.cube::after{transition:none}}

/* gentle day-coloured border glow */
@keyframes cubeGlowG{0%,100%{box-shadow:0 0 5px rgba(40,152,81,.14)}50%{box-shadow:0 0 12px rgba(40,152,81,.28)}}
@keyframes cubeGlowO{0%,100%{box-shadow:0 0 5px rgba(243,146,0,.15)}50%{box-shadow:0 0 12px rgba(243,146,0,.3)}}
.cube.mgp,.cube.mixed{animation:cubeGlowG 5s ease-in-out infinite}
.cube.classic{animation:cubeGlowO 5s ease-in-out infinite}
.cube.empty,.cube.past{animation:none}
.days .cube:nth-child(2){animation-delay:-.9s}
.days .cube:nth-child(3){animation-delay:-1.9s}
.days .cube:nth-child(4){animation-delay:-3s}
.days .cube:nth-child(5){animation-delay:-2.2s}
.days .cube:nth-child(6){animation-delay:-4.1s}
.days .cube:nth-child(7){animation-delay:-1.3s}

.cube.active{background:rgba(20,22,20,.9);animation:none}
.cube.mgp.active,.cube.mixed.active{box-shadow:0 0 0 2px var(--leaf),0 8px 20px rgba(0,0,0,.45)}
.cube.classic.active{box-shadow:0 0 0 2px #F39200,0 8px 20px rgba(0,0,0,.45)}
.cube.past{opacity:.3;cursor:default;filter:saturate(.45)}
@media(prefers-reduced-motion:reduce){
  .cube.mgp,.cube.mixed{animation:none;box-shadow:0 0 8px rgba(40,152,81,.2)}
  .cube.classic{animation:none;box-shadow:0 0 8px rgba(243,146,0,.2)}
}

/* expanding detail panel — unfolds below the week row */
.detail{display:grid;grid-template-rows:0fr;transition:grid-template-rows .38s cubic-bezier(.4,0,.2,1)}
.detail.open{grid-template-rows:1fr}
.detail>.inner{overflow:hidden;min-height:0}
/* Cube-fold: clicking a cube folds the whole grid away (0fr↔1fr) and shows just that day */
.days-wrap{display:grid;grid-template-rows:1fr;margin-bottom:18px;transition:grid-template-rows .42s cubic-bezier(.4,0,.2,1),opacity .3s ease,margin-bottom .42s}
.days-wrap>.days{overflow:hidden;min-height:0;margin-bottom:0}
#cal.solo .days-wrap{grid-template-rows:0fr;opacity:0;margin-bottom:0;pointer-events:none}
/* Back-to-all-days: a CENTRED orange round pill at the FOOT of the day card (bigger thumb target,
   all breakpoints). Moved from the top of the card to below the session list — see schedule.php. */
.daycard-back{appearance:none;-webkit-appearance:none;display:block;width:fit-content;margin:22px auto 2px;background:var(--orange);border:0;color:#151515;font-family:var(--data);font-weight:700;text-transform:uppercase;letter-spacing:.6px;font-size:12.5px;padding:11px 26px;border-radius:999px;cursor:pointer;box-shadow:0 4px 14px rgba(243,146,0,.30);transition:transform .18s cubic-bezier(.2,.7,.3,1.2),box-shadow .2s,background .2s}
.daycard-back:hover{background:#ffab2e;transform:translateY(-2px);box-shadow:0 6px 18px rgba(243,146,0,.42)}
.daycard-back:active{transform:translateY(0)}
.daycard-back:focus-visible{outline:2px solid var(--cream);outline-offset:2px}
.dcard{position:relative;overflow:hidden;border-radius:14px;background:rgba(20,22,20,.7);border:1px solid var(--line);border-left:6px solid var(--leaf);padding:16px 20px 20px;margin:4px 0 10px}
.dcard>.dtitle,.dcard>.roads,.dcard>.sgrid,.dcard>.daycard-back{position:relative;z-index:1}
.dcard.mgp{border-left-color:var(--leaf)}
.dcard.mixed{border-left-color:#289851}
.dcard.classic{border-left-color:#F39200}
.dcard .dtitle,.lday .dtitle{font-family:var(--disp);font-weight:700;text-transform:uppercase;font-size:19px;color:var(--cream);line-height:1.2}
.dcard .roads,.lday .roads{font-family:var(--disp);font-weight:700;letter-spacing:.5px;text-transform:uppercase;font-size:16px;color:var(--orange);padding:8px 0 0}
.dcard .sgrid,.lday .sgrid{display:grid;grid-template-columns:auto 1fr;gap:11px 18px;padding:14px 0 0;align-items:baseline}
.dcard .sgrid .t,.lday .sgrid .t{font-family:var(--data);font-weight:700;color:var(--leaf);font-size:16.5px;line-height:1.35;white-space:nowrap;font-variant-numeric:tabular-nums;letter-spacing:.3px}
.dcard.classic .sgrid .t,.lday.classic .sgrid .t{color:#6f9dff}
.dcard .sgrid .e,.lday .sgrid .e{font-family:var(--data);font-weight:600;font-size:16.5px;letter-spacing:.3px;color:var(--cream);opacity:.96;line-height:1.35}

/* view toggle — single pill button: Expand all ⇄ Collapse */
.vt{display:flex;justify-content:center;margin:0 0 22px}
.seg-toggle{appearance:none;-webkit-appearance:none;border:1px solid var(--line);background:rgba(20,22,20,.55);color:var(--cream);font-family:var(--disp);font-weight:700;text-transform:uppercase;letter-spacing:.5px;font-size:13.5px;padding:11px 24px;border-radius:999px;cursor:pointer;display:inline-flex;align-items:center;gap:9px;transition:background .2s,color .2s,border-color .2s}
.seg-toggle svg{width:16px;height:16px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.seg-toggle:hover{background:var(--leaf);color:var(--forest);border-color:var(--leaf)}
.seg-toggle:focus-visible{outline:2px solid var(--leaf);outline-offset:2px}

/* Expand-all ⇄ Collapse animates via JS-driven max-height (schedule.php setMode): the outgoing view
   folds to 0 and the incoming unfolds to its real pixel height, then is released to auto. Both views
   stay in the DOM. (grid-rows 1fr↔0fr was tried but doesn't interpolate reliably for these nested grids.) */
#cal,#list{overflow:hidden;transition:max-height .45s cubic-bezier(.4,0,.2,1),opacity .35s ease}
@media(prefers-reduced-motion:reduce){#cal,#list{transition:none}}

/* full sequential list (expand-all / print view) */
.lday{position:relative;overflow:hidden;border-radius:14px;background:rgba(20,22,20,.6);border:1px solid var(--line);border-left:6px solid var(--leaf);padding:16px 20px 20px;margin-bottom:14px}
.lday.mgp{border-left-color:var(--leaf)}
.lday.mixed{border-left-color:#289851}
.lday.classic{border-left-color:#F39200}
.lhead{display:flex;align-items:center;gap:15px}
.lbadge{flex:0 0 auto;width:60px;height:64px;border-radius:11px;display:flex;flex-direction:column;align-items:center;justify-content:center;line-height:1}
.lbadge .d{font-family:var(--cameo);font-weight:700;font-size:27px}
.lbadge .m{font-family:var(--data);font-weight:700;font-size:12px;text-transform:uppercase;letter-spacing:1px;margin-top:3px}
.lday.mgp .lbadge{background:var(--leaf);color:var(--forest)}
.lday.mixed .lbadge{background:linear-gradient(135deg,var(--leaf) 0 50%,#16255f 50% 100%);color:#fff}
.lday.classic .lbadge{background:#16255f;color:#fff;box-shadow:inset 0 0 0 2px #F39200}

.lbadge{position:relative;overflow:hidden}
.lbadge .d,.lbadge .m{position:relative;z-index:1}
.lbadge .d{text-shadow:0 1px 2px rgba(0,0,0,.35)}
.lbadge::before,.lbadge::after{content:"";position:absolute;inset:0;background-repeat:no-repeat;background-position:center;background-size:cover;filter:blur(1.4px) brightness(.92);opacity:0;pointer-events:none}
.lday.mgp .lbadge::before{background-image:url(/assets/images/logo.svg);background-size:135%;opacity:.24}
.lday.classic .lbadge::before{background-image:url(/assets/images/classic-tt-logo.png);opacity:.4}
.lday.mixed .lbadge::before{background-image:url(/assets/images/logo.svg);background-size:150%;background-position:24% 32%;opacity:.28;clip-path:polygon(0 0,100% 0,0 100%)}
.lday.mixed .lbadge::after{background-image:url(/assets/images/classic-tt-logo.png);background-position:64% center;opacity:.46;clip-path:polygon(100% 0,100% 100%,0 100%)}

.lday.mgp,.lday.mixed{box-shadow:0 0 10px rgba(40,152,81,.13)}
.lday.classic{box-shadow:0 0 10px rgba(243,146,0,.15)}

@media(max-width:600px){
  .wrap{padding:0 12px 150px}   /* pills sit low on mobile now — less bottom clearance needed */
  .days{gap:6px;grid-template-columns:repeat(auto-fit,minmax(86px,1fr))}
  .cube{aspect-ratio:1/1.12;border-radius:9px;padding:9px 3px 5px;gap:0}
  .cube .bar{height:4px}
  .cube .num{font-size:20px}
  .cube .tag{display:none}
  .dcard{padding:14px 15px 16px}
  .dcard .sgrid,.lday .sgrid{gap:8px 14px}
  .vt button{font-size:12.5px;padding:9px 14px}
  .lday{padding:14px 15px 16px}
  .lbadge{width:52px;height:56px}
  .lbadge .d{font-size:23px}
}

/* print — always the clean sequential list on white paper, chrome hidden */
@media print{
  .sitelogo,.mgp-menu,.mgp-bar,.mgp-backdrop,.mgp-sheet,.mgp-sheet-scrim,.vt,.opener,.wa-strip,.wa-drop{display:none!important}
  body{background:#fff!important}
  .wrap{max-width:100%;padding:0 6px}
  .pagetitle,.intro,.updated,.legend span{color:#111!important;opacity:1!important}
  .lead{color:#146b34!important}
  #views #cal{display:none!important}
  #views #list{display:block!important}
  .lday{break-inside:avoid;background:#fff!important;border:1px solid #bbb!important;margin-bottom:10px}
  .lday .dtitle{color:#111!important}
  .lday .roads{color:#b35300!important}
  .lday .sgrid .t{color:#146b34!important}
  .lday.classic .sgrid .t{color:#16255f!important}
  .lday .sgrid .e{color:#222!important;opacity:1!important}
}