#crm-reservations {
  --d-paper: var(--surface-1);
  --d-ink: var(--text);
  --d-muted: var(--text-muted);
  --d-line: #c7beb1;
  --d-gold: #795a26;
  --d-soft: #eee7da;
  --d-error: #9c352d;
  container: reservations / inline-size;
  max-width: 1700px;
  margin: auto;
  font: calc(14px * var(--fs, 1))/1.5 'DM Sans', sans-serif;
  color: var(--d-ink);
}
[data-theme="dark"] #crm-reservations {
  --d-line: #5f594f;
  --d-gold: #d7ba82;
  --d-soft: #2e291f;
  --d-error: #f3aaa2;
  color-scheme: dark;
}
#crm-reservations *, #crm-reservations *::before, #crm-reservations *::after { box-sizing: border-box; }
#crm-reservations [hidden] { display: none !important; }
#crm-reservations h1 { font: 500 calc(32px * var(--fs, 1))/1.1 'Cormorant Garamond', Georgia, serif; }
#crm-reservations h2 { font: 500 calc(28px * var(--fs, 1))/1.2 'Cormorant Garamond', Georgia, serif; margin: 0 0 16px; }
#crm-reservations h3 { font-size: calc(16px * var(--fs, 1)); margin: 0 0 8px; }
#crm-reservations p { overflow-wrap: anywhere; }
#crm-reservations .dining-muted, #crm-reservations .muted, #crm-reservations small { color: var(--d-muted); font-size: .92em; }
#crm-reservations .error { color: var(--d-error); }
#crm-reservations button, #crm-reservations input, #crm-reservations select, #crm-reservations textarea { font: inherit; font-weight: 400; line-height: 1.4; }
#crm-reservations button, #crm-reservations input, #crm-reservations select {
  min-height: 44px;
  border-radius: 5px;
  border: 1px solid var(--d-line);
}
#crm-reservations button { background: var(--d-ink); color: var(--d-paper); padding: 9px 15px; cursor: pointer; }
#crm-reservations button.secondary { background: var(--d-paper); color: var(--d-ink); }
#crm-reservations button.text-button { color: var(--d-gold); background: transparent; border-color: transparent; }
#crm-reservations button:disabled { cursor: default; opacity: .55; }
#crm-reservations input, #crm-reservations select, #crm-reservations textarea { color: var(--d-ink); background: var(--d-paper); padding: 9px 11px; min-width: 0; max-width: 100%; }
#crm-reservations textarea { border: 1px solid var(--d-line); border-radius: 5px; resize: vertical; width: 100%; }
#crm-reservations input[type="checkbox"] { width: 24px; height: 24px; min-height: 24px; accent-color: var(--d-gold); }
#crm-reservations label { display: block; margin: 0 0 12px; font-weight: 500; }
#crm-reservations label input:not([type="checkbox"]), #crm-reservations label select { display: block; margin-top: 5px; width: 100%; }
#crm-reservations :focus-visible { outline: 3px solid var(--d-gold); outline-offset: 3px; }
#crm-reservations a { color: var(--d-gold); text-underline-offset: 4px; }
#crm-reservations .dining-toolbar { gap: 12px; margin: 0 0 16px; align-items: end; }
#crm-reservations .dining-toolbar h1 { margin: 0; }
#crm-reservations .dining-header { align-items: center; }
#crm-reservations .dining-heading { margin-right: auto; }
#crm-reservations .dining-heading p { margin: 6px 0 0; }
#crm-reservations #dining-filters { align-items: end; }
#crm-reservations .dining-tabs button[aria-pressed="true"] { background: var(--d-ink); color: var(--d-paper); border-color: var(--d-ink); }
#crm-reservations .dining-detail .actions { display: flex; flex-wrap: wrap; gap: 8px; margin: 16px 0; }
#crm-reservations .dining-toolbar label { margin: 0; }
#crm-reservations .dining-nav { display: flex; gap: 4px; flex-wrap: wrap; border-bottom: 1px solid var(--d-line); margin: 16px 0; }
#crm-reservations .dining-nav button { color: var(--d-muted); background: transparent; border: 0; border-bottom: 3px solid transparent; border-radius: 0; margin-bottom: -1px; }
#crm-reservations .dining-nav button[aria-selected="true"], #crm-reservations .dining-nav button[aria-pressed="true"] { color: var(--d-ink); border-bottom-color: var(--d-gold); font-weight: 600; }
#crm-reservations .dining-summary { gap: 12px 28px; padding: 12px 0; margin: 0 0 16px; }
#crm-reservations .dining-summary span { color: var(--d-muted); font-size: calc(12px * var(--fs, 1)); }
#crm-reservations .dining-summary strong { display: inline-block; font-size: calc(25px * var(--fs, 1)); color: var(--d-ink); font-weight: 500; }
#crm-reservations .dining-alerts { background: var(--d-soft); color: var(--d-ink); border-left: 3px solid var(--d-gold); border-radius: 0; }
#crm-reservations .dining-alerts p { margin: 6px 0; }
#crm-reservations .dining-search-tools { display: flex; gap: 12px; align-items: end; flex-wrap: wrap; margin: 16px 0; }
#crm-reservations .dining-search-tools label { margin: 0; }
#crm-reservations .dining-date-field { flex: 0 1 180px; }
#crm-reservations .dining-find-field { flex: 1 1 220px; }
#crm-reservations .dining-scope-field { flex: 0 1 180px; }
#crm-reservations .dining-search-tools input[type="search"] { min-width: 200px; }
#crm-reservations .dining-view { min-width: 0; }
#crm-reservations .dining-booking-list { width: 100%; overflow: auto; background: var(--d-paper); border: 1px solid var(--d-line); border-radius: 6px; }
#crm-reservations .dining-booking-list table { min-width: 740px; }
#crm-reservations table { font-size: inherit; }
#crm-reservations th { color: var(--d-muted); font-size: calc(12px * var(--fs, 1)); font-weight: 500; background: var(--surface-2); }
#crm-reservations td, #crm-reservations th { padding: 12px 14px; vertical-align: top; }
#crm-reservations td button { min-height: 44px; padding: 7px 10px; }
#crm-reservations .dining-row { padding: 18px; }
#crm-reservations .dining-row .actions { gap: 8px; }
#crm-reservations .dining-layout { grid-template-columns: minmax(0, 1.5fr) minmax(270px, 1fr); }
#crm-reservations .dining-layout > * { min-width: 0; }
#crm-reservations .dining-workspace[data-view="floor"] { display: grid; grid-template-columns: minmax(0, 1fr); gap: 24px; }
#crm-reservations .dining-workspace > * { min-width: 0; }
#crm-reservations #dining-view-floor { container: floor-panel / inline-size; }
#crm-reservations .dining-map { background: var(--d-paper); min-width: 600px; height: 640px; }
#crm-reservations .dining-map[data-area="dining"] { min-width: 680px; }
#crm-reservations .dining-map[data-area="bar"] { min-width: 736px; }
#crm-reservations .dining-map .table-seat { width: 64px; height: 48px; min-height: 48px; font-size: 14px; line-height: 1.25; padding: 4px; border-width: 2px; }
#crm-reservations .dining-map .table-seat[data-shape="round"] { width: 64px; height: 64px; border-radius: 50%; }
#crm-reservations .dining-map .table-seat[data-shape="seat"] { width: 44px; height: 44px; min-height: 44px; font-size: 11px; padding: 0; }
#crm-reservations .dining-map[data-area="sushi"] .table-seat[data-shape="seat"] { width: 56px; }
#crm-reservations .dining-map .table-seat strong, #crm-reservations .dining-map .table-meta { display: block; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
#crm-reservations .dining-map .table-meta { font-size: 11px; margin-top: 2px; }
#crm-reservations .dining-map .table-seat[data-shape="seat"] .table-meta { font-size: 10px; }
#crm-reservations .dining-booking-list > p { margin: 0; padding: 18px; }
#crm-reservations .dining-map .table-seat[data-state="ready"], #crm-reservations .dining-legend-swatch[data-state="ready"] { background: #e9eee7; color: #233329; border-color: #667969; }
#crm-reservations .dining-map .table-seat[data-state="check"], #crm-reservations .dining-legend-swatch[data-state="check"] { background: #f6f2e9; color: #514b3d; border-color: #8b7c61; border-style: dashed; }
#crm-reservations .dining-map .table-seat[data-state="unassigned"], #crm-reservations .dining-legend-swatch[data-state="unassigned"] { background: #f2f2ef; color: #41443e; border-color: #9a9b92; }
#crm-reservations .dining-map .table-seat[data-state="reserved"], #crm-reservations .dining-legend-swatch[data-state="reserved"] { background: #e1e7ee; color: #263e55; border-color: #6d849d; }
#crm-reservations .dining-map .table-seat[data-state="seated"], #crm-reservations .dining-legend-swatch[data-state="seated"] { background: #333a43; color: white; border-color: #333a43; }
#crm-reservations .dining-map .table-seat[data-state="cleaning"], #crm-reservations .dining-legend-swatch[data-state="cleaning"] { background: #eedbb4; color: #47351b; border-color: #94713e; }
#crm-reservations .dining-map .table-seat[data-state="blocked"], #crm-reservations .dining-legend-swatch[data-state="blocked"] { background: #eee0df; color: #6b3936; border-color: #8b544c; }
#crm-reservations .dining-map .table-seat[aria-pressed="true"] { outline: 3px solid var(--d-gold); outline-offset: 3px; z-index: 1; }
#crm-reservations .dining-legend { gap: 8px 18px; margin: 0 0 12px; font-size: .85em; }
#crm-reservations .dining-legend-item { display: inline-flex; align-items: center; gap: 6px; }
#crm-reservations .dining-legend-swatch { display: inline-block; width: 16px; height: 16px; border: 2px solid; border-radius: 3px; flex: none; }
#crm-reservations .dining-pan-hint { display: none; }
@container floor-panel (max-width: 735px) { #crm-reservations .dining-pan-hint { display: inline; } }
#crm-reservations .dining-timeline { overflow: auto; border: 1px solid var(--d-line); background: var(--d-paper); border-radius: 6px; }
#crm-reservations .dining-timeline-head, #crm-reservations .dining-timeline-row { display: grid; grid-template-columns: 90px minmax(650px, 1fr); min-width: 780px; padding-right: 36px; border-bottom: 1px solid var(--d-line); }
#crm-reservations .dining-timeline-head > span, #crm-reservations .dining-timeline-row > strong { padding: 12px; position: sticky; left: 0; z-index: 1; background: var(--d-paper); }
#crm-reservations .dining-timeline-row > strong small { display: block; font-weight: 400; }
#crm-reservations .dining-timeline-scale { position: relative; height: 46px; }
#crm-reservations .dining-timeline-scale span { position: absolute; top: 13px; transform: translateX(-50%); white-space: nowrap; font-size: calc(12px * var(--fs, 1)); }
#crm-reservations .dining-timeline-track { position: relative; min-height: calc(76px * var(--fs, 1)); background-image: linear-gradient(to right, var(--d-line) 1px, transparent 1px); background-size: var(--dining-hour-width, 20%) 100%; }
#crm-reservations .dining-timeline-booking { position: absolute; top: 7px; text-align: left; overflow: hidden; padding: 6px 10px; min-height: calc(60px * var(--fs, 1)); background: var(--d-soft); color: var(--d-ink); }
#crm-reservations .dining-timeline-booking strong, #crm-reservations .dining-timeline-booking span { display: block; white-space: nowrap; text-overflow: ellipsis; overflow: hidden; }
#crm-reservations .dining-timeline-booking[data-status="seated"] { background: var(--d-ink); color: var(--d-paper); }
#crm-reservations .dining-detail { min-width: 0; padding: 20px; background: var(--d-paper); border: 1px solid var(--d-line); border-radius: 6px; }
#crm-reservations .dining-detail dl { display: grid; grid-template-columns: minmax(100px, .4fr) minmax(0, 1fr); gap: 8px 16px; }
#crm-reservations .dining-detail dd { margin: 0; overflow-wrap: anywhere; }
#crm-reservations .dining-detail dt { color: var(--d-muted); }
#crm-reservations .dining-detail h3 { margin-top: 24px; }
#crm-reservations .dining-detail h3:first-child { margin-top: 0; }
#crm-reservations .dining-messages { max-height: 260px; overflow: auto; }
#crm-reservations .dining-message { border-left: 3px solid var(--d-line); padding: 1px 12px 10px; margin: 12px 0; }
#crm-reservations .dining-message p { margin: 8px 0; white-space: pre-wrap; }
#crm-reservations .dining-audit li { padding: 6px 0; overflow-wrap: anywhere; }
#crm-reservations .dining-guest-lookup { border-bottom: 1px solid var(--d-line); padding-bottom: 20px; margin-bottom: 20px; }
#crm-reservations #dining-guest-results button { display: block; width: 100%; text-align: left; margin: 6px 0; }
#crm-reservations .dining-detail ul, #crm-reservations .dining-detail ol { padding-left: 22px; }
#crm-reservations dialog { background: var(--d-paper); color: var(--d-ink); max-width: 850px; max-height: calc(100dvh - 40px); width: calc(100% - 40px); margin: auto; padding: 24px; }
#crm-reservations dialog .dining-toolbar { position: sticky; top: -24px; background: var(--d-paper); padding: 16px 0; z-index: 2; }
#crm-reservations dialog .dining-toolbar h2 { margin: 0; }
#crm-reservations fieldset { min-width: 0; border: 1px solid var(--d-line); border-radius: 5px; margin: 16px 0; padding: 16px; }
#crm-reservations legend { padding: 0 6px; font-weight: 500; }
#crm-reservations .dining-table-scroll input { max-width: 110px; }
#crm-reservations .dining-check { display: inline-flex; align-items: center; justify-content: center; min-width: 44px; min-height: 44px; margin: 0; }
#crm-reservations .dining-form-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; }
#crm-reservations .dining-form-grid > label { margin: 0; }
#crm-reservations .mui-rs-toolbar, #crm-reservations .mui-rs-actions { display: flex; flex-wrap: wrap; align-items: end; gap: 12px; margin: 16px 0; }
#crm-reservations .mui-rs-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; }
#crm-reservations .mui-rs-list { overflow-x: auto; margin: 20px 0; }
#crm-reservations .mui-rs-error { color: var(--d-error); }
#crm-reservations .mui-rs-notice { background: var(--d-soft); border-left: 3px solid var(--d-gold); padding: 12px 16px; margin: 16px 0; }
#crm-reservations .mui-rs-section { margin: 28px 0; }
#crm-reservations .mui-rs-exception { border-top: 1px solid var(--d-line); padding: 12px 0; }
#crm-reservations .mui-rs-exception summary { min-height: 44px; padding: 9px 0; cursor: pointer; }
#crm-reservations .mui-rs-fields { margin-top: 16px; }
#crm-reservations .mui-rs-warning { background: var(--d-soft); border-left: 3px solid var(--d-gold); padding: 12px 16px; }
#crm-reservations .mui-rs-layout { display: grid; grid-template-columns: minmax(0, 1fr); gap: 24px; align-items: start; }
#crm-reservations .mui-rs-layout > * { min-width: 0; }
#crm-reservations .mui-rs-map-wrap { overflow: auto; border: 1px solid var(--d-line); border-radius: 5px; overscroll-behavior: contain; }
#crm-reservations .mui-rs-map { position: relative; min-width: 600px; height: 600px; background: var(--surface-2); }
#crm-reservations .mui-rs-map[data-area="bar"] { min-width: 736px; }
#crm-reservations .mui-rs-table { position: absolute; transform: translate(-50%, -50%); width: 44px; height: 44px; min-height: 44px; padding: 2px; background: var(--d-paper); color: var(--d-ink); font-size: 11px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
#crm-reservations .mui-rs-table[data-shape="round"], #crm-reservations .mui-rs-table[data-shape="seat"] { border-radius: 50%; }
#crm-reservations .mui-rs-table[aria-pressed="true"] { background: var(--d-ink); color: var(--d-paper); outline: 3px solid var(--d-gold); outline-offset: 2px; z-index: 1; }
#crm-reservations .mui-rs-layout-toolbar { display: flex; flex-wrap: wrap; align-items: center; gap: 10px; margin: 12px 0; }
#crm-reservations .mui-rs-layout-editing { outline: 3px dashed var(--d-gold); outline-offset: -3px; }
#crm-reservations .mui-rs-layout-editing .mui-rs-table { touch-action: none; cursor: grab; }
#crm-reservations .mui-rs-layout-editing .mui-rs-table.is-dragging { cursor: grabbing; outline: 3px solid var(--d-gold); z-index: 3; }
#crm-reservations .mui-rs-map[data-area="dining"] { width: 100%; min-width: 700px; height: auto; aspect-ratio: 1.35; }
#crm-reservations .mui-rs-map[data-area="bar"] { width: 100%; min-width: 860px; height: auto; aspect-ratio: 1.42; }
#crm-reservations .mui-rs-table[data-shape="round"] { width: 56px; height: 56px; border-radius: 50%; }
#crm-reservations .mui-rs-table[data-shape="rect"][data-orientation="landscape"] { width: 60px; height: 44px; border-radius: 5px; }
#crm-reservations .mui-rs-table[data-shape="rect"][data-orientation="portrait"] { width: 44px; height: 58px; border-radius: 5px; }
#crm-reservations #dining-view-setup > details { margin: 16px 0; border-bottom: 1px solid var(--d-line); padding-bottom: 12px; }
#crm-reservations #dining-view-setup > details > summary { min-height: 44px; padding: 10px 0; cursor: pointer; }
#crm-reservations #dining-current-combos > div, #crm-reservations #dining-current-blocks > div { display: flex; gap: 12px; align-items: center; flex-wrap: wrap; padding: 6px 0; }
#crm-reservations.dining-focus { position: fixed; inset: 0; z-index: 1200; max-width: none; margin: 0; padding: max(12px, env(safe-area-inset-top)) max(12px, env(safe-area-inset-right)) max(12px, env(safe-area-inset-bottom)) max(12px, env(safe-area-inset-left)); overflow: auto; background: var(--d-paper); }
#crm-reservations.dining-focus #dining-root { display: grid; grid-template-columns: 250px minmax(0, 1fr); gap: 8px 12px; }
#crm-reservations.dining-focus #dining-root > .dining-toolbar:first-child,
#crm-reservations.dining-focus .dining-search-tools label:not(:has(#dining-date)),
#crm-reservations.dining-focus #dining-today,
#crm-reservations.dining-focus #dining-search-range,
#crm-reservations.dining-focus #dining-summary,
#crm-reservations.dining-focus #dining-alerts,
#crm-reservations.dining-focus #dining-status:not(.error),
#crm-reservations.dining-focus .dining-nav { display: none !important; }
#crm-reservations.dining-focus .dining-search-tools { grid-column: 1; gap: 8px; margin: 0; align-items: center; }
#crm-reservations.dining-focus .dining-search-tools label { flex: 1; font-size: 0; }
#crm-reservations.dining-focus #dining-date { font-size: 14px; margin: 0; }
#crm-reservations.dining-focus #dining-filters { grid-column: 2; margin: 0; gap: 8px; }
#crm-reservations.dining-focus #dining-filters > label { font-size: 0; }
#crm-reservations.dining-focus #dining-filter { font-size: 14px; margin: 0; }
#crm-reservations.dining-focus #dining-workspace { grid-column: 1 / -1; grid-template-columns: minmax(0, 1fr); gap: 0; }
#crm-reservations.dining-focus #dining-status.error { grid-column: 1 / -1; }
#crm-reservations.dining-focus .dining-legend { margin: 2px 0 8px; }
#crm-reservations.dining-focus .dining-map-wrap { max-height: calc(100dvh - 120px); overscroll-behavior: contain; }
#crm-reservations.dining-focus .dining-map { height: max(600px, calc(100dvh - 132px)); }
#crm-reservations.dining-focus .dining-map .table-seat { min-height: 48px; height: 48px; }
#crm-reservations.dining-focus .dining-map .table-seat[data-shape="round"] { height: 58px; width: 58px; }
#crm-reservations.dining-focus .dining-map .table-seat[data-shape="seat"] { min-height: 44px; height: 44px; }
#crm-reservations.dining-focus #dining-view-list { display: none; }
#crm-reservations.dining-focus[data-table-selected="true"] #dining-view-list { display: block; position: fixed; right: max(16px, env(safe-area-inset-right)); bottom: max(16px, env(safe-area-inset-bottom)); z-index: 2; width: min(360px, calc(100vw - 32px)); max-height: 65dvh; overflow: auto; background: var(--d-paper); padding: 12px; border: 2px solid var(--d-gold); border-radius: 8px; box-shadow: 0 8px 28px #0003; }
#crm-reservations.dining-focus #dining-clear-table { margin-bottom: 12px; }
@media (max-width: 980px) {
  #crm-reservations.dining-focus #dining-root { grid-template-columns: 1fr; }
  #crm-reservations.dining-focus #dining-filters { grid-column: 1; }
  #crm-reservations.dining-focus .dining-search-tools { max-width: 250px; }
}
@container reservations (min-width: 1360px) {
  #crm-reservations .dining-workspace[data-view="floor"] { grid-template-columns: minmax(900px, 1fr) 360px; }
  #crm-reservations .mui-rs-layout { grid-template-columns: minmax(736px, 1fr) 360px; }
}
@container reservations (max-width: 640px) {
  #crm-reservations .dining-form-grid, #crm-reservations .mui-rs-grid { grid-template-columns: 1fr; }
}
@media (max-width: 1200px) { #page-reservations { padding: 16px; } }
@media (max-width: 900px) { #page-reservations { padding: 12px; } }
@media (max-width: 700px) {
  #crm-reservations .dining-toolbar h1 { width: 100%; font-size: calc(28px * var(--fs, 1)); }
  #crm-reservations .dining-toolbar, #crm-reservations .dining-search-tools { gap: 10px; }
  #crm-reservations .dining-search-tools label { flex-basis: 100%; }
  #crm-reservations .dining-search-tools input[type="search"] { min-width: 0; width: 100%; }
  #crm-reservations .dining-form-grid, #crm-reservations .mui-rs-grid { grid-template-columns: 1fr; }
  #crm-reservations .dining-nav { gap: 0; }
  #crm-reservations .dining-nav button { padding: 10px 11px; }
  #crm-reservations dialog { width: calc(100% - 24px); padding: 16px; max-height: calc(100dvh - 24px); }
  #crm-reservations dialog .dining-toolbar { top: -16px; }
  #crm-reservations input, #crm-reservations select, #crm-reservations textarea { font-size: max(16px, calc(14px * var(--fs, 1))); }
  #crm-reservations .dining-detail { padding: 16px; }
  #crm-reservations .dining-detail dl { grid-template-columns: 1fr; gap: 4px; }
  #crm-reservations .dining-detail dd { margin-bottom: 10px; }
}

/* Service controls stay beside the room; the room itself never pans. */
#crm-reservations .dining-workspace[data-view="floor"] { display: block; }
#crm-reservations .dining-host-toolbar { display: flex; justify-content: space-between; gap: 12px; align-items: center; margin: 12px 0 0; }
#crm-reservations .dining-host-toolbar p { margin: 0; }
#crm-reservations .dining-host-connection { margin: 5px 0 12px; color: var(--d-muted); font-size: 12px; }
#crm-reservations .dining-host-connection.error { color: var(--d-error); font-weight: 600; }
#crm-reservations .dining-host-station { display: grid; grid-template-columns: minmax(0, 1fr) 280px; grid-template-areas: "queue queue" "room inspector"; gap: 14px; align-items: start; }
#crm-reservations .dining-host-station > * { min-width: 0; }
#crm-reservations .dining-host-queue { grid-area: queue; border: 1px solid var(--d-line); background: var(--d-paper); border-radius: 6px; padding: 12px; }
#crm-reservations .dining-host-queue-heading { display: flex; gap: 16px; align-items: center; justify-content: space-between; margin-bottom: 8px; }
#crm-reservations .dining-host-queue-heading h3, #crm-reservations .dining-host-queue-heading label { margin: 0; }
#crm-reservations .dining-host-queue-heading label { display: flex; align-items: center; gap: 8px; font-size: 12px; }
#crm-reservations .dining-host-queue-heading select { margin: 0; width: auto; padding: 4px 8px; min-height: 36px; }
#crm-reservations #dining-host-queue-list { display: grid; grid-auto-flow: column; grid-auto-columns: 205px; gap: 8px; overflow: auto; padding: 3px; }
#crm-reservations .dining-host-party { display: block; text-align: left; width: 100%; min-height: 100px; border: 1px solid var(--d-line); padding: 10px; background: var(--surface-2); color: var(--d-ink); font-size: 12px; }
#crm-reservations .dining-host-party > span { display: block; }
#crm-reservations .dining-host-party .dining-host-party-top { display: flex; gap: 6px; justify-content: space-between; margin-bottom: 5px; }
#crm-reservations .dining-host-party-top strong { font-size: 14px; overflow-wrap: anywhere; }
#crm-reservations .dining-host-party-top > span { white-space: nowrap; }
#crm-reservations .dining-host-party[aria-pressed="true"] { outline: 3px solid var(--d-gold); outline-offset: -3px; background: var(--d-soft); }
#crm-reservations .dining-host-note { color: var(--d-error); font-weight: 600; }
#crm-reservations .dining-host-room { grid-area: room; min-width: 0; }
#crm-reservations .dining-map-wrap, #crm-reservations.dining-focus .dining-map-wrap { width: 100%; overflow: visible; max-height: none; }
#crm-reservations .dining-map, #crm-reservations .dining-map[data-area], #crm-reservations.dining-focus .dining-map { width: 100%; min-width: 0; height: 440px; border: 1px solid var(--d-line); border-radius: 6px; overflow: hidden; }
#crm-reservations .dining-map .table-seat, #crm-reservations .dining-map .table-seat[data-shape], #crm-reservations.dining-focus .dining-map .table-seat[data-shape] { width: 52px; height: 48px; min-height: 44px; padding: 2px; font-size: 13px; line-height: 1.15; }
#crm-reservations .dining-map .table-seat[data-shape="round"] { border-radius: 14px; }
#crm-reservations .dining-map .table-meta, #crm-reservations .dining-map .table-turn { display: block; font-size: 9px; margin-top: 2px; white-space: nowrap; }
#crm-reservations .dining-map .table-seat[data-candidate="false"] { border-style: dashed; }
#crm-reservations .dining-map .dining-offline-group strong { white-space: normal; font-size: 10px; }
#crm-reservations .dining-host-inspector { grid-area: inspector; position: sticky; top: 12px; max-height: calc(100dvh - 32px); overflow: auto; padding: 16px; border: 2px solid var(--d-line); border-radius: 6px; background: var(--d-paper); scroll-margin: 12px; }
#crm-reservations .dining-host-inspector h3 { font-size: 18px; }
#crm-reservations .dining-host-inspector h4 { margin: 18px 0 8px; }
#crm-reservations .dining-host-inspector p { margin: 8px 0; font-size: 13px; }
#crm-reservations .dining-host-inspector-heading { display: flex; gap: 8px; justify-content: space-between; align-items: baseline; }
#crm-reservations .dining-host-inspector-heading > span { color: var(--d-muted); font-size: 12px; }
#crm-reservations .dining-host-actions, #crm-reservations .dining-host-combinations { display: flex; flex-wrap: wrap; gap: 7px; margin: 12px 0; }
#crm-reservations .dining-host-actions button, #crm-reservations .dining-host-combinations button { min-height: 44px; padding: 6px 9px; font-size: 12px; }
#crm-reservations .dining-host-combinations button[aria-pressed="true"] { border: 2px solid var(--d-gold); background: var(--d-soft); }
#crm-reservations .dining-host-schedule { display: block; text-align: left; width: 100%; color: var(--d-ink); background: var(--surface-2); margin: 6px 0; font-size: 12px; }
#crm-reservations .dining-host-schedule strong, #crm-reservations .dining-host-schedule span { display: block; }
#crm-reservations .dining-host-selected { padding-top: 16px; margin-top: 16px; border-top: 1px solid var(--d-line); }
#crm-reservations .dining-host-request, #crm-reservations .dining-host-warning { padding: 10px; background: var(--d-soft); border-left: 3px solid var(--d-gold); white-space: pre-wrap; }
#crm-reservations .dining-host-check { display: flex; gap: 8px; align-items: start; font-size: 13px; }
#crm-reservations .dining-host-check input { flex: none; }
#crm-reservations .dining-host-savebar { position: sticky; bottom: -16px; background: var(--d-paper); padding: 12px 0; display: flex; flex-wrap: wrap; gap: 8px; border-top: 1px solid var(--d-line); z-index: 2; }
#crm-reservations .dining-host-savebar button { flex: 1 1 auto; }
#crm-reservations .dining-host-workload { color: var(--d-muted); }
#crm-reservations.dining-focus #dining-root { display: block; }
#crm-reservations.dining-focus #dining-filters { margin-bottom: 10px; }
#crm-reservations.dining-focus .dining-search-tools { display: inline-flex; margin-right: 12px; }
#crm-reservations.dining-focus[data-table-selected="true"] #dining-view-list { display: none; }
@container reservations (min-width: 1180px) {
  #crm-reservations .dining-host-station { grid-template-columns: 220px minmax(0, 1fr) 300px; grid-template-areas: "queue room inspector"; }
  #crm-reservations #dining-host-queue-list { display: flex; flex-direction: column; max-height: 540px; overflow: auto; }
  #crm-reservations .dining-host-queue-heading { display: block; }
  #crm-reservations .dining-host-queue-heading label { margin-top: 8px; }
  #crm-reservations .dining-map, #crm-reservations .dining-map[data-area] { height: 500px; }
}
@container reservations (max-width: 699px) {
  #crm-reservations .dining-host-station { grid-template-columns: minmax(0, 1fr); grid-template-areas: "queue" "room" "inspector"; }
  #crm-reservations .dining-host-inspector { position: sticky; bottom: 8px; top: auto; max-height: 42dvh; z-index: 4; box-shadow: 0 3px 18px #0002; }
  #crm-reservations .dining-host-toolbar { align-items: start; }
  #crm-reservations .dining-host-toolbar p { font-size: 12px; }
  #crm-reservations .dining-map, #crm-reservations .dining-map[data-area] { height: 440px; }
}
#crm-reservations.dining-host-mode #dining-root { display: flex; flex-direction: column; gap: 0; }
#crm-reservations.dining-host-mode .dining-heading p,
#crm-reservations.dining-host-mode .dining-find-field,
#crm-reservations.dining-host-mode .dining-scope-field,
#crm-reservations.dining-host-mode #dining-search-range,
#crm-reservations.dining-host-mode #dining-summary,
#crm-reservations.dining-host-mode #dining-status:not(.error) { display: none; }
#crm-reservations.dining-host-mode .dining-header { margin: 0 0 4px; }
#crm-reservations.dining-host-mode .dining-heading h1 { font-size: 22px; margin: 0; }
#crm-reservations.dining-host-mode .dining-search-tools { display: flex; gap: 8px; margin: 0 0 6px; }
#crm-reservations.dining-host-mode .dining-search-tools .dining-date-field { flex: 0 1 190px; }
#crm-reservations.dining-host-mode .dining-date-field { display: flex; gap: 8px; align-items: center; white-space: nowrap; }
#crm-reservations.dining-host-mode .dining-date-field input { margin: 0; }
#crm-reservations.dining-host-mode .dining-nav { margin: 0 0 6px; flex-wrap: nowrap; overflow: auto; }
#crm-reservations.dining-host-mode .dining-nav button { min-height: 38px; padding: 6px 12px; white-space: nowrap; }
#crm-reservations.dining-host-mode #dining-filters { margin: 0; }
#crm-reservations.dining-host-mode #dining-alerts { max-height: 40px; overflow: auto; margin: 0 0 4px; padding: 4px 10px; font-size: calc(12px * var(--fs, 1)); line-height: 1.35; }
#crm-reservations.dining-host-mode #dining-alerts p { margin: 0; }
#crm-reservations.dining-host-mode .dining-host-toolbar { margin: 4px 0 0; min-height: 36px; }
#crm-reservations.dining-host-mode .dining-host-toolbar button { min-height: 36px; padding: 4px 8px; }
#crm-reservations.dining-host-mode .dining-host-connection { margin: 2px 0 6px; }
#crm-reservations .dining-host-station { height: var(--host-height, 550px); grid-template-rows: 124px minmax(0,1fr); gap: 8px; align-items: stretch; }
#crm-reservations .dining-host-queue { padding: 8px; min-height: 0; overflow: hidden; display: flex; flex-direction: column; }
#crm-reservations .dining-host-queue-heading { margin-bottom: 4px; }
#crm-reservations #dining-host-queue-list { min-height: 0; flex: 1; }
#crm-reservations .dining-host-party { min-height: 0; padding: 6px 8px; font-size: 11px; }
#crm-reservations .dining-host-party-top strong { font-size: 12px; }
#crm-reservations .dining-host-party .dining-host-party-top { margin: 0; }
#crm-reservations .dining-host-room { display: flex; flex-direction: column; min-height: 0; gap: 4px; }
#crm-reservations .dining-host-room .dining-legend { flex: none; margin: 0; font-size: 10px; gap: 5px 8px; }
#crm-reservations .dining-host-room .dining-legend-swatch { width: 11px; height: 11px; }
#crm-reservations .dining-host-room > p { font-size: 10px; margin: 0; }
#crm-reservations .dining-host-room .dining-map-wrap { flex: 1; min-height: 0; height: auto; }
#crm-reservations .dining-host-room .dining-map, #crm-reservations .dining-host-room .dining-map[data-area] { height: 100%; min-height: 0; }
#crm-reservations .dining-host-inspector { position: relative; top: auto; bottom: auto; padding: 0; max-height: none; min-height: 0; overflow: hidden; display: flex; flex-direction: column; }
#crm-reservations .dining-host-inspector-scroll { overflow: auto; overscroll-behavior: contain; min-height: 0; flex: 1; padding: 10px; }
#crm-reservations .dining-host-selected { border: 0; padding: 0; margin: 0; }
#crm-reservations .dining-host-selected > h3 { position: sticky; top: -10px; padding: 8px 0; margin: -10px 0 0; background: var(--d-paper); z-index: 2; }
#crm-reservations .dining-host-inspector .dining-host-savebar { position: relative; flex: none; bottom: auto; margin: 0; padding: 8px; }
#crm-reservations .dining-host-savebar button { min-height: 44px; padding: 6px 8px; font-size: 12px; }
#crm-reservations .dining-host-savebar [data-host-discard] { flex: 0 0 100%; min-height: 32px; }
#crm-reservations .dining-host-combinations { max-height: 140px; overflow: auto; padding: 3px; }
#crm-reservations .dining-host-table-details { margin-top: 12px; padding-top: 8px; border-top: 1px solid var(--d-line); }
@container reservations (min-width: 1180px) {
  #crm-reservations .dining-host-station { grid-template-rows: minmax(0,1fr); }
  #crm-reservations #dining-host-queue-list { max-height: none; }
  #crm-reservations .dining-host-party { padding: 10px; font-size: 12px; }
}
@container reservations (max-width: 699px) {
  #crm-reservations .dining-host-station { grid-template-rows: 112px minmax(200px,1fr) minmax(170px,.7fr); }
  #crm-reservations .dining-host-inspector { position: relative; bottom: auto; top: auto; max-height: none; box-shadow: none; }
  #crm-reservations .dining-host-toolbar p { max-width: 72%; }
  #crm-reservations .dining-host-savebar { flex-wrap: nowrap; }
  #crm-reservations .dining-host-savebar [data-host-discard] { flex: 0 1 auto; }
}
#crm-reservations.dining-host-mode .dining-header { display: none; }
#crm-reservations.dining-host-mode .dining-search-tools { padding: 0; }
#crm-reservations.dining-host-mode .dining-date-field { flex-direction: row; }
#crm-reservations .dining-host-toolbar-actions { display: flex; flex: none; gap: 6px; }
#crm-reservations .dining-host-station { grid-template-rows: 148px minmax(0,1fr); }
#crm-reservations .dining-host-queue-heading > label { display: flex; flex-direction: row; }
#crm-reservations .dining-host-party { overflow: auto; }
#crm-reservations .dining-host-savebar [data-host-discard] { flex: 0 1 auto; min-height: 44px; }
@container reservations (min-width: 1180px) {
  #crm-reservations .dining-host-station { grid-template-rows: minmax(0,1fr); }
}
@container reservations (max-width: 699px) {
  #crm-reservations .dining-host-station { grid-template-rows: 132px minmax(200px,1fr) minmax(170px,.7fr); }
  #crm-reservations .dining-host-toolbar-actions { flex-wrap: wrap; justify-content: end; }
}
#crm-reservations .dining-host-savebar .dining-host-save-context { flex: 0 0 100%; margin: 0; font-size: 12px; font-weight: 600; }
@container reservations (max-width: 699px) {
  #crm-reservations .dining-host-savebar { flex-wrap: wrap; }
}
@container reservations (min-width: 735px) {
  #crm-reservations .dining-host-station { grid-template-columns: 160px minmax(0,1fr) 250px; grid-template-areas: "queue room inspector"; grid-template-rows: minmax(0,1fr); }
  #crm-reservations .dining-host-queue-heading { display: block; }
  #crm-reservations .dining-host-queue-heading label { margin-top: 8px; display: block; }
  #crm-reservations .dining-host-queue-heading select { width: 100%; }
  #crm-reservations #dining-host-queue-list { display: flex; flex-direction: column; max-height: none; }
  #crm-reservations .dining-host-party { flex: none; padding: 8px; min-height: 80px; }
  #crm-reservations .dining-host-party .dining-host-party-top { display: block; }
  #crm-reservations .dining-host-party-top > span { display: block; }
}
@container reservations (min-width: 1000px) {
  #crm-reservations .dining-host-station { grid-template-columns: 190px minmax(0,1fr) 290px; }
}
#crm-reservations .dining-host-selected-heading { position: sticky; top: -10px; padding: 8px 0; margin-top: -10px; background: var(--d-paper); z-index: 3; border-bottom: 1px solid var(--d-line); }
#crm-reservations .dining-host-selected-heading h3 { margin: 0; font-size: 16px; overflow-wrap: anywhere; }
#crm-reservations .dining-host-selected-heading p { margin: 4px 0 0; }
body:has(#crm-reservations.dining-host-mode) #ai-chat-fab { bottom: auto; top: 76px; }
#crm-reservations .dining-host-inspector > .dining-host-selected-heading { position: relative; top: auto; flex: none; padding: 8px 10px; margin: 0; }
#crm-reservations .dining-host-guest-context { border-top: 1px solid var(--d-line); margin-top: 12px; padding-top: 4px; }
#crm-reservations .dining-host-prior-note + .dining-host-prior-note { border-top: 1px solid var(--d-line); }
#crm-reservations .dining-host-service-alerts .dining-host-warning p { margin: 4px 0 8px; }
#crm-reservations.dining-host-mode .dining-nav button,
#crm-reservations.dining-host-mode .dining-host-toolbar button,
#crm-reservations .dining-host-queue-heading select { min-height: 44px; }
#crm-reservations .dining-host-inspector summary { min-height: 44px; display: flex; align-items: center; }

/* Keep physical room coordinates stable; panels adapt around the floor plan. */
body:has(#page-reservations.active #crm-reservations.dining-host-mode) #page-reservations { padding: 8px 16px; }
#crm-reservations.dining-host-mode .dining-host-station {
  position: relative;
  grid-template-columns: minmax(0, 1fr);
  grid-template-areas: "room";
  grid-template-rows: minmax(0, 1fr);
  gap: 8px;
}
#crm-reservations.dining-host-mode .dining-host-inspector { display: none; }
#crm-reservations.dining-host-mode[data-host-selection="true"] .dining-host-station {
  grid-template-areas: "room" "inspector";
  grid-template-rows: minmax(0, 1fr) 200px;
}
#crm-reservations.dining-host-mode[data-host-selection="true"] .dining-host-inspector { display: flex; }
#crm-reservations.dining-host-mode .dining-host-queue {
  display: none;
  position: absolute;
  inset: 0 auto 0 0;
  width: min(340px, 100%);
  z-index: 8;
  border: 2px solid var(--d-gold);
  padding: 12px;
  box-shadow: 8px 0 20px #0002;
}
#crm-reservations.dining-host-mode[data-queue-open="true"] .dining-host-queue { display: flex; }
#crm-reservations.dining-host-mode .dining-host-queue-heading { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; }
#crm-reservations.dining-host-mode .dining-host-queue-heading label { display: flex; width: 100%; margin: 0; }
#crm-reservations.dining-host-mode .dining-host-queue-heading select { flex: 1; min-height: 44px; }
#crm-reservations.dining-host-mode #dining-host-queue-list { display: flex; flex-direction: column; overflow: auto; max-height: none; gap: 8px; }
#crm-reservations.dining-host-mode .dining-host-party { flex: none; min-height: 80px; padding: 10px; font-size: 12px; }
#crm-reservations.dining-host-mode .dining-host-party .dining-host-party-top { display: flex; }
#crm-reservations.dining-host-mode .dining-host-party-top strong { font-size: 14px; }
#crm-reservations.dining-host-mode .dining-host-room .dining-map-wrap { position: relative; border: 0; overflow: hidden; }
#crm-reservations.dining-host-mode .dining-host-room .dining-map { position: relative; overflow: hidden; }
#crm-reservations.dining-host-mode #dining-confirm-ready { display: none; }
#crm-reservations .dining-room-canvas { position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%); }
#crm-reservations .dining-room-landmarks { position: absolute; inset: 0; width: 100%; height: 100%; pointer-events: none; fill: none; stroke: var(--d-line); }
#crm-reservations .dining-room-landmarks path, #crm-reservations .dining-room-landmarks rect { stroke-width: 3px; vector-effect: non-scaling-stroke; }
#crm-reservations .dining-room-landmarks text { fill: var(--d-muted); stroke: none; }
#crm-reservations .dining-map .dining-room-canvas .table-seat {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 1px;
  width: var(--table-size, 60px);
  height: var(--table-size, 60px);
  min-width: 44px;
  min-height: 44px;
  padding: 2px;
  border-width: 2px;
  font-size: 14px;
  line-height: 1;
}
#crm-reservations .dining-map .dining-room-canvas .table-seat[data-shape="round"] { border-radius: 50%; }
#crm-reservations .dining-map .dining-room-canvas .table-seat[data-shape="rect"][data-orientation="landscape"] {
  width: clamp(60px, calc(var(--table-size, 60px) * 1.15), 78px);
  height: 44px;
  border-radius: 5px;
}
#crm-reservations .dining-map .dining-room-canvas .table-seat[data-shape="rect"][data-orientation="portrait"] {
  width: clamp(44px, calc(var(--table-size, 60px) * .85), 54px);
  height: clamp(56px, calc(var(--table-size, 60px) * 1.2), 68px);
  border-radius: 5px;
}
#crm-reservations .dining-map .dining-room-canvas .table-seat[data-offline="true"] { background: var(--d-ink); color: var(--d-paper); border-color: var(--d-ink); }
#crm-reservations .dining-map .dining-room-canvas .table-seat[data-offline="true"][data-orientation="portrait"] { width: 52px; height: clamp(52px, calc(var(--table-size, 60px) * .95), 62px); }
#crm-reservations .dining-map .dining-room-canvas .table-meta,
#crm-reservations .dining-map .dining-room-canvas .table-turn { margin: 0; max-width: 100%; font-size: 10px; line-height: 1; }
#crm-reservations .dining-map .dining-room-canvas .table-seat strong { max-width: 100%; line-height: 1; }
#crm-reservations .dining-map .dining-room-canvas .table-seat[data-offline="true"] .table-meta { font-size: 10px; }
#crm-reservations .dining-counter-details { position: absolute; transform: translate(-50%, -50%); width: 156px; min-height: 44px; padding: 6px 8px; font-size: 12px; line-height: 1.3; text-align: center; }
#crm-reservations .dining-counter-details span { display: block; font-size: 10px; }
#crm-reservations .dining-counter-seat {
  position: absolute;
  width: clamp(20px, calc(var(--table-size, 60px) * .4), 28px);
  height: clamp(20px, calc(var(--table-size, 60px) * .4), 28px);
  display: flex;
  align-items: center;
  justify-content: center;
  transform: translate(-50%, -50%);
  color: var(--d-muted);
  font-size: 9px;
  line-height: 1;
  white-space: nowrap;
  pointer-events: none;
  isolation: isolate;
}
#crm-reservations .dining-counter-seat::before { content: ""; position: absolute; inset: 0; z-index: -1; border: 1px solid var(--d-line); background: var(--d-paper); border-radius: 2px; transform: rotate(45deg); }
#crm-reservations.dining-host-mode .dining-host-toolbar { min-height: 0; gap: 8px; }
#crm-reservations.dining-host-mode .dining-host-toolbar,
#crm-reservations.dining-host-mode .dining-host-room > p { display: none; }
#crm-reservations.dining-host-mode .dining-host-toolbar p { max-width: none; font-size: 12px; }
#crm-reservations.dining-host-mode .dining-host-toolbar button,
#crm-reservations.dining-host-mode .dining-nav button { min-height: 44px; }
#crm-reservations.dining-host-mode .dining-search-tools { flex-wrap: nowrap; }
#crm-reservations.dining-host-mode .dining-date-field input { width: 150px; }
#crm-reservations.dining-host-mode .dining-nav { gap: 0; }
#crm-reservations.dining-host-mode .dining-nav button { padding: 6px 9px; }
#crm-reservations.dining-host-mode #dining-filters { gap: 8px; }
#crm-reservations.dining-host-mode #dining-areas { display: flex; flex-wrap: wrap; gap: 6px; }
.dining-host-filter-controls { display: none; }
#crm-reservations.dining-host-mode .dining-host-filter-controls { display: flex; flex-wrap: wrap; gap: 6px; margin-left: auto; }
#crm-reservations.dining-host-mode .dining-host-filter-controls button { min-height: 44px; padding: 7px 10px; }
#crm-reservations.dining-host-mode #dining-areas button,
#crm-reservations.dining-host-mode #dining-filters > button { padding: 7px 10px; }
#crm-reservations.dining-host-mode .dining-host-inspector .dining-host-savebar { gap: 6px; }
#crm-reservations.dining-host-mode .dining-host-inspector-scroll { scroll-padding: 12px; }
@media (min-width: 769px) {
  body:has(#page-reservations.active #crm-reservations.dining-host-mode) #sidebar { width: 60px; min-width: 60px; }
  body:has(#page-reservations.active #crm-reservations.dining-host-mode) #sidebar .sidebar-brand-text,
  body:has(#page-reservations.active #crm-reservations.dining-host-mode) #sidebar .nav-section-label,
  body:has(#page-reservations.active #crm-reservations.dining-host-mode) #sidebar .nav-label,
  body:has(#page-reservations.active #crm-reservations.dining-host-mode) #sidebar .nav-badge { opacity: 0; pointer-events: none; }
  body:has(#page-reservations.active #crm-reservations.dining-host-mode) #sidebar .sidebar-user,
  body:has(#page-reservations.active #crm-reservations.dining-host-mode) #sidebar .sidebar-collapse-btn,
  body:has(#page-reservations.active #crm-reservations.dining-host-mode) #sidebar .sidebar-signout-btn .nav-label { display: none; }
}
@media (min-width: 960px) {
  body:has(#page-reservations.active #crm-reservations.dining-host-mode) #ai-chat-fab { width: 44px; height: 44px; top: 10px; bottom: auto; left: 280px; right: auto; }
}
@media (min-width: 700px) and (max-width: 959px) {
  body:has(#page-reservations.active #crm-reservations.dining-host-mode) #ai-chat-fab { width: 44px; height: 44px; top: 72px; bottom: auto; left: auto; right: 12px; }
}
@container reservations (min-width: 928px) {
  #crm-reservations.dining-host-mode #dining-root { display: grid; grid-template-columns: 405px minmax(0, 1fr); column-gap: 8px; }
  #crm-reservations.dining-host-mode .dining-search-tools { grid-column: 1; grid-row: 1; align-items: center; margin-bottom: 6px; }
  #crm-reservations.dining-host-mode .dining-nav { grid-column: 2; grid-row: 1; align-items: center; justify-content: end; }
  #crm-reservations.dining-host-mode .dining-search-tools .dining-date-field { flex: 1 1 auto; }
  #crm-reservations.dining-host-mode #dining-root > :not(.dining-search-tools):not(.dining-nav) { grid-column: 1 / -1; }
  #crm-reservations.dining-host-mode[data-host-selection="true"] .dining-host-station { grid-template-columns: minmax(680px, 1fr) 240px; grid-template-areas: "room inspector"; grid-template-rows: minmax(0, 1fr); }
}
@media (max-width: 768px) {
  body:has(#page-reservations.active #crm-reservations.dining-host-mode) #page-reservations { padding: 8px 12px; }
  #crm-reservations.dining-host-mode .dining-host-station { min-height: 550px; }
  #crm-reservations.dining-host-mode[data-host-selection="true"] .dining-host-station { min-height: 700px; }
}
@media (max-width: 600px) {
  #crm-reservations.dining-host-mode .dining-search-tools { flex-wrap: wrap; }
  #crm-reservations.dining-host-mode .dining-search-tools .dining-date-field { flex-basis: auto; }
  #crm-reservations.dining-host-mode .dining-date-field { font-size: 12px; }
  #crm-reservations.dining-host-mode .dining-date-field input { width: 145px; }
  #crm-reservations.dining-host-mode .dining-search-tools button { padding: 7px 9px; }
  #crm-reservations.dining-host-mode .dining-host-station { min-height: 380px; }
  #crm-reservations.dining-host-mode[data-host-selection="true"] .dining-host-station { min-height: 580px; }
}