html.calendar-document { scroll-behavior:auto; }
.sr-only { position:absolute; width:1px; height:1px; overflow:hidden; clip-path:inset(50%); white-space:nowrap; }
.appointment-layout { overflow-anchor:none; }
.appointment-layout.is-updating .appointment-calendar { opacity:.65; }
.calendar-feedback.is-error { padding:16px 20px; margin-bottom:20px; border-left:3px solid var(--blue); background:var(--paper); font-size:16px; line-height:1.7; }
.appointment-intro { padding-bottom:55px; }
.appointment-layout { display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1fr); align-items:start; gap:55px; margin-bottom:90px; scroll-margin-top:24px; }
.appointment-calendar { border:1px solid var(--line); padding:27px; background:#fff; scroll-margin-top:25px; }
.calendar-toolbar { display:flex; justify-content:space-between; align-items:center; gap:20px; margin-bottom:27px; }
.calendar-toolbar h2 { font-size:28px; margin:0; line-height:1.4; }
.calendar-toolbar nav { display:flex; gap:8px; }
.calendar-toolbar nav a { display:grid; place-items:center; width:44px; height:44px; border:1px solid var(--line); font-size:23px; }
.calendar-toolbar nav a:hover { background:var(--paper); }
.calendar-weekdays,.calendar-days { display:grid; grid-template-columns:repeat(7,minmax(0,1fr)); gap:5px; }
.calendar-weekdays { text-align:center; font-size:14px; color:var(--muted); margin-bottom:10px; }
.calendar-day { display:flex; flex-direction:column; align-items:center; justify-content:center; gap:6px; min-height:83px; border:1px solid var(--line); padding:9px 2px; position:relative; }
.calendar-day strong { font-size:20px; line-height:1; font-weight:600; }
.calendar-day small { font-size:11px; line-height:1.3; text-align:center; }
.calendar-day:hover { border-color:var(--blue); background:var(--paper); }
.calendar-day.is-selected { outline:2px solid var(--blue-dark); outline-offset:0; background:#edf3f5; z-index:1; }
.calendar-dot,.calendar-legend i { display:inline-block; height:7px; width:7px; border-radius:50%; background:#a1aab0; }
.state-available .calendar-dot,.calendar-legend .state-available i { background:#4e7a8e; }
.state-partial .calendar-dot,.state-busy .calendar-dot,.calendar-legend .state-partial i { background:#9a6557; }
.calendar-day.state-busy { background:#f5eeeb; color:#784f44; }
.calendar-day.is-past { color:#9aa4a8; border-color:transparent; background:#f7f8f8; font-size:18px; }
.calendar-legend { display:flex; flex-wrap:wrap; gap:9px 18px; margin-top:23px; font-size:13px; color:var(--muted); }
.calendar-legend span { display:inline-flex; align-items:center; gap:7px; }
.calendar-help { font-size:15px; line-height:1.7; margin-top:20px; color:var(--muted); }
.appointment-explanation { padding:28px 0; }
.appointment-explanation h3 { font-size:21px; display:flex; align-items:center; gap:12px; }
.appointment-explanation .ui-icon { color:var(--blue); }
.appointment-explanation p { font-size:16px; line-height:1.8; color:var(--muted); }
.appointment-form-panel { background:var(--paper); padding:35px; }
.appointment-form-panel .eyebrow { margin-top:26px; }
.appointment-selected-date { font-size:36px; margin-bottom:14px; }
.appointment-status { display:flex; align-items:center; gap:10px; color:var(--blue-dark); font-size:16px; line-height:1.7; margin-bottom:25px; }
.appointment-form fieldset { border:0; margin:0; padding:0; min-width:0; }
.appointment-form fieldset:disabled { opacity:.6; }
.appointment-form .field label,.calendar-admin .field label { font-size:15px; }
.appointment-form input,.appointment-form select,.appointment-form textarea,.calendar-admin input { font-size:16px; background:white; }
.appointment-form .form-grid { gap:20px; }
.appointment-form .button { width:100%; white-space:normal; gap:15px; justify-content:space-between; font-size:16px; }
.appointment-form .privacy-check { font-size:15px; line-height:1.7; }
.field-help { display:block; margin-top:10px; font-size:14px; line-height:1.7; color:var(--muted); }
.appointment-fineprint { font-size:14px; line-height:1.7; margin-top:18px; color:var(--muted); }
.appointment-busy { padding:17px 20px; background:#f1e5de; font-size:16px; margin-block:20px; }
.appointment-busy ul { padding-left:20px; margin-bottom:0; }
.appointment-next { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:45px; padding-bottom:90px; }
.appointment-next .ui-icon { width:32px; height:32px; color:var(--blue); margin-bottom:20px; }
.appointment-next h3 { font-size:24px; }
.appointment-next p { font-size:16px; color:var(--muted); }
.contact-calendar-link { margin-bottom:30px; font-size:16px; }
.calendar-admin { padding-bottom:100px; }
.calendar-admin p { font-size:16px; line-height:1.8; }
.calendar-admin .form-notice { margin-bottom:30px; font-size:16px; }
.calendar-admin .form-success,.calendar-admin .form-errors { margin-block:20px; font-size:16px; }
.appointment-admin-card { border:1px solid var(--line); background:#fff; padding:32px; }
.appointment-admin-card h2 { font-size:27px; line-height:1.4; margin-bottom:20px; }
.appointment-admin-card h3 { font-size:24px; margin-bottom:14px; }
.admin-login { max-width:680px; }
.admin-toolbar { display:flex; align-items:center; justify-content:space-between; gap:25px; border-bottom:1px solid var(--line); padding-block:10px 26px; margin-bottom:30px; }
.admin-toolbar p { margin:0; }
.admin-toolbar p strong { font-size:33px; color:var(--blue-dark); }
.admin-toolbar > div { display:flex; align-items:center; gap:25px; }
.admin-small-button { border:1px solid var(--line); padding:12px 17px; background:#fff; color:var(--blue-dark); font-size:15px; line-height:1.7; }
.admin-small-button:hover { background:var(--paper); }
.admin-calendar-note { background:#edf2f3; padding:28px 32px; margin-bottom:30px; }
.admin-calendar-note h2 { font-size:25px; display:flex; align-items:center; gap:13px; }
.admin-calendar-note p { margin:0; }
.admin-settings-grid { display:grid; grid-template-columns:1fr 1fr; gap:30px; margin-bottom:55px; }
.admin-settings-grid .form-grid { grid-template-columns:1fr; gap:0; }
.admin-settings-grid .privacy-check,.admin-event .privacy-check { font-size:15px; line-height:1.7; max-width:650px; }
.admin-settings-grid .button,.admin-event .button { white-space:normal; font-size:16px; }
.admin-secondary-form { margin-top:20px; }
.admin-event-heading h2 { font-size:33px; }
.admin-event-heading p { max-width:900px; color:var(--muted); }
.admin-events { display:grid; gap:25px; }
.admin-event-top { display:flex; align-items:center; justify-content:space-between; gap:20px; margin-bottom:25px; flex-wrap:wrap; }
.admin-event-top > strong { font-size:17px; }
.admin-status { padding:6px 12px; background:var(--paper); color:var(--muted); font-size:14px; }
.status-pending { background:#f3ece0; color:#795a2e; }
.status-confirmed,.status-blocked { background:#e8eff1; color:var(--blue-dark); }
.admin-event-actions { display:flex; align-items:flex-end; flex-wrap:wrap; gap:25px; border-top:1px solid var(--line); margin-top:25px; padding-top:25px; }
.admin-event-actions > form:first-child { max-width:650px; }
.admin-message { white-space:normal; overflow-wrap:anywhere; }
.calendar-admin .admin-reference { font-size:14px; color:var(--muted); }
.admin-delete { border:0; max-width:600px; }
.admin-delete summary { padding:12px; font-size:15px; color:#815648; display:list-item; list-style-position:inside; }
.admin-delete form { padding:15px; background:#f7efea; }
@media (max-width:1200px) { .appointment-layout { gap:30px; } .appointment-form-panel { padding:25px; } .appointment-calendar { padding:20px; } .calendar-day small { display:none; } .calendar-day { min-height:70px; } .appointment-form .form-grid { grid-template-columns:1fr; gap:0; } }
@media (max-width:900px) { .appointment-layout,.admin-settings-grid { grid-template-columns:1fr; } .appointment-next { grid-template-columns:1fr; gap:25px; } .calendar-day { min-height:74px; } .calendar-day small { display:block; font-size:12px; } .appointment-form-panel { padding:30px; } .admin-toolbar,.admin-toolbar > div { flex-wrap:wrap; } }
@media (max-width:600px) { .appointment-intro { padding-bottom:35px; } .appointment-layout { gap:15px; margin-bottom:55px; } .appointment-calendar { padding:17px 12px; } .calendar-toolbar { gap:12px; } .calendar-toolbar h2 { font-size:24px; } .calendar-toolbar nav a { width:40px; height:44px; } .calendar-days,.calendar-weekdays { gap:3px; } .calendar-day { min-height:55px; padding:6px 1px; } .calendar-day small { display:none; } .calendar-day strong { font-size:18px; } .calendar-weekdays { font-size:13px; } .calendar-legend { font-size:14px; gap:10px; } .appointment-form-panel { padding:25px 20px; } .appointment-selected-date { font-size:32px; } .appointment-status { align-items:flex-start; font-size:16px; } .appointment-next { padding-bottom:55px; } .appointment-admin-card,.admin-calendar-note { padding:25px 20px; } .admin-toolbar > div { gap:15px; } .admin-toolbar .text-link { font-size:15px; } .admin-event-top { flex-direction:column; align-items:flex-start; } .admin-event-top strong { font-size:16px; } .admin-event-actions { flex-direction:column; align-items:flex-start; } .admin-event .button,.admin-settings-grid .button { width:100%; justify-content:space-between; } .admin-calendar-note h2 { align-items:flex-start; font-size:23px; } .calendar-admin .privacy-check { font-size:15px; } }