/* The overview uses one date and a clear start/end pair. */
#view-rooms .room-search-panel{container-name:room-search;container-type:inline-size;min-width:0}
#view-rooms .search-fields{display:grid;grid-template-columns:minmax(0,1.25fr) minmax(0,.9fr) minmax(0,1.1fr) auto;gap:16px;align-items:start}
#view-rooms .search-fields>.search-field{display:grid;grid-template-rows:20px 48px;grid-auto-rows:auto;align-content:start;gap:6px;min-width:0}
#view-rooms .search-fields>.search-field>:is(.time-error,.date-error){grid-row:3;margin:0;line-height:1.6}
#view-rooms .search-fields>:is(.search-field,.search-submit){grid-column:auto}
#view-rooms .search-fields .search-field>:is(#overview-date-label,#overview-start-label,#overview-end-label){display:flex;align-items:center;gap:5px;min-height:20px;line-height:20px;font-size:12px;font-weight:650}
#view-rooms .search-fields .search-submit{height:48px;min-height:48px;border-radius:12px;margin-top:26px;align-self:start;white-space:nowrap;max-width:100%}
#view-rooms .tp-trigger,.overview-date-trigger{width:100%;height:48px;display:flex;align-items:center;justify-content:space-between;gap:10px;padding:0 14px;border:1px solid var(--line);border-radius:12px;background:#fafafe;color:var(--ink);font-size:14px;font-weight:600;cursor:pointer}
#view-rooms .tp-trigger:hover,.overview-date-trigger:hover{background:white;border-color:var(--brand-border)}
#view-rooms .tp-trigger:focus-visible,.overview-date-trigger:focus-visible{outline:2px solid var(--brand-text);outline-offset:3px}
.overview-date-trigger svg{width:19px;height:19px;fill:none;stroke:var(--muted);stroke-width:1.7;flex-shrink:0}
.overview-end-field output{color:var(--brand-text);font-size:11px;font-weight:500;white-space:nowrap}
.overview-slot-note{font-size:11px;color:var(--muted);margin:12px 0 16px;line-height:1.7}
.overview-slot-error{color:#a53442;font-size:12px;margin:0 0 14px;line-height:1.7}
.overview-slot-error[hidden]{display:none}
.date-field{position:relative}
.overview-date-pop{position:absolute;top:calc(100% + 8px);left:0;z-index:40;width:328px;max-width:calc(100vw - 40px);padding:16px;border:1px solid var(--line);border-radius:16px;background:white;box-shadow:0 18px 48px #39335c24}
.overview-date-pop[hidden]{display:none}
.od-shortcuts{display:flex;align-items:center;gap:8px;padding-bottom:14px;border-bottom:1px solid var(--line)}
.od-shortcuts button{border:1px solid var(--brand-border);border-radius:8px;color:var(--brand-text);background:var(--brand-soft);padding:7px 13px;cursor:pointer;font-size:12px}
.od-shortcuts span{margin-left:auto;font-size:10px;color:var(--muted)}
.od-heading{display:flex;align-items:center;justify-content:space-between;margin:12px 0 8px}
.od-heading strong{font-size:14px;font-weight:650}.od-heading button{width:32px;height:32px;background:white;border:0;border-radius:8px;font-size:25px;color:var(--ink);cursor:pointer}
.od-calendar{width:100%;border-collapse:separate;border-spacing:2px;table-layout:fixed}.od-calendar th{font-size:11px;font-weight:500;color:var(--muted);height:28px}.od-calendar td{text-align:center;padding:0}
.od-calendar button{position:relative;width:100%;height:36px;padding:0;border:1px solid transparent;border-radius:9px;background:white;color:var(--ink);font-size:12px;cursor:pointer;font-variant-numeric:tabular-nums}
.od-calendar button.od-adjacent{color:var(--muted)}.od-calendar button:hover:not(:disabled){background:var(--brand-soft);border-color:var(--brand-border)}
.od-calendar button[aria-current=date]::after{content:"";position:absolute;bottom:3px;left:calc(50% - 2px);width:4px;height:4px;border-radius:50%;background:var(--brand-text)}
.od-calendar button[aria-pressed=true]{color:var(--brand-on);background:var(--brand-primary);font-weight:700}.od-calendar button[aria-pressed=true]::after{background:var(--brand-on)}
.od-calendar button:disabled,.od-shortcuts button:disabled,.od-heading button:disabled{color:#b9b8c5;background:#f7f7fa;border-color:transparent;cursor:default}
.od-calendar button:focus-visible,.od-heading button:focus-visible,.od-shortcuts button:focus-visible{outline:2px solid var(--brand-text);outline-offset:1px}
.od-footnote{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-top:12px;padding-top:12px;border-top:1px solid var(--line);font-size:10px;color:var(--muted)}.od-footnote span:first-child{display:flex;align-items:center;gap:5px}.od-footnote i{width:5px;height:5px;border-radius:50%;background:var(--brand-primary)}
#view-rooms .overview-end-field .tp-grid{grid-template-columns:repeat(3,minmax(0,1fr))}#view-rooms .tp-grid small{display:block;font-size:9px;font-weight:400;margin-top:4px;white-space:nowrap}
#view-rooms .tp-pop{z-index:40}#view-rooms .chip:disabled{opacity:.45;cursor:default}
@media(max-width:1150px){#view-rooms .search-fields{grid-template-columns:minmax(0,1.2fr) repeat(2,minmax(0,1fr))}#view-rooms .search-fields .search-submit{grid-column:1/-1;margin-top:0;justify-self:end}}
@media(max-width:700px){#view-rooms .search-fields{grid-template-columns:repeat(2,minmax(0,1fr));gap:14px 10px}#view-rooms .search-fields>.date-field{grid-column:1/-1}#view-rooms .search-fields .search-submit{grid-column:1/-1;margin-top:0}.overview-date-pop{width:min(328px,calc(100vw - 66px));padding:12px}#view-rooms .search-fields .search-submit{width:100%}#view-rooms .search-fields .search-field>:is(#overview-date-label,#overview-start-label,#overview-end-label){font-size:11px}.overview-end-field output{font-size:10px}#view-rooms .tp-trigger{font-size:14px}#view-rooms .overview-end-field .tp-pop{left:auto;right:0}}
/* Floor selector: custom list opens below the visible current selection. */
#view-rooms .overview-floor-filter { display:grid;grid-template-columns:minmax(0,280px);justify-content:start;gap:8px;margin:22px 0 18px; }
#view-rooms .overview-floor-filter > label { font-size:11px;font-weight:600;line-height:1.5;color:var(--muted);padding-left:2px; }
.overview-floor-control { position:relative;display:block;min-width:0;border-radius:11px; }
#view-rooms .overview-floor-trigger {
  appearance:none;-webkit-appearance:none;display:block;width:100%;min-width:0;
  min-height:44px;padding:10px 39px 10px 41px;
  border:1px solid #e0e2ec;border-radius:11px;background:white;
  color:var(--ink);font-size:13px;font-weight:600;line-height:1.5;
  text-overflow:ellipsis;cursor:pointer;box-shadow:0 2px 5px #24233b03;
}
.overview-floor-control::before,.overview-floor-control::after { content:"";position:absolute;top:50%;pointer-events:none;transform:translateY(-50%); }
.overview-floor-control::before {
  left:14px;width:17px;height:17px;background:var(--brand-text);
  -webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M4 21V5a2 2 0 0 1 2-2h12a2 2 0 0 1 2 2v16M2 21h20M10 21v-4h4v4M8 7h1m6 0h1M8 11h1m6 0h1'/%3E%3C/svg%3E") center/contain no-repeat;
  mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M4 21V5a2 2 0 0 1 2-2h12a2 2 0 0 1 2 2v16M2 21h20M10 21v-4h4v4M8 7h1m6 0h1M8 11h1m6 0h1'/%3E%3C/svg%3E") center/contain no-repeat;
}
.overview-floor-control::after {
  right:15px;width:12px;height:12px;background:var(--muted);
  -webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='m4 6 4 4 4-4' fill='none' stroke='black' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center/contain no-repeat;
  mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='m4 6 4 4 4-4' fill='none' stroke='black' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center/contain no-repeat;
}
#view-rooms .overview-floor-trigger:hover { border-color:var(--brand-border);background:#fdfcfe; }
.overview-floor-control:focus-within { box-shadow:0 0 0 3px var(--brand-soft); }
#view-rooms .overview-floor-trigger:focus { outline:none;border-color:var(--brand-text); }
@media(prefers-reduced-motion:no-preference) { .overview-floor-control,.overview-floor-trigger { transition:border-color .15s,box-shadow .15s,background-color .15s; } }
@media(max-width:700px) { #view-rooms .overview-floor-filter { grid-template-columns:minmax(0,1fr); } }

.overview-floor-control::before,.overview-floor-control::after { z-index:1; }
.overview-floor-trigger { text-align:left; }
#overview-floor-value { display:block;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap; }
#view-rooms .overview-floor-trigger[aria-expanded=true] { border-color:var(--brand-text);background:white; }
.overview-floor-control:has(.overview-floor-trigger[aria-expanded=true])::after { transform:translateY(-50%) rotate(180deg); }
.overview-floor-options { position:absolute;top:calc(100% + 8px);left:0;width:100%;z-index:35;max-height:280px;overflow-y:auto;overscroll-behavior-y:contain;padding:7px;border:1px solid var(--line);border-radius:12px;background:white;box-shadow:0 12px 32px #24233b1a;scrollbar-width:thin;scrollbar-color:var(--brand-border) transparent; }
.overview-floor-options[hidden] { display:none; }
.overview-floor-group + .overview-floor-group { margin-top:6px;padding-top:6px;border-top:1px solid var(--line); }
.overview-floor-group-label { padding:7px 10px;color:var(--muted);font-size:10px;font-weight:600; }
.overview-floor-option { display:flex;align-items:center;gap:10px;min-height:40px;padding:10px;border:1px solid transparent;border-radius:8px;color:var(--ink);font-size:12px;line-height:1.5;cursor:pointer; }
.overview-floor-option > span:first-child { flex:1;min-width:0;overflow-wrap:anywhere; }
.overview-floor-option[aria-selected=true] { background:var(--brand-soft);color:var(--brand-text);font-weight:600; }
.overview-floor-option.is-focused { border-color:var(--brand-border);background:#f5f4fa; }
.overview-floor-option[aria-selected=true].is-focused { background:var(--brand-soft);border-color:var(--brand-border); }
.overview-floor-check { color:var(--brand-text);font-size:13px;font-weight:700; }
.overview-floor-empty { margin:0;padding:12px 10px;color:var(--muted);font-size:12px; }
@media(max-width:700px) { .overview-floor-option { min-height:44px; } }

@media(max-width:360px){#view-rooms .search-fields{grid-template-columns:minmax(0,1fr)}#view-rooms .search-fields>.search-field{grid-column:1/-1}}
#overview-date-value{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
#view-rooms .room-search-panel .search-chips{flex-wrap:wrap;gap:12px}
#view-rooms .room-search-panel .chip-group{flex-wrap:wrap;min-width:0}
#view-rooms .room-search-panel .search-tools{flex-wrap:wrap;min-width:0;max-width:100%}
@container room-search (max-width:560px){#view-rooms .room-search-panel .search-tools{width:100%;justify-content:space-between}#view-rooms .room-search-panel .more-filter-button{max-width:calc(100% - 56px);height:auto;min-height:34px;white-space:normal;text-align:left}}

/* Panel width takes precedence over viewport fallbacks when the sidebar changes. */
@container room-search (max-width:860px){#view-rooms .search-fields{grid-template-columns:minmax(0,1.2fr) repeat(2,minmax(0,1fr))}#view-rooms .search-fields .search-submit{grid-column:1/-1;margin-top:0;justify-self:end}}
@container room-search (max-width:560px){#view-rooms .search-fields{grid-template-columns:repeat(2,minmax(0,1fr));gap:14px 10px}#view-rooms .search-fields>.date-field{grid-column:1/-1}#view-rooms .search-fields .search-submit{width:100%;justify-self:stretch}}
@container room-search (max-width:300px){#view-rooms .search-fields{grid-template-columns:minmax(0,1fr)}#view-rooms .search-fields>.search-field{grid-column:1/-1}}

/* Overview hierarchy: compact introduction and consistent local actions. */
#view-rooms .section-intro { padding:16px 20px;margin-bottom:16px;border-radius:14px; }
#view-rooms .section-intro::after { display:none; }
#view-rooms .section-intro>div { display:flex;align-items:center;flex-wrap:wrap;gap:6px 16px;min-width:0; }
#view-rooms .section-intro p { font-size:13px;line-height:1.7; }
#view-rooms .room-search-panel { padding:20px; }
#view-rooms .search-fields .search-submit { padding:0 18px;font-size:13px;gap:12px; }
#view-rooms .search-prompt { margin:12px 0 0;padding:0 2px;border:0;background:transparent;text-align:left;justify-items:start; }
#view-rooms .search-prompt strong { font-size:12px;line-height:1.7;font-weight:400;color:var(--muted); }
#view-rooms .result-heading>strong { font-size:18px; }
#view-rooms .result-heading .result-count { font-size:13px;font-weight:500;line-height:1.7;margin-top:6px; }
#view-rooms .display-switch { padding:3px;border-radius:10px;box-shadow:none; }
#view-rooms .display-switch button { min-height:34px;padding:7px 12px;border-radius:7px;font-size:12px; }
#view-rooms .display-switch button.active { color:var(--brand-text);background:var(--brand-soft);box-shadow:none; }
#view-rooms .room-body { padding:16px 18px; }
#view-rooms .room-title-row { align-items:center;gap:10px; }
#view-rooms .room-title-row h3 { flex:1;min-width:0;font-size:17px;line-height:1.5;overflow-wrap:anywhere; }
#view-rooms .capacity { flex-shrink:0;font-size:12px; }
#view-rooms .room-location { margin:5px 0 0;font-size:12px;line-height:1.6; }
#view-rooms .amenities { padding:12px 0; }
#view-rooms .room-card-footer { align-items:center;padding-top:12px;gap:10px; }
#view-rooms .room-card-footer>small { font-size:12px;line-height:1.6;min-width:0;overflow-wrap:anywhere; }
#view-rooms .room-card-actions { gap:8px; }
#view-rooms .room-card-actions button { display:inline-flex;align-items:center;justify-content:center;min-height:36px;padding:8px 12px;border:1px solid var(--line);border-radius:8px;background:#f7f8fb;color:var(--ink);font-size:12px;font-weight:600;line-height:1.5;cursor:pointer; }
#view-rooms .room-card-actions .overview-book-action { border-color:var(--brand-primary);background:var(--brand-primary);color:var(--brand-on); }
#view-rooms .room-card-actions button:hover:not(:disabled) { border-color:var(--brand-text);filter:brightness(.98); }
#view-rooms .room-card-actions button:focus-visible,#view-rooms .display-switch button:focus-visible { outline:2px solid var(--brand-text);outline-offset:2px; }
#view-rooms .room-card-actions button:disabled { background:#f1f2f5;border-color:var(--line);color:var(--muted);cursor:not-allowed; }
@media(max-width:700px){
 #view-rooms .section-intro { padding:12px 14px; }
 #view-rooms .room-search-panel { padding:16px; }
 #view-rooms .room-body { padding:14px; }
 #view-rooms .display-switch button,#view-rooms .room-card-actions button { min-height:44px; }
 #view-rooms .room-card-footer { align-items:stretch; }
 #view-rooms .room-card-footer>small { flex-basis:100%; }
 #view-rooms .room-card-actions { margin-left:auto; }
 #view-rooms .room-title-row { flex-wrap:wrap; }
}
