/* Mobile month, weekly agenda and three-day timeline fit the viewport. */
.calendar-mobile-day,.calendar-mobile-date,.mobile-week-layout { display:none; }
#view-calendar { min-width:0;max-width:100%; }
#view-calendar .calendar-card { min-width:0;max-width:100%;overflow:hidden; }
.calendar-week-view { overflow-x:auto;overscroll-behavior-x:contain;scrollbar-width:thin;scrollbar-color:var(--brand-border) transparent; }
.calendar-week-content { width:100%;min-width:722px; }
#view-calendar .calendar-head { width:100%; }
#view-calendar .calendar-scroll { width:100%;grid-template-columns:72px minmax(0,1fr);overflow-x:hidden; }
.calendar-scroll-hint { margin:0 0 12px;font-size:11px;line-height:1.7;color:var(--muted); }
#view-calendar .month-view { width:100%;min-width:0; }
#view-calendar .month-grid,#view-calendar .month-weekdays { grid-template-columns:repeat(7,minmax(0,1fr)); }
#view-calendar .month-cell { min-width:0; }
.agenda-meeting-copy small { display:flex;gap:8px;align-items:center;flex-wrap:wrap;color:var(--muted); }
.agenda-meeting-status { display:inline-block;padding:3px 7px;border-radius:6px;background:#f0f2f6;color:#5c6375;font-size:10px; }
.mobile-room-picker { display:grid;gap:8px;margin-bottom:18px; }
.mobile-room-picker>label { font-size:12px;font-weight:600; }
.mobile-room-picker>p { margin:2px 0 0;font-size:11px;line-height:1.7;color:var(--muted); }
.mobile-room-slots { display:grid;gap:9px; }
.mobile-room-slot { display:grid;grid-template-columns:94px minmax(0,1fr) auto;align-items:center;gap:10px;min-height:68px;padding:12px;border:1px solid var(--line);border-radius:11px;background:white;color:var(--ink);text-align:left; }
.mobile-room-slot time { font-size:11px;line-height:1.5;font-weight:600;white-space:nowrap;font-variant-numeric:tabular-nums; }
.mobile-room-slot strong { display:block;font-size:12px;line-height:1.6;overflow-wrap:anywhere; }
.mobile-room-slot small { display:block;font-size:10px;color:var(--muted);line-height:1.7;margin-top:3px; }
.mobile-room-slot.free { background:#f6fbf8;border-color:#dcece4; }
.mobile-room-slot.free strong { color:#287459; }
.mobile-room-slot.free .secondary-button { padding:7px 10px;min-height:36px;border-radius:8px;font-size:11px; }
.mobile-room-slot.booked { cursor:pointer; }.mobile-room-slot.booked:hover { background:var(--brand-soft);border-color:var(--brand-border); }
.mobile-room-slot.closed { background:#f7f8fb;color:#7d8190; }
.mobile-room-note { margin:15px 0 0;font-size:11px;line-height:1.8;color:var(--muted); }
@media(max-width:700px){
 #view-calendar .calendar-toolbar { display:grid;grid-template-columns:minmax(0,1fr);gap:12px;padding:14px; }
 #view-calendar .week-switcher { width:100%;min-width:0;display:grid;grid-template-columns:36px minmax(0,1fr) 36px;gap:8px; }
 #view-calendar .week-switcher strong { font-size:14px;line-height:1.5;margin:0;text-align:center;overflow-wrap:anywhere; }
 #view-calendar .week-switcher .icon-button { width:36px;height:36px; }
 #view-calendar .calendar-surface-toggle { width:100%;min-width:0; }
 #view-calendar .calendar-surface-toggle button { flex:1;min-width:0;padding:9px 8px;font-size:12px; }
 #view-calendar .view-toggle { display:flex;width:100%;margin:0; }
 #view-calendar .view-toggle button { flex:1;min-height:38px;font-size:12px; }
 .calendar-desktop-day { display:none; }.calendar-mobile-day { display:inline; }
 .calendar-mobile-date { display:grid;grid-template-columns:minmax(0,1fr) auto;gap:8px;align-items:end; }
 .calendar-mobile-date>label { grid-column:1/-1;font-size:11px;color:var(--muted); }
 #calendar-today { min-height:44px;padding:9px 13px;border-radius:10px;font-size:12px; }
 #view-calendar .room-filters { display:flex;flex-wrap:wrap;width:100%;min-width:0;overflow:visible;gap:6px; }
 #view-calendar .filter-chip { padding:7px 10px;min-height:34px;font-size:11px; }
 #view-calendar .calendar-booking-hint { font-size:11px;line-height:1.7; }
 #view-calendar .calendar-reserve { width:100%;margin:0;min-height:40px; }
 #view-calendar .calendar-scroll { height:min(600px,65dvh);min-height:360px; }
 #view-calendar .calendar-head { height:64px; }
 #view-calendar .month-view { padding:12px; }
 #view-calendar .month-instruction { font-size:11px;line-height:1.7; }
 #view-calendar .month-weekdays { padding-bottom:7px;font-size:10px; }
 #view-calendar .month-cell-compact { min-height:60px;padding:3px;border:0;background:transparent;cursor:default; }
 #view-calendar .month-day-button { display:grid;justify-items:center;align-content:center;gap:3px;width:100%;min-height:54px;padding:5px 0;border:1px solid transparent;border-radius:9px;background:white;color:var(--ink);cursor:pointer; }
 #view-calendar .month-day-number { font-size:13px;font-weight:600; }
 #view-calendar .month-mobile-count { min-height:13px;font-size:9px;line-height:1.4;color:var(--muted); }
 #view-calendar .outside-month .month-day-button { color:#969aa8;background:#f8f9fc; }
 #view-calendar .today .month-day-number { color:var(--brand-text); }
 #view-calendar .today .month-day-button { border-color:var(--brand-border); }
 #view-calendar .selected .month-day-button { background:var(--brand-primary);border-color:var(--brand-primary);color:var(--brand-on); }
 #view-calendar .selected .month-day-number,#view-calendar .selected .month-mobile-count { color:var(--brand-on); }
 #view-calendar .month-day-button:focus-visible { outline:2px solid var(--brand-text);outline-offset:1px; }
 #view-calendar .day-agenda { padding:16px;min-width:0; }
 #view-calendar .calendar-card[data-calendar-mode=month] .day-agenda { border-top:1px solid var(--line); }
 #view-calendar .agenda-heading { margin-bottom:16px;gap:10px; }
 #view-calendar .agenda-heading h2 { font-size:17px;line-height:1.6; }
 #view-calendar .agenda-heading p { font-size:11px;line-height:1.7; }
 #view-calendar .agenda-list { gap:10px;margin-bottom:16px; }
 #view-calendar .agenda-meeting { grid-template-columns:62px minmax(0,1fr) 10px;gap:10px;padding:13px 11px; }
 #view-calendar .agenda-meeting img { display:none; }
 #view-calendar .agenda-meeting time strong { font-size:15px; }.agenda-meeting time span { font-size:10px; }
 #view-calendar .agenda-meeting-copy>strong { font-size:13px;line-height:1.7;overflow-wrap:anywhere; }
 #view-calendar .agenda-meeting-copy>span { font-size:11px;line-height:1.7;overflow-wrap:anywhere; }
 #view-calendar .agenda-meeting-copy small { font-size:10px; }
 #view-calendar .day-agenda>[data-agenda-reserve] { width:100%;min-height:40px;padding:9px 12px;font-size:12px; }
 #view-calendar .room-schedule-view { padding:16px;overflow:visible; }
}
@media(max-width:360px){
 #view-calendar .calendar-toolbar { padding:12px; }
 #view-calendar .month-view { padding:8px; }#view-calendar .month-cell-compact { padding:2px; }#view-calendar .month-day-button { min-height:50px; }
 #view-calendar .day-agenda,#view-calendar .room-schedule-view { padding:12px; }
 .mobile-room-slot { grid-template-columns:80px minmax(0,1fr) auto;gap:7px;padding:10px; }.mobile-room-slot time { font-size:10px; }
}
@media(max-width:700px){
 #view-calendar .calendar-checkin { grid-template-columns:52px minmax(0,1fr);gap:12px; }
 #view-calendar .calendar-checkin .checkin-copy { min-width:0; }
 #view-calendar .calendar-checkin .checkin-copy strong,#view-calendar .calendar-checkin .checkin-copy>span { overflow-wrap:anywhere; }
 #view-calendar .calendar-checkin .arrival-guidance { display:none; }
 #view-calendar .calendar-checkin .arrival-preview-button { grid-column:1/-1;width:100%; }
}

#view-calendar #week-agenda[hidden],#view-calendar #mobile-week-layout[hidden],#view-calendar #calendar-week-view[hidden] { display:none!important; }
@media(max-width:700px){
 #view-calendar .mobile-week-layout { display:flex;width:100%;padding:4px;gap:4px;background:#eef0f5;border-radius:10px; }
 #view-calendar .mobile-week-layout button { flex:1;min-width:0;min-height:38px;border:0;border-radius:7px;background:transparent;color:var(--muted);font-size:12px;cursor:pointer; }
 #view-calendar .mobile-week-layout button.active { background:white;color:var(--ink);box-shadow:0 1px 4px #24243b12;font-weight:600; }
 #view-calendar .mobile-week-layout button:focus-visible { outline:2px solid var(--brand-text);outline-offset:1px; }
 #view-calendar .week-agenda { padding:16px; }
 .week-agenda-intro { margin:0 0 20px;color:var(--muted);font-size:11px;line-height:1.7; }
 .week-agenda-heading { display:flex;align-items:center;justify-content:space-between;gap:8px;margin-bottom:10px; }
 .week-agenda-heading h2 { display:flex;align-items:center;gap:8px;flex-wrap:wrap;margin:0;font-size:14px;line-height:1.7; }
 .week-agenda-heading h2 span { border-radius:5px;padding:2px 6px;background:var(--brand-soft);color:var(--brand-text);font-size:10px; }
 .week-agenda-heading>span { color:var(--muted);font-size:11px;white-space:nowrap; }
 .week-agenda-day+.week-agenda-day { border-top:1px solid var(--line);padding-top:18px; }
 .week-agenda-empty { margin:0 0 8px;padding:12px;background:#f8f9fc;border-radius:9px;font-size:12px;color:var(--muted); }
 #view-calendar .month-grid { gap:0; }
 #view-calendar .month-cell-compact { padding:2px 1px;border-top:1px solid var(--line);min-height:103px; }
 #view-calendar .month-day-button { align-content:start;justify-items:stretch;min-height:99px;gap:5px;padding:6px 2px;border-radius:7px;overflow:hidden; }
 #view-calendar .month-day-number { text-align:center; }
 #view-calendar .month-mobile-events { display:grid;gap:3px;min-width:0;width:100%;text-align:left; }
 #view-calendar .month-mobile-event { display:block;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;padding:2px 2px 2px 3px;border-left:2px solid var(--brand-text);border-radius:3px;color:var(--ink);background:var(--brand-soft);font-size:11px;line-height:1.5;font-weight:400; }
 #view-calendar .month-mobile-event.room531 { background:var(--coral-soft);border-color:var(--coral); }
 #view-calendar .month-mobile-event.room532 { background:var(--blue-soft);border-color:var(--blue); }
 #view-calendar .month-mobile-event.room541 { background:var(--green-soft);border-color:var(--green); }
 #view-calendar .month-mobile-event.room542 { background:#fff4df;border-color:#b88732; }
 #view-calendar .month-mobile-more { display:block;text-align:center;color:var(--muted);font-size:10px;line-height:1.5; }
 #view-calendar .selected .month-day-button { background:var(--brand-soft);border-color:var(--brand-text);color:var(--ink); }
 #view-calendar .selected .month-day-number { color:var(--brand-text); }
 #view-calendar .calendar-card[data-mobile-week-layout=timeline] .calendar-week-content { min-width:0;width:100%; }
 #view-calendar .calendar-card[data-mobile-week-layout=timeline] .calendar-scroll { grid-template-columns:44px minmax(0,1fr); }
 #view-calendar .calendar-card[data-mobile-week-layout=timeline] .timezone { font-size:8px;padding:0; }
 #view-calendar .calendar-card[data-mobile-week-layout=timeline] .event { padding:5px 3px;border-radius:5px;width:calc(100% / var(--calendar-days) / var(--lanes,1) - 4px);left:calc(var(--day) * 100% / var(--calendar-days) + var(--lane,0) * 100% / var(--calendar-days) / var(--lanes,1) + 2px); }
 #view-calendar .calendar-card[data-mobile-week-layout=timeline] .event strong { font-size:11px;line-height:1.5;overflow-wrap:anywhere; }
 #view-calendar .calendar-card[data-mobile-week-layout=timeline] .event small { font-size:9px;line-height:1.4;overflow-wrap:anywhere; }
}

@media(max-width:700px){
 #view-calendar .calendar-date-reserve { display:inline-flex;align-items:center;justify-content:center;flex-shrink:0;min-height:40px;padding:8px 12px;border:1px solid var(--brand-border);border-radius:9px;background:var(--brand-soft);color:var(--brand-text);font-size:12px;font-weight:600;line-height:1.4;white-space:nowrap;cursor:pointer; }
 #view-calendar .calendar-date-reserve:hover { border-color:var(--brand-text); }
 #view-calendar .calendar-date-reserve:focus-visible { outline:2px solid var(--brand-text);outline-offset:2px; }
 #view-calendar .calendar-date-reserve-icon { width:40px;padding:0;font-size:20px; }
 #view-calendar .week-agenda-actions { display:flex;align-items:center;gap:10px;flex-shrink:0; }
 #view-calendar .week-agenda-actions>span { color:var(--muted);font-size:11px;white-space:nowrap; }
 #view-calendar .agenda-heading>div { min-width:0; }
 #view-calendar .calendar-card[data-calendar-mode=month] .agenda-heading { align-items:flex-start; }
}

/* A bounded searchable dropdown replaces the unbounded row of room chips. */
#view-calendar .room-filters.calendar-space-filter { position:relative;flex:0 1 280px;width:280px;min-width:180px;max-width:100%;overflow:visible; }
.calendar-space-trigger { display:flex;align-items:center;gap:8px;width:100%;min-width:0;min-height:42px;padding:10px 12px;background:white;border:1px solid var(--line);border-radius:10px;color:var(--ink);font-size:12px;text-align:left;cursor:pointer; }
.calendar-space-caption { color:var(--muted);font-size:11px;flex-shrink:0; }
#calendar-space-value { flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap; }
.calendar-space-trigger:focus-visible,.calendar-space-trigger[aria-expanded=true] { outline:none;border-color:var(--brand-text);box-shadow:0 0 0 3px var(--brand-soft); }
.calendar-space-pop { position:fixed;z-index:80;display:flex;flex-direction:column;gap:8px;overflow:hidden;padding:12px;background:white;border:1px solid var(--line);border-radius:12px;box-shadow:0 12px 32px #24233b1a; }
.calendar-space-pop>label { font-size:11px;font-weight:600;color:var(--muted); }
#calendar-space-search { width:100%;min-width:0;flex-shrink:0;min-height:40px;padding:9px 11px;border:1px solid var(--field-border);border-radius:8px;background:#fff;color:var(--ink);font-size:13px; }
#calendar-space-search:hover { border-color:var(--field-border-hover); }
#calendar-space-search:focus { outline:none;border-color:var(--brand-text);box-shadow:0 0 0 3px var(--brand-soft); }
#calendar-space-count { margin:0;color:var(--muted);font-size:10px; }
#calendar-space-options { position:relative;min-height:0;overflow-y:auto;overscroll-behavior:contain;scrollbar-width:thin;scrollbar-color:var(--brand-border) transparent; }
.calendar-space-group { padding:12px 9px 6px;color:var(--muted);font-size:10px;font-weight:600;line-height:1.6;overflow-wrap:anywhere; }
.calendar-space-option { display:flex;align-items:center;justify-content:space-between;gap:8px;min-height:40px;padding:10px;border:1px solid transparent;border-radius:8px;font-size:12px;line-height:1.5;color:var(--ink);cursor:pointer; }
.calendar-space-option>span:first-child { min-width:0;overflow-wrap:anywhere; }
.calendar-space-option[aria-selected=true] { background:var(--brand-soft);color:var(--brand-text);font-weight:600; }
.calendar-space-option.is-focused { border-color:var(--brand-border);background:#f5f4fa; }
.calendar-space-option[aria-selected=true].is-focused { background:var(--brand-soft); }
.calendar-space-empty { padding:12px 9px;color:var(--muted);font-size:12px;line-height:1.7; }
@media(max-width:700px){#view-calendar .room-filters.calendar-space-filter { width:100%;min-width:0; }.calendar-space-trigger,.calendar-space-option { min-height:44px; }}

/* Two aligned rows: navigation/views, then filter/context/booking. */
#view-calendar { container-name:calendar-view;container-type:inline-size; }
#view-calendar .calendar-toolbar { display:grid;grid-template-columns:minmax(0,1fr);gap:14px;padding:16px; }
#view-calendar .calendar-toolbar-main { display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:center;gap:16px;min-width:0; }
#view-calendar .week-switcher { display:grid;grid-template-columns:32px minmax(0,1fr) 32px;gap:10px;min-width:0;width:max-content;max-width:100%;justify-self:start; }
#view-calendar .week-switcher strong { min-width:0;margin:0;text-align:center;font-size:16px;line-height:1.5;overflow-wrap:anywhere; }
#view-calendar .week-switcher .icon-button { width:32px;height:36px; }
#view-calendar .calendar-toolbar-views { display:flex;align-items:center;justify-content:flex-end;gap:12px;min-width:0; }
#view-calendar .calendar-surface-toggle { width:auto;min-width:0; }
#view-calendar .calendar-surface-toggle button { min-width:0;min-height:34px;padding:7px 11px;font-size:12px; }
#view-calendar .view-toggle { width:auto;margin:0;flex-shrink:0; }
#view-calendar .view-toggle button { min-width:34px;min-height:34px;padding:6px 10px;font-size:12px; }
#view-calendar .calendar-toolbar-controls { display:grid;grid-template-columns:minmax(180px,280px) minmax(0,1fr) auto;align-items:center;gap:16px;min-width:0;padding-top:14px;border-top:1px solid var(--line); }
#view-calendar .room-filters.calendar-space-filter { grid-column:1;width:100%;min-width:0; }
#view-calendar .calendar-booking-hint { grid-column:2;min-width:0;font-size:11px;line-height:1.7; }
#view-calendar .calendar-reserve { grid-column:3;width:auto;margin:0;min-height:42px;padding:9px 13px;font-size:12px;white-space:nowrap;justify-self:end; }
#view-calendar .calendar-toolbar-controls:has(.room-filters[hidden]) { grid-template-columns:minmax(0,1fr) auto; }
#view-calendar .calendar-toolbar-controls:has(.room-filters[hidden]) .calendar-booking-hint { grid-column:1; }
#view-calendar .calendar-toolbar-controls:has(.room-filters[hidden]) .calendar-reserve { grid-column:2; }
#view-calendar .calendar-week-content { min-width:0;width:100%; }
#view-calendar .calendar-scroll { grid-template-columns:52px minmax(0,1fr); }
#view-calendar .calendar-head .day { min-width:0;gap:6px; }
#view-calendar .calendar-head .day span { font-size:12px; }
#view-calendar .calendar-head .day strong { width:32px;height:32px;font-size:17px;flex-shrink:0; }
#view-calendar .time-labels span { right:8px;font-size:10px; }
@container calendar-view (max-width:760px){
 #view-calendar .calendar-toolbar-main { grid-template-columns:minmax(0,1fr);gap:12px; }
 #view-calendar .calendar-toolbar-views { justify-content:space-between; }
 #view-calendar .calendar-toolbar-controls { grid-template-columns:minmax(0,1fr) auto;gap:10px 12px; }
 #view-calendar .room-filters.calendar-space-filter { grid-column:1;grid-row:1; }
 #view-calendar .calendar-reserve { grid-column:2;grid-row:1; }
 #view-calendar .calendar-booking-hint { grid-column:1/-1;grid-row:2; }
 #view-calendar .calendar-toolbar-controls:has(.room-filters[hidden]) .calendar-booking-hint { grid-column:1;grid-row:1; }
}
@container calendar-view (max-width:540px){
 #view-calendar .calendar-head .day { flex-direction:column;justify-content:center;gap:3px; }
 #view-calendar .calendar-head .day span { font-size:11px; }
}
@container calendar-view (max-width:480px){
 #view-calendar .calendar-toolbar-controls { grid-template-columns:minmax(0,1fr); }
 #view-calendar .room-filters.calendar-space-filter { grid-column:1;grid-row:1; }
 #view-calendar .calendar-reserve { grid-column:1;grid-row:2;width:100%; }
 #view-calendar .calendar-booking-hint { grid-column:1;grid-row:3; }
 #view-calendar .calendar-toolbar-controls:has(.room-filters[hidden]) { grid-template-columns:minmax(0,1fr); }
 #view-calendar .calendar-toolbar-controls:has(.room-filters[hidden]) .calendar-reserve { grid-column:1;grid-row:1; }
 #view-calendar .calendar-toolbar-controls:has(.room-filters[hidden]) .calendar-booking-hint { grid-column:1;grid-row:2; }
}
@container calendar-view (max-width:380px){
 #view-calendar .calendar-toolbar-views { display:grid;grid-template-columns:minmax(0,1fr);gap:8px; }
 #view-calendar .calendar-surface-toggle,#view-calendar .view-toggle { width:100%; }
 #view-calendar .calendar-surface-toggle button,#view-calendar .view-toggle button { flex:1; }
}
@media(max-width:700px){
 #view-calendar .calendar-toolbar { padding:14px;gap:12px; }
 #view-calendar .calendar-surface-toggle button,#view-calendar .view-toggle button { min-height:38px; }
 #view-calendar .week-switcher strong { font-size:14px; }
 #view-calendar .calendar-reserve { min-height:44px; }
}