main{width:min(90%,560px);margin:42px auto 70px}main h1{font-size:clamp(42px,6vw,70px)}main p{font-size:19px}
.month,.grid{display:grid;align-items:center;text-align:center}.month{grid-template-columns:auto 1fr auto;margin:26px 0 18px}.month h2{font-size:26px}
.grid{grid-template-columns:repeat(7,minmax(0,1fr));column-gap:clamp(0px,1vw,4px);row-gap:4px}.grid button{min-width:0;width:100%;box-sizing:border-box;padding-inline:0;min-height:44px}.grid span{padding-bottom:8px}
button{font:inherit;color:inherit;cursor:pointer;border:1px solid transparent;background:transparent;border-radius:8px;padding:9px}
button:disabled{opacity:.35;cursor:default}.grid button:hover:enabled,.month button:hover:enabled{border-color:currentColor}
.grid button[aria-pressed=true],button.pill{background:#122948;color:#fcf7ed}button.pill{margin:0}
main section{border:1px solid #b7b8ae;border-radius:16px;padding:clamp(16px,3vw,30px)}
#today{font-size:16px;margin:0}
.grid button[aria-current=date]{border:1.5px solid #182e54;font-weight:bold}
#booking:not([hidden]){display:grid;gap:14px;margin-top:22px}
#booking label{display:grid;gap:4px}
#booking input,#booking textarea{font:inherit;color:inherit;background:transparent;padding:10px;border:1px solid #939996;border-radius:8px}
#booking small{margin-top:-10px}
#booking .pill{justify-self:start;padding:10px 24px}
.planning{display:block;width:min(88%,380px);margin:0 auto 12px;mix-blend-mode:multiply;clip-path:inset(0 0 7% 0)}
main section{clear:both}
.zone-label{display:grid;gap:6px;margin-bottom:18px}
#zone-picker{max-width:100%;width:100%;padding:10px 12px;border:1px solid #a7aaad;border-radius:9px;background:#fcf7ed;color:#182e54;font:inherit}
.slot-picker{min-width:0;margin:0;padding:12px 14px 16px;border:1px solid #b7b8ae;border-radius:12px}
.slot-picker legend{padding:0 6px;font-family:"Bizwolf Bold",sans-serif}
#zone{margin:0 0 10px;font-size:15px}
#slots{display:grid;grid-template-columns:repeat(auto-fit,minmax(116px,1fr));gap:6px;max-height:205px;overflow-y:auto;padding:3px}
#slots label{position:relative;cursor:pointer}
#slots input{position:absolute;opacity:0;width:1px;height:1px}
#slots span{padding:9px 3px;text-align:center;font-size:15px;border:1px solid #b7b8ae;border-radius:7px}
#slots input:checked+span{background:#182e54;color:#fcf7ed}
#slots input:focus-visible+span{outline:2px solid #182e54;outline-offset:1px}
.locations{display:grid;grid-template-columns:1fr 1fr;gap:12px}.locations label{min-width:0}
#country,#slots{display:block;box-sizing:border-box;width:100%;max-width:100%;padding:10px 12px;border:1px solid #a7aaad;border-radius:9px;background:#fcf7ed;color:#182e54;font:inherit}
@media(max-width:420px){.locations{grid-template-columns:1fr;gap:0}}

@media(max-width:600px){.planning{float:none;display:block;width:min(88%,335px);margin:0 auto 12px}}
main.received{text-align:center;display:grid;justify-items:center;gap:14px}
main.received .planning{float:none;width:min(90%,380px);margin:0}
main.received h1{font-size:clamp(36px,7vw,62px);margin:0;text-wrap:balance}
main.received p{margin:0;text-wrap:balance}
main:not(.received) .planning,main.received .date-art{display:none}
.date-art{display:block;width:min(80%,350px);height:auto;margin:0 auto 20px}
.grid button.booked:disabled{text-decoration:line-through;text-decoration-thickness:2px;opacity:.65;background:#1229480b}
