/* ============================================================
   GRAINATION — The Centre · booking panel (gnb)
   WooCommerce Bookings prototype UI: calendar → slots → cart.
   Lab-form aesthetic: squared, hairline, mono data. Light field.
   Cobalt = selection/action. No acid on light (confirm flip only).
   Rendered by ui_kits/centre/booking.js into [data-gn-booking].
   ============================================================ */
.gnb{border:1px solid var(--ink,#131313);background:var(--paper,#FBFAF6);display:grid;grid-template-columns:minmax(0,1.05fr) minmax(0,1fr);margin-top:clamp(22px,3vw,34px);}
.gnb *{box-sizing:border-box;}
.gnb-cal{padding:clamp(18px,2.6vw,30px);border-right:1px solid var(--line,#DAD7CC);min-width:0;}
.gnb-side{padding:clamp(18px,2.6vw,30px);min-width:0;display:flex;flex-direction:column;gap:18px;}
.gnb-mhead{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-bottom:14px;}
.gnb-mname{font-family:var(--grot,'Neue Haas Grotesk Display',sans-serif);font-weight:800;font-size:clamp(17px,1.8vw,21px);letter-spacing:-.01em;text-transform:uppercase;}
.gnb-mnav{display:flex;gap:8px;}
.gnb-mnav button:is(main[data-nav] *,.woocommerce-page *):is(main[data-nav] *,.woocommerce-page *){width:44px;height:44px;font-family:var(--sans,'Neue Haas Grotesk Text',sans-serif);border:1px solid var(--line,#DAD7CC);background:transparent;color:var(--ink,#131313);font-size:16px;cursor:pointer;transition:border-color .14s,color .14s;}
.gnb-mnav button:hover:is(main[data-nav] *,.woocommerce-page *):is(main[data-nav] *,.woocommerce-page *){border-color:var(--ink,#131313);}
.gnb-mnav button:disabled:is(main[data-nav] *,.woocommerce-page *):is(main[data-nav] *,.woocommerce-page *){color:#B9B5A8;border-color:var(--line,#DAD7CC);cursor:not-allowed;}
.gnb-mnav button:focus-visible:is(main[data-nav] *,.woocommerce-page *):is(main[data-nav] *,.woocommerce-page *){outline:2px solid var(--cobalt,#005BFF);outline-offset:2px;}
.gnb-dow{display:grid;grid-template-columns:repeat(7,1fr);gap:4px;margin-bottom:4px;}
.gnb-dow span{font-family:var(--mono,'IBM Plex Mono',monospace);font-size:9.5px;letter-spacing:.12em;text-transform:uppercase;color:var(--mut,#6B6759);text-align:center;padding:6px 0;}
.gnb-days{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:4px;}
.gnb-day:is(main[data-nav] *,.woocommerce-page *):is(main[data-nav] *,.woocommerce-page *){position:relative;aspect-ratio:1;min-height:44px;border:1px solid transparent;background:transparent;font-family:var(--mono,'IBM Plex Mono',monospace);font-size:12.5px;font-variant-numeric:tabular-nums;color:var(--ink,#131313);cursor:pointer;display:flex;align-items:center;justify-content:center;transition:border-color .12s,background .12s,color .12s;}
.gnb-day:hover:is(main[data-nav] *,.woocommerce-page *):is(main[data-nav] *,.woocommerce-page *){border-color:var(--ink,#131313);}
.gnb-day:focus-visible:is(main[data-nav] *,.woocommerce-page *):is(main[data-nav] *,.woocommerce-page *){outline:2px solid var(--cobalt,#005BFF);outline-offset:1px;}
.gnb-day[disabled]:is(main[data-nav] *,.woocommerce-page *):is(main[data-nav] *,.woocommerce-page *){color:#C9C5B8;cursor:not-allowed;border-color:transparent;}
.gnb-day.is-off:is(main[data-nav] *,.woocommerce-page *):is(main[data-nav] *,.woocommerce-page *){visibility:hidden;}
.gnb-day.is-today:is(main[data-nav] *,.woocommerce-page *):is(main[data-nav] *,.woocommerce-page *)::after{content:"";position:absolute;left:50%;bottom:5px;transform:translateX(-50%);width:4px;height:4px;background:var(--cobalt,#005BFF);border-radius:50%;}
.gnb-day.is-full:is(main[data-nav] *,.woocommerce-page *):is(main[data-nav] *,.woocommerce-page *){color:#C9C5B8;text-decoration:line-through;text-decoration-thickness:1px;cursor:not-allowed;}
.gnb-day[aria-pressed="true"]:is(main[data-nav] *,.woocommerce-page *):is(main[data-nav] *,.woocommerce-page *){background:var(--cobalt,#005BFF);border-color:var(--cobalt,#005BFF);color:#fff;}
.gnb-day[aria-pressed="true"].is-today:is(main[data-nav] *,.woocommerce-page *):is(main[data-nav] *,.woocommerce-page *)::after{background:#fff;}
.gnb-legend{display:flex;flex-wrap:wrap;gap:8px 18px;margin-top:14px;font-family:var(--mono,'IBM Plex Mono',monospace);font-size:9.5px;letter-spacing:.1em;text-transform:uppercase;color:var(--mut,#6B6759);}
.gnb-legend i{display:inline-block;width:8px;height:8px;margin-right:6px;vertical-align:baseline;}
.gnb-legend .a i{background:var(--cobalt,#005BFF);}
.gnb-legend .f i{background:#C9C5B8;}
.gnb-h{font-family:var(--mono,'IBM Plex Mono',monospace);font-size:10px;font-weight:600;letter-spacing:.14em;text-transform:uppercase;color:var(--mut,#6B6759);margin:0 0 8px;}
.gnb-date{font-family:var(--grot,'Neue Haas Grotesk Display',sans-serif);font-weight:800;font-size:clamp(16px,1.7vw,19px);letter-spacing:-.01em;text-transform:uppercase;margin:0 0 2px;}
.gnb-seg{display:flex;flex-wrap:wrap;gap:8px;}
.gnb-seg button:is(main[data-nav] *,.woocommerce-page *):is(main[data-nav] *,.woocommerce-page *){min-height:44px;padding:0 14px;border:1px solid var(--line,#DAD7CC);background:transparent;color:var(--ink,#131313);font-family:var(--sans,'Neue Haas Grotesk Text',sans-serif);font-size:12px;font-weight:600;letter-spacing:.04em;text-transform:uppercase;cursor:pointer;transition:border-color .12s,background .12s,color .12s;}
.gnb-seg button:hover:is(main[data-nav] *,.woocommerce-page *):is(main[data-nav] *,.woocommerce-page *){border-color:var(--ink,#131313);}
.gnb-seg button:focus-visible:is(main[data-nav] *,.woocommerce-page *):is(main[data-nav] *,.woocommerce-page *){outline:2px solid var(--cobalt,#005BFF);outline-offset:2px;}
.gnb-seg button[aria-pressed="true"]:is(main[data-nav] *,.woocommerce-page *):is(main[data-nav] *,.woocommerce-page *){background:var(--cobalt,#005BFF);border-color:var(--cobalt,#005BFF);color:#fff;}
.gnb-seg button .sub{display:block;font-family:var(--mono,'IBM Plex Mono',monospace);font-size:9px;font-weight:400;letter-spacing:.08em;color:inherit;opacity:.65;margin-top:1px;text-transform:none;}
.gnb-slots{display:grid;grid-template-columns:repeat(auto-fill,minmax(86px,1fr));gap:8px;}
.gnb-slot:is(main[data-nav] *,.woocommerce-page *):is(main[data-nav] *,.woocommerce-page *){min-height:44px;border:1px solid var(--line,#DAD7CC);background:transparent;font-family:var(--mono,'IBM Plex Mono',monospace);font-size:12px;font-variant-numeric:tabular-nums;color:var(--ink,#131313);cursor:pointer;transition:border-color .12s,background .12s,color .12s;}
.gnb-slot:hover:is(main[data-nav] *,.woocommerce-page *):is(main[data-nav] *,.woocommerce-page *){border-color:var(--ink,#131313);}
.gnb-slot:focus-visible:is(main[data-nav] *,.woocommerce-page *):is(main[data-nav] *,.woocommerce-page *){outline:2px solid var(--cobalt,#005BFF);outline-offset:2px;}
.gnb-slot[disabled]:is(main[data-nav] *,.woocommerce-page *):is(main[data-nav] *,.woocommerce-page *){color:#C9C5B8;text-decoration:line-through;cursor:not-allowed;}
.gnb-slot[aria-pressed="true"]:is(main[data-nav] *,.woocommerce-page *):is(main[data-nav] *,.woocommerce-page *){background:var(--cobalt,#005BFF);border-color:var(--cobalt,#005BFF);color:#fff;}
.gnb-empty{font-family:var(--sans,'Neue Haas Grotesk Text',sans-serif);font-size:13px;color:var(--mut,#6B6759);border:1px dashed var(--line,#DAD7CC);padding:16px;margin:0;}
.gnb-sum{border-top:1px solid var(--line,#DAD7CC);padding-top:14px;margin-top:auto;}
.gnb-sum-row{display:flex;justify-content:space-between;gap:14px;padding:5px 0;font-family:var(--mono,'IBM Plex Mono',monospace);font-size:11px;letter-spacing:.06em;text-transform:uppercase;}
.gnb-sum-row .k{color:var(--mut,#6B6759);}
.gnb-sum-row .v{font-variant-numeric:tabular-nums;text-align:right;}
.gnb-sum-row.rate .v{color:var(--mut,#6B6759);}
.gnb-cta{display:flex;flex-wrap:wrap;gap:12px 18px;align-items:center;margin-top:14px;}
.gnb-cta .qc[disabled]{opacity:.45;pointer-events:none;}
.gnb-cta .qc.is-added,.gnb-cta .qc.is-added:active,.gnb-cta .qc.is-added.tapped,.gnb-cta .qc.is-added.press{background:var(--acid,#B6FF00);border-color:var(--acid,#B6FF00);color:var(--ink,#131313);}
.gnb-note{font-family:var(--mono,'IBM Plex Mono',monospace);font-size:9.5px;letter-spacing:.1em;text-transform:uppercase;color:var(--mut,#6B6759);margin:10px 0 0;}
.gnb-live{font-family:var(--sans,'Neue Haas Grotesk Text',sans-serif);font-size:13px;margin:10px 0 0;}
.gnb-live a{color:var(--cobalt,#005BFF);}
@media(max-width:860px){.gnb{grid-template-columns:1fr;}.gnb-cal{border-right:0;border-bottom:1px solid var(--line,#DAD7CC);}}
/* WO-011 (round 3) — mobile calendar day-cell fit. Design booking.css adds
   @media(max-width:560px){.gnb-cal{padding:14px 10px}.gnb-days,.gnb-dow{gap:3px}
   .gnb-day{aspect-ratio:auto;min-height:44px}}: `aspect-ratio:1` forces each cell as WIDE as it
   is tall, so seven of them plus gaps outgrow a 320-375px viewport. Dropping it keeps the 44px
   tap height and lets the width fall out of the grid. .gnb-day carries this file's doubled
   :is() kit-armour, so the override has to match that specificity to land; .gnb-cal/.gnb-days/
   .gnb-dow are unarmoured and win on source order alone. */
@media(max-width:560px){
  .gnb-cal{padding:14px 10px;}
  .gnb-days,.gnb-dow{gap:3px;}
  .gnb-day:is(main[data-nav] *,.woocommerce-page *):is(main[data-nav] *,.woocommerce-page *){aspect-ratio:auto;min-height:44px;}
}
