/* Calendar geometry measured against the original at 1280px on 2026-10-27. */
.app-shell.room-shell { grid-template-rows: 56px minmax(0, 1fr); }
.room-shell .app-header { height: 56px; box-shadow: none; overflow: hidden; }
.room-shell .app-header .system-logo { width: 180px; height: 56px; padding: 0 36px; gap: 8px; }
.room-shell .system-logo .app-brand-mark { width: 30px; height: 30px; flex: 0 0 30px; }
.room-shell .app-brand-mark svg { display: none !important; }
.room-shell .app-brand-mark { background: url('./assets/ql-logo.svg') center / 30px auto no-repeat !important; }
.room-shell .system-logo strong { color: #008bff; font-size: 17px; }
.room-shell .app-header .header-collapse { display: flex; width: 36px; height: 56px; flex: 0 0 36px; border: 0; }
.room-shell .top-nav { flex: 1 1 auto; min-width: 0; height: 56px; overflow-x: auto; scrollbar-width: none; }
.room-shell .top-nav [data-route] { flex-shrink: 0; height: 56px; min-width: 56px; padding: 0 12px; font-size: 16px; }
.room-shell .header-actions { height: 56px; gap: 14px; flex: 0 0 auto; padding: 0 20px 0 10px; }
.room-shell .header-link { height: 56px; font-size: 14px; }
.room-shell .header-actions .quick-btn,
.room-shell .header-actions .notice-btn[aria-label='任务'],
.room-shell .header-actions .notice-btn[aria-label='帮助'],
.room-shell .header-actions .notice-btn[aria-label='刷新'] { display: none; }
.room-shell .header-actions .notice-btn { width: 24px; min-width: 24px; height: 30px; background: none; }
.room-shell .header-actions .avatar { width: 34px; height: 34px; background: #008bff; color: #fff; }
.room-shell .body-shell:has(.rooms-side-nav) { grid-template-columns: 180px minmax(0, 1fr) !important; }
.room-shell .side-nav.rooms-side-nav { width: 180px !important; min-width: 180px !important; padding: 6px 8px !important; border-right: 0 !important; scrollbar-width: none; }
.room-shell .side-nav.rooms-side-nav::-webkit-scrollbar { display: none; }
.room-shell .side-nav.rooms-side-nav .side-item { height: 42px !important; min-height: 42px !important; width: 100% !important; margin: 0 0 6px !important; padding: 0 10px !important; border: 0 !important; border-radius: 2px !important; gap: 8px !important; font-weight: 400 !important; }
.room-shell .side-nav.rooms-side-nav .side-item.active { box-shadow: none !important; }
.room-shell .side-nav.rooms-side-nav .side-label { display: block !important; font-size: 14px !important; }
.room-shell .side-nav.rooms-side-nav .side-icon { width: 22px !important; height: 22px !important; }
.room-shell .side-icon svg { display: block; width: 22px !important; height: 22px !important; fill: none; stroke: currentColor; stroke-width: 1.6; }
.room-shell .side-nav.rooms-side-nav .side-caret { color: #333 !important; }
.room-shell .main-room .content { padding: 16px 16px 0; background: #f3f3f5; overflow: hidden; }
.room-shell .room-board-page { gap: 16px; min-height: 0; }
.room-shell .calendar-topbar { height: 33px; min-height: 33px; padding: 0; border: 0; border-radius: 0; background: transparent; justify-content: space-between; flex-wrap: nowrap; }
.room-shell .room-mode-tabs { height: 34px; flex: 0 0 auto; }
.room-shell .room-mode-tabs .tab { height: 34px; min-width: 57px; padding: 0 14px; border-radius: 0; background: #fff; font-size: 14px; font-weight: 400; }
.room-shell .room-mode-tabs .tab.active { color: #008bff; border-color: #008bff; }
.room-shell .calendar-topbar .room-head-actions { display: flex; flex-wrap: nowrap; gap: 16px; }
.room-shell .calendar-topbar .btn.primary { height: 34px; min-height: 34px; padding: 0 14px; border-radius: 2px; font-size: 14px; font-weight: 400; }
.room-shell .room-calendar-gantt { border-radius: 0; border: 1px solid #e5e5e5; height: 100%; min-height: 0; box-shadow: none; scrollbar-width: auto; }
.room-shell .room-calendar-gantt { width: calc(100% + 16px); border-left: 0; }
.room-shell .room-calendar-gantt::-webkit-scrollbar { width: 0; height: 8px; }
.room-shell .room-calendar-gantt::-webkit-scrollbar-thumb { border-radius: 6px; background: #b7b7b7; }
.room-shell .room-calendar-gantt::-webkit-scrollbar-track { background: transparent; }
.room-shell .room-calendar-grid { min-width: calc(240px + var(--calendar-days) * 120px); grid-template-columns: 120px 120px repeat(var(--calendar-days), 120px); grid-template-rows: 30px 40px 30px 30px; grid-auto-rows: 60px; color: #222; }
.room-shell .calendar-head-cell { padding: 0; border-color: #e5e5e5; font-size: 14px; font-weight: 400; }
.room-shell .calendar-count, .room-shell .calendar-unassigned { top: 0; }
.room-shell .calendar-date, .room-shell .calendar-date-control { top: 30px; }
.room-shell .calendar-week, .room-shell .calendar-range { top: 70px; }
.room-shell .calendar-remain, .room-shell .calendar-filter-toggle { top: 100px; }
.room-shell .calendar-date strong { font-size: 14px; font-weight: 400; }
.room-shell .calendar-date em { font-size: 14px; }
.room-shell .calendar-week, .room-shell .calendar-remain { font-size: 13px; }
.room-shell .calendar-week.today { color: #008bff; }
.room-shell .calendar-remain { color: #222; }
.room-shell .calendar-count span { min-width: 23px; height: 18px; min-height: 18px; border-radius: 0; font-size: 12px; font-weight: 400; background: #e7f3ff; border-color: #adc9de; }
.room-shell .calendar-date-control { gap: 20px; }
.room-shell .calendar-date-picker { position: relative; display: block; width: 143px; height: 28px; }
.room-shell .calendar-date-picker > span { position: absolute; inset: 0 20px 0 0; display: flex; align-items: center; justify-content: flex-end; color: #333; font-size: 14px; white-space: nowrap; pointer-events: none; }
.room-shell .calendar-date-picker .room-date-input { position: absolute; inset: 0; color: transparent; cursor: pointer; }
.room-shell .calendar-date-picker .room-date-input::-webkit-datetime-edit { color: transparent; }
.room-shell .calendar-date-picker .room-date-input::-webkit-calendar-picker-indicator { opacity: .3; }
.room-shell .calendar-date-control .room-date-input { width: 143px; height: 28px; min-height: 28px; border: 0; padding: 0; font-size: 14px; background: transparent; }
.room-shell .calendar-today { border: 0; background: #008bff; color: white; padding: 0 2px; font-size: 14px; line-height: 18px; cursor: pointer; }
.room-shell .calendar-range { color: #aaa; gap: 8px; font-size: 12px; }
.room-shell .calendar-filter-toggle { gap: 0; }
.room-shell .calendar-link { display: inline-flex; justify-content: center; align-items: center; gap: 5px; width: 50%; height: 30px; border: 0; border-right: 1px solid #e5e5e5; background: white; color: #444; font-size: 14px; }
.room-shell .calendar-link-icon { order: 1; }
.room-shell .room-calendar-type-cell { left: 0; padding: 6px 4px; font-size: 13px; line-height: 20px; font-weight: 400; border-color: #e5e5e5; }
.room-shell .room-calendar-room-cell { left: 120px; min-height: 60px; font-size: 12px; border-color: #e5e5e5; color: #222; background: white; }
.room-shell .room-calendar-room-cell strong { font-weight: 400; }
.room-shell .room-calendar-room-cell.dirty { background: #ccc; }
.room-shell .room-calendar-cell.gantt-cell { min-height: 60px; place-items: center; align-content: center; color: #333; font-size: 12px; border-color: #e5e5e5; }
.room-shell .room-calendar-cell.gantt-cell > span { align-self: center; }
.room-shell .room-calendar-cell.gantt-cell.maintenance > span { width: calc(100% - 6px); height: 54px; display: grid; place-items: center; border-radius: 3px; background: var(--calendar-maintenance, #9468b2); color: #111; }
.room-shell .room-calendar-cell.gantt-cell.locked > span { background: var(--calendar-locked, #d25050); }
.room-shell .room-calendar-cell.gantt-cell.maintenance { background: #fff; }
.room-shell .room-calendar-order.gantt-order { min-height: 54px; height: 54px; margin: 3px; padding: 3px 5px; border-radius: 3px; gap: 8px; color: #111; box-shadow: none; border-left: 7px solid #ffcb00; }
.room-shell .room-calendar-order.gantt-order strong { font-size: 14px; line-height: 18px; font-weight: 600; }
.room-shell .room-calendar-order.gantt-order em span { min-width: 16px; min-height: 16px; font-size: 12px; border-radius: 3px; background: #000; }
.room-shell .room-calendar-order.gantt-order.past { background: var(--calendar-past, #808080); color: #111; }
.room-shell .room-calendar-order.gantt-order.occupied { background: var(--calendar-occupied, #22cbff); }
.room-shell .room-calendar-order.gantt-order.booked { background: var(--calendar-booked, #f0a020); }
.room-shell .room-calendar-order.gantt-order.maintenance { background: var(--calendar-maintenance, #9468b2); }
.room-shell .calendar-closure-icon { display: grid; place-items: center; width: 26px; height: 26px; border-radius: 5px; background: #007aff; font-size: 19px; font-style: normal; line-height: 1; }
.room-shell .room-calendar-cell.gantt-cell.maintenance > span { align-content: center; gap: 2px; font-size: 13px; }
.room-shell .room-calendar-order.gantt-order > i { background: transparent; border: 1px solid #fff; border-radius: 0; width: 10px; height: 12px; }
.room-shell .room-calendar-order.gantt-order > i::after { content: ''; position: absolute; width: 4px; height: 4px; right: -1px; top: -1px; border-left: 1px solid #fff; border-bottom: 1px solid #fff; background: #999; }
.room-shell .room-calendar-order[data-drag-order] { cursor: grab; touch-action: none; user-select: none; }
body.room-dragging .room-calendar-order.dragging { pointer-events: none; opacity: .6; }
body.room-dragging .room-hover-detail { display: none !important; pointer-events: none !important; }
.room-shell .room-calendar-order.drop-blocked { outline: 2px solid #ff4d4f; }
.room-shell .room-calendar-order.drop-swap { outline: 2px solid #008bff; }
.room-history-table { width: 100%; overflow-x: auto; }
.room-history-table table { min-width: 920px; }
.room-history-pagination, .room-history-pagination > div { display: flex; align-items: center; gap: 12px; }
.room-history-pagination { justify-content: space-between; flex-wrap: wrap; margin-top: 12px; color: #666; font-size: 13px; }
.room-history-pagination .btn { min-height: 28px; padding: 3px 10px; }
.room-detail-status .badge { flex-shrink: 0; white-space: nowrap; }
.room-shell .calendar-summary-type { position: sticky; left: 0; z-index: 6; font-size: 13px; font-weight: 400; }
.room-shell .calendar-summary-label { position: sticky; left: 120px; z-index: 6; background: #fff; }
.room-shell .calendar-summary-type, .room-shell .calendar-summary-label, .room-shell .calendar-summary-cell { display: flex; justify-content: center; align-items: center; min-height: 60px; padding: 4px; border-right: 1px solid #e5e5e5; border-bottom: 1px solid #e5e5e5; font-size: 13px; }
.room-shell .rooms-side-nav .side-child { display: flex; align-items: center; justify-content: flex-start; width: 100%; height: 48px; padding: 0 0 0 28px; border: 0; border-radius: 2px; background: transparent; color: #333; font-size: 14px; text-align: left; cursor: pointer; }
.room-shell .rooms-side-nav .side-child:hover { background: #f0f7ff; }
.room-shell .rooms-side-nav .side-child.active { background: #e6f4ff; color: #008bff; }
.room-shell .room-hover-detail { z-index: 25; font-size: 13px; line-height: 22px; box-shadow: 0 3px 12px #0002; border-radius: 3px; }
.calendar-filter-drawer { z-index: 80; }
.calendar-filter-mask { z-index: 79; background: #0005; }
.calendar-filter-actions { z-index: 81; }
.calendar-quick-toggle { position: fixed; right: 28px; bottom: 36px; z-index: 28; width: 48px; height: 48px; padding: 0; border: 0; border-radius: 50%; background: #fff; box-shadow: 0 2px 12px #0001; color: #333; font-size: 30px; font-weight: 300; line-height: 48px; cursor: pointer; }
.calendar-quick-menu { position: fixed; right: 76px; bottom: 84px; z-index: 28; width: 320px; height: 200px; padding: 12px; border-radius: 4px; background: #fff; box-shadow: 0 2px 14px #0002; }
.calendar-quick-menu button { display: flex; flex-direction: column; align-items: center; gap: 6px; padding: 0; border: 0; background: transparent; color: #333; font-size: 14px; cursor: pointer; }
.calendar-quick-menu button > span { font-size: 26px; line-height: 30px; }
.calendar-display-mask { position: fixed; inset: 0; z-index: 90; background: #0005; }
.calendar-display-drawer { position: fixed; inset: 0 0 0 auto; z-index: 91; display: flex; flex-direction: column; width: min(400px, 100vw); background: #fff; color: #333; box-shadow: -2px 0 12px #0001; }
.calendar-display-drawer > header { display: flex; align-items: center; justify-content: space-between; height: 51px; flex: 0 0 51px; padding: 0 16px; border-bottom: 1px solid #eee; }
.calendar-display-drawer h2 { margin: 0; font-size: 18px; font-weight: 400; }
.calendar-display-drawer > header button { width: 22px; height: 22px; padding: 0; border: 0; border-radius: 2px; background: #f3f3f3; color: #777; font-size: 21px; line-height: 22px; cursor: pointer; }
.calendar-display-body { flex: 1; min-height: 0; overflow: auto; padding: 0 16px; }
.calendar-display-colors { padding: 18px 0; border-bottom: 1px solid #eee; }
.calendar-display-colors h3 { margin: 0 0 16px; font-size: 16px; font-weight: 600; }
.calendar-display-colors > div { display: flex; flex-wrap: wrap; gap: 12px; }
.calendar-display-colors label { display: flex; align-items: center; gap: 6px; width: 100px; height: 30px; font-size: 14px; }
.calendar-display-colors input { width: 32px; height: 32px; padding: 3px; border: 1px solid #e5e5e5; background: #fff; cursor: pointer; }
.calendar-display-colors input::-webkit-color-swatch-wrapper { padding: 0; }
.calendar-display-colors input::-webkit-color-swatch { border: 0; }
.calendar-display-toggle { display: flex; align-items: center; gap: 8px; min-height: 55px; border-bottom: 1px solid #eee; font-size: 14px; cursor: pointer; }
.calendar-display-toggle:last-child { border-bottom: 0; }
.calendar-display-toggle input { appearance: none; position: relative; width: 32px; height: 18px; margin: 0; border-radius: 12px; background: #ccc; cursor: pointer; }
.calendar-display-toggle input:checked { background: #008bff; }
.calendar-display-toggle input::after { content: ''; position: absolute; left: 2px; top: 2px; width: 14px; height: 14px; border-radius: 50%; background: #fff; box-shadow: 0 1px 2px #0003; }
.calendar-display-toggle input:checked::after { left: 16px; }
.calendar-display-toggle input:focus-visible { outline: 2px solid #008bff; outline-offset: 3px; }
.calendar-display-drawer footer { display: flex; gap: 16px; align-items: center; padding: 16px; border-top: 1px solid #eee; }
.calendar-display-drawer footer .btn { min-height: 34px; height: 34px; padding: 0 14px; border-radius: 2px; font-size: 14px; }
.calendar-display-drawer footer .calendar-display-reset { margin-right: auto; background: #f0a020; border-color: #f0a020; color: #fff; }
.calendar-batch-dialog .modal-body { max-height: min(65vh, 560px); overflow: auto; display: grid; gap: 16px; }
.batch-modal { width: min(720px, calc(100vw - 32px)); max-width: 720px; }
.batch-tabs { display: flex; gap: 20px; }
.batch-tabs button { padding: 10px 0; border: 0; border-bottom: 2px solid transparent; color: #333; background: #fff; font-size: 16px; }
.batch-tabs button.active { color: #008bff; border-bottom-color: #008bff; }
.batch-search, .batch-search > label, .batch-date-range { display: flex; align-items: center; gap: 12px; }
.batch-search > .input { width: 180px; }
.batch-floor { display: grid; gap: 12px; }
.batch-floor-title { display: flex; align-items: center; gap: 8px; }
.batch-room-options { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 12px; padding-left: 24px; }
.batch-room-option { display: flex; align-items: center; gap: 8px; font-size: 13px; }
.batch-room-option[hidden] { display: none; }
.batch-weekdays { display: flex; flex-wrap: wrap; gap: 12px; }
.batch-selected-count { color: #888; }
.batch-modal input[type='checkbox'], .batch-modal input[type='radio'] { accent-color: #008bff; }
.batch-modal .btn:disabled { opacity: .45; cursor: not-allowed; }
.room-shell .modal:has(.calendar-order-drawer) { width: min(1182px, 100vw); height: 100vh; max-height: 100vh; overflow: hidden; }
.room-shell > .modal-backdrop { z-index: 100; }
.room-shell .calendar-order-drawer { display: grid; grid-template-columns: 300px minmax(0, 1fr); overflow: hidden; background: #f0eff5; color: #333; }
.room-shell .calendar-order-sidebar { min-width: 0; overflow: auto; background: #fff; border-right: 6px solid #f0eff5; }
.room-shell .calendar-order-head { height: 46px; padding: 0 14px; border-bottom: 0; }
.room-shell .calendar-order-head h3 { font-size: 14px; font-weight: 400; }
.room-shell .calendar-order-status-badge { padding: 3px 5px; background: #008bff; color: #fff; font-size: 12px; }
.room-shell .calendar-order-status-line { display: flex; flex-wrap: wrap; gap: 8px 12px; padding: 8px 14px; white-space: normal; background: #f4f4f4; color: #333; }
.room-shell .calendar-order-status-line label { display: inline-flex; gap: 6px; align-items: center; font-size: 13px; }
.room-shell .calendar-order-status-line input { margin: 0; accent-color: #008bff; }
.room-shell .calendar-order-list { padding: 8px 6px; }
.room-shell .calendar-order-list-item { width: 100%; padding: 0; border: 0; background: #fff; color: #333; text-align: left; cursor: pointer; }
.room-shell .calendar-order-list-item > span { display: flex; align-items: center; gap: 8px; padding: 6px 14px; font-size: 14px; }
.room-shell .calendar-order-list-item em { padding: 2px 5px; background: #008bff; color: #fff; font-size: 12px; font-style: normal; }
.room-shell .calendar-order-list-item b { margin-left: auto; font-size: 13px; font-weight: 400; }
.room-shell .calendar-order-list-item > span:last-child { border: 1px solid transparent; border-radius: 2px; }
.room-shell .calendar-order-list-item.active > span:last-child { border-color: #008bff; }
.room-shell .calendar-order-main { min-width: 0; height: 100%; display: flex; flex-direction: column; overflow: hidden; }
.room-shell .calendar-order-tabs { position: relative; height: 52px; min-height: 52px; padding: 0 14px; gap: 0; border: 0; }
.room-shell .calendar-order-tabs > button { height: 52px; padding: 0 20px; font-size: 18px; font-weight: 400; color: #333; }
.room-shell .calendar-order-tabs > button.active { color: #333; border-color: #008bff; font-weight: 400; }
.room-shell .calendar-order-tabs .calendar-order-close { width: 24px; height: 24px; margin: auto 0 auto auto; padding: 0; border: 0; font-size: 22px; line-height: 22px; color: #777; background: #f0f0f0; }
.room-shell .calendar-order-scroll { flex: 1; min-height: 0; overflow: auto; padding: 12px; }
.room-shell .calendar-order-money { display: grid; grid-template-columns: 1.15fr repeat(5, minmax(0, 1fr)); gap: 12px; padding: 0 0 12px; border: 0; background: transparent; }
.room-shell .calendar-order-money .calendar-order-info-item { min-height: 66px; gap: 6px; padding: 10px 14px; align-content: center; border: 1px solid #ddd; border-radius: 3px; background: #fff; }
.room-shell .calendar-order-money .calendar-order-info-item span { color: #888; }
.room-shell .calendar-order-money .calendar-order-info-item strong { font-size: 14px; font-weight: 400; }
.room-shell .calendar-order-money .calendar-order-info-item:nth-child(3) strong { color: #f5222d; }
.room-shell .calendar-order-money .calendar-order-info-item:nth-child(4) strong { color: #72a53c; }
.room-shell .calendar-order-money .calendar-order-info-item:nth-child(5) strong { color: #008bff; }
.room-shell .calendar-order-money .calendar-order-info-item:last-child { background: #f5222d; border-color: #f5222d; }
.room-shell .calendar-order-money .calendar-order-info-item:last-child :is(span,strong) { color: #fff; }
.room-shell .calendar-detail-columns { display: grid; grid-template-columns: minmax(0, .75fr) minmax(0, 1fr); gap: 12px; }
.room-shell .calendar-detail-columns > div { min-width: 0; }
.room-shell .calendar-order-section { margin: 0 0 12px; border-color: #ddd; border-radius: 3px; }
.room-shell .calendar-order-section h4 { font-size: 16px; font-weight: 400; }
.room-shell .calendar-order-field-grid { gap: 0; padding: 8px 12px; }
.room-shell .calendar-order-info-item { gap: 12px; padding: 10px 0; border-bottom: 1px dashed #eee; }
.room-shell .calendar-order-info-item span { color: #333; font-size: 13px; }
.room-shell .calendar-order-info-item strong { font-weight: 400; font-size: 14px; }
.calendar-detail-link { margin-left: 12px; padding: 0 6px; border: 1px solid #ddd; border-radius: 2px; background: #fff; color: #333; font-size: 12px; cursor: pointer; }
.calendar-move-mask { position: fixed; inset: 0; z-index: 95; background: #0005; }
.calendar-move-drawer { position: fixed; inset: 0 0 0 auto; z-index: 96; display: flex; flex-direction: column; width: min(742px, 100vw); background: #fff; color: #333; }
.calendar-move-drawer > header { display: flex; align-items: center; justify-content: space-between; height: 52px; flex: 0 0 52px; padding: 0 16px; border-bottom: 1px solid #eee; }
.calendar-move-drawer [role='tablist'] { display: flex; height: 100%; }
.calendar-move-drawer [role='tab'] { height: 100%; padding: 0 20px; border: 0; border-bottom: 2px solid transparent; background: #fff; color: #333; font-size: 18px; cursor: pointer; }
.calendar-move-drawer [aria-selected='true'] { border-bottom-color: #008bff; }
.calendar-move-drawer > header > button { width: 22px; height: 22px; padding: 0; border: 0; border-radius: 2px; background: #eee; color: #777; font-size: 22px; line-height: 22px; cursor: pointer; }
.calendar-move-body { flex: 1; min-height: 0; overflow: auto; padding: 16px; }
.calendar-move-body table { width: 100%; min-width: 0; font-size: 14px; }
.calendar-move-body .table-wrap { max-width: 100%; overflow: auto; }
.calendar-move-body .table-wrap { border-radius: 0; }
.calendar-move-body th { font-weight: 400; }
.calendar-move-field { position: relative; display: flex; flex-direction: column; gap: 8px; margin-top: 16px; font-size: 14px; }
.calendar-move-field b { color: #f5222d; font-weight: 400; }
.calendar-move-field > .select { display: flex; justify-content: space-between; width: min(300px, 100%); height: 34px; min-height: 34px; padding: 0 12px; border-radius: 3px; background: #fff; font-size: 14px; text-align: left; }
.calendar-move-room > span:first-child { min-width: 0; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; }
.calendar-move-room > span:last-child { flex-shrink: 0; }
.calendar-move-picker { position: absolute; top: 64px; left: 0; z-index: 2; display: grid; grid-template-columns: minmax(200px, 1fr) 150px; width: min(500px, 100%); max-height: 300px; border: 1px solid #ddd; border-radius: 3px; background: #fff; box-shadow: 0 2px 10px #0002; }
.calendar-move-picker > div { overflow: auto; }
.calendar-move-picker > div + div { border-left: 1px solid #eee; }
.calendar-move-picker button { display: flex; justify-content: space-between; gap: 8px; width: 100%; min-height: 34px; padding: 8px 12px; border: 0; background: #fff; color: #333; text-align: left; font-size: 13px; cursor: pointer; }
.calendar-move-picker button.active, .calendar-move-picker button:not(:disabled):hover { background: #e6f4ff; color: #008bff; }
.calendar-move-picker button:disabled { color: #bbb; cursor: not-allowed; }
.calendar-move-picker button span { flex-shrink: 0; font-size: 12px; color: #999; }
.calendar-move-picker [data-move-room] span { min-width: 0; flex-shrink: 1; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.calendar-move-prices { display: flex; max-width: 100%; overflow: auto; margin-top: 16px; background: #e2e2e8; }
.calendar-move-prices > div { flex: 0 0 100px; display: flex; flex-direction: column; background: #fff; text-align: center; font-size: 14px; }
.calendar-move-prices > div > * { min-height: 36px; padding: 8px; border: 1px solid #eee; font-weight: 400; }
.calendar-move-prices > div > span:first-child { border: 0; }
.calendar-move-prices label { display: flex; align-items: center; gap: 2px; }
.calendar-move-prices input { width: 70px; min-width: 0; border: 0; font-size: 14px; }
.calendar-move-bulk { display: flex; align-items: center; gap: 8px; width: 180px; margin-top: 12px; }
.calendar-move-reason { display: flex; flex-direction: column; gap: 8px; margin-top: 16px; font-size: 14px; }
.calendar-move-reason textarea { width: 100%; min-height: 80px; border-radius: 0; }
.calendar-move-print { display: flex; align-items: center; gap: 8px; padding: 12px 16px; background: #f0eff5; font-size: 14px; }
.calendar-move-drawer footer { display: flex; justify-content: flex-end; gap: 16px; padding: 16px; border-top: 1px solid #eee; }
.calendar-move-drawer footer .btn { height: 34px; min-height: 34px; padding: 0 14px; border-radius: 2px; font-size: 14px; }
.calendar-move-receipt { display: none; }
.calendar-price-drawer > header { font-size: 18px; }
.calendar-price-bulk { display: flex; align-items: center; gap: 20px; padding: 12px; background: #fafafa; border: 1px solid #eee; font-size: 14px; }
.calendar-price-bulk > span:last-child { display: flex; align-items: center; gap: 8px; }
.calendar-price-bulk input { width: 180px; min-width: 0; }
@media print {
  body:has(.calendar-move-receipt) > * { display: none !important; }
  body > .calendar-move-receipt { display: block !important; padding: 24px; color: #000; font-size: 14px; }
}
.room-shell .calendar-bill-view { min-width: 0; padding: 0 12px 12px; background: #fff; }
.room-shell .calendar-bill-tabs { display: flex; height: 44px; gap: 20px; }
.room-shell .calendar-bill-tabs button { border: 0; border-bottom: 2px solid transparent; background: transparent; color: #333; font-size: 14px; }
.room-shell .calendar-bill-tabs button.active { border-bottom-color: #008bff; color: #008bff; }
.calendar-bill-filters { display: flex; flex-wrap: wrap; gap: 16px; padding: 16px 0; }
.calendar-bill-filters > label { display: flex; flex-direction: column; gap: 8px; min-width: 160px; font-size: 14px; }
.calendar-bill-filters label > span { display: flex; align-items: center; gap: 8px; }
.calendar-bill-filters input { width: 145px; min-width: 0; }
.calendar-bill-filters select { width: 180px; min-width: 0; }
.calendar-bill-pagination { display: flex; align-items: center; justify-content: flex-end; gap: 12px; padding: 16px 0; font-size: 14px; }
.calendar-bill-pagination button { width: 28px; height: 28px; border: 1px solid #ddd; border-radius: 2px; background: #fff; color: #008bff; cursor: pointer; }
.calendar-bill-pagination button:disabled { color: #bbb; cursor: default; }
.calendar-bill-view .table-card { max-width: 100%; overflow: auto; }
.calendar-bill-view table { table-layout: fixed; min-width: 1100px; }
.calendar-bill-view td { overflow-wrap: anywhere; white-space: normal; }
.room-shell .calendar-channel-view { padding: 12px; background: #fff; }
.room-shell .calendar-channel-view h3 { margin: 0 0 16px; font-size: 17px; font-weight: 400; }
.room-shell .calendar-channel-view h4 { font-size: 15px; font-weight: 400; }
.room-shell .calendar-channel-view > div { display: flex; gap: 16px; padding: 12px 0; border-bottom: 1px solid #eee; font-size: 14px; }
.room-shell .calendar-channel-view strong { font-weight: 400; overflow-wrap: anywhere; }
/* Single-day controls and filters have independent tracks; calendar geometry stays scoped. */
.room-shell .room-board-day { grid-template-rows: 34px minmax(0, 1fr); }
.room-day-modebar { display: flex; align-items: start; min-height: 0; }
.room-day-layout { display: grid; grid-template-columns: minmax(0, 1fr) 280px; gap: 16px; min-height: 0; overflow: hidden; }
.room-day-main { display: grid; grid-template-rows: auto minmax(0, 1fr); min-width: 0; min-height: 0; }
.room-day-actions { display: flex; align-items: center; flex-wrap: wrap; gap: 6px; padding: 4px 0 10px; }
.room-shell .room-day-actions .btn { flex: 0 0 auto; height: 34px; min-height: 34px; padding: 0 10px; border-radius: 2px; font-size: 14px; font-weight: 400; }
.room-day-actions .btn:disabled { background: #a8d6ff; border-color: #a8d6ff; color: #fff; cursor: default; }
.room-day-grid-scroll { min-height: 0; overflow: auto; padding: 0 4px 16px 0; }
.room-shell .room-day-grid-scroll .room-floor-section { margin: 0 0 10px; padding: 0; border: 0; background: transparent; box-shadow: none; }
.room-shell .room-day-grid-scroll .room-floor-head { display: flex; align-items: center; justify-content: space-between; height: 34px; min-height: 34px; margin: 0; padding: 0 2px; border: 0; background: transparent; color: #333; font-size: 14px; }
.room-day-grid-scroll .room-floor-head strong { font-weight: 400; }
.room-day-grid-scroll .room-floor-head > span { display: none; }
.room-shell .room-day-grid-scroll .room-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(130px, 1fr)); gap: 6px; padding: 0; }
.room-shell .room-card.day-room-card { position: relative; display: block; min-width: 0; height: 110px; min-height: 110px; padding: 6px; border: 1px solid transparent; border-radius: 3px; background: #5591f4; color: #fff; box-shadow: none; cursor: pointer; }
.room-shell .day-room-card.empty-dirty { background: #024dc8; }
.room-shell .day-room-card.stay-clean { background: #05b145; }
.room-shell .day-room-card.stay-dirty { background: #0c692e; }
.room-shell .day-room-card.maintenance { background: #ff0000; }
.room-shell .day-room-card.locked { background: #9468b2; }
.room-shell .day-room-card.selected { outline: 2px solid #008bff; outline-offset: 1px; }
.room-shell .day-room-card:hover { transform: none; z-index: 5; }
.day-room-card > .room-hover-detail,
.room-calendar-order.gantt-order > .calendar-order-hover { display: none !important; }
.room-hover-detail.day-room-tooltip,
.room-hover-detail.calendar-room-tooltip { position: fixed; top: 8px; left: 8px; z-index: 88; display: grid; gap: 8px; width: min(420px, calc(100vw - 16px)); max-height: calc(100vh - 16px); overflow: auto; border-radius: 4px; color: #333; pointer-events: none; font-size: 13px; line-height: 22px; box-shadow: 0 3px 12px #0002; overflow-wrap: anywhere; }
.calendar-room-tooltip .room-hover-title { grid-template-columns: minmax(0, 1fr) auto; }
.calendar-room-tooltip .room-hover-title strong { min-width: 0; white-space: normal; }
.day-room-number { display: flex; align-items: center; gap: 5px; height: 19px; font-size: 16px; line-height: 19px; }
.day-room-number small { background: #f0a020; color: #111; padding: 0 2px; font-size: 12px; }
.day-room-select { position: absolute; right: 5px; top: 5px; z-index: 2; display: flex; padding: 2px; background: inherit; }
.day-room-select input { width: 14px; height: 14px; margin: 0; accent-color: #008bff; cursor: pointer; }
.day-room-card:not(:hover):not(:focus-within):not(.selected) .day-room-select { opacity: 0; }
.day-room-next { position: absolute; right: 6px; bottom: 6px; min-width: 16px; height: 16px; padding: 0 2px; border-radius: 2px; background: #fed80a; color: #111; font-size: 12px; line-height: 16px; text-align: center; }
.day-room-rate { display: flex; align-items: center; gap: 3px; height: 19px; font-size: 12px; line-height: 19px; }
.day-room-rate > span { flex: 1; min-width: 0; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; }
.day-room-rate > strong { flex: 0 0 auto; font-size: 12px; font-weight: 400; }
.day-room-guest { overflow: hidden; height: 19px; font-size: 13px; line-height: 19px; white-space: nowrap; text-overflow: ellipsis; }
.day-room-time { height: 18px; font-size: 12px; line-height: 18px; white-space: nowrap; }
.day-room-bottom { display: flex; justify-content: space-between; align-items: center; height: 21px; font-size: 12px; white-space: nowrap; }
.day-room-marks { display: flex; gap: 3px; align-items: center; }
.day-room-marks > span, .day-room-marks > i { display: inline-flex; justify-content: center; align-items: center; min-width: 15px; height: 16px; padding: 0 2px; border-radius: 2px; background: #111; color: #fff; font-size: 12px; line-height: 16px; font-style: normal; }
.day-room-marks > i { background: #ffdf38; color: #222; }
.room-day-filters { display: grid; grid-template-rows: 44px minmax(0, 1fr) 44px; min-width: 0; min-height: 0; background: #fff; color: #333; }
.day-filter-search { display: flex; align-items: center; gap: 8px; padding: 4px 8px; border-bottom: 1px solid #eee; }
.day-filter-search .input { width: 0; min-width: 0; flex: 1; height: 34px; min-height: 34px; padding: 0 8px; border-radius: 3px; font-size: 13px; }
.day-filter-search .btn { flex: 0 0 auto; min-height: 32px; padding: 0 8px; font-size: 13px; }
.day-filter-scroll { min-height: 0; overflow: auto; padding: 0 12px; }
.day-filter-group { padding: 12px 0; border-bottom: 1px solid #eee; }
.day-filter-heading, .day-filter-subtitle { display: flex; justify-content: space-between; align-items: center; gap: 8px; font-size: 13px; }
.day-filter-heading strong { font-size: 14px; font-weight: 400; }
.day-filter-heading button, .day-filter-subtitle button { padding: 0; border: 0; background: transparent; color: #008bff; font-size: 12px; cursor: pointer; }
.day-filter-subtitle { margin: 8px 0; color: #999; }
.day-filter-subtitle button:disabled { color: #bbb; cursor: default; }
.day-filter-options { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px 8px; }
.day-filter-options[hidden] { display: none; }
.day-filter-options label { display: flex; align-items: center; min-width: 0; gap: 5px; font-size: 13px; cursor: pointer; }
.day-filter-options input { flex: 0 0 auto; width: 14px; height: 14px; margin: 0; accent-color: #008bff; }
.day-filter-options label > span { min-width: 0; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; }
.day-filter-options em { margin-left: auto; flex: 0 0 auto; font-style: normal; color: #666; }
.day-filter-group:has([data-day-filter='type']) .day-filter-options { grid-template-columns: minmax(0, 1fr); }
.day-filter-group .select { width: 100%; margin-top: 10px; min-height: 34px; height: 34px; font-size: 13px; border-radius: 3px; }
.room-shell .day-filter-reset { margin: 6px 12px; min-height: 32px; height: 32px; border-radius: 3px; color: #008bff; font-size: 13px; }
.room-shell .room-board-future { grid-template-rows: auto minmax(0, 1fr); }
.room-shell .room-board-future .room-filter-bar { height: auto; min-height: 44px; flex-wrap: wrap; padding: 8px; }
.room-board-future .room-filter-bar .input { width: 180px; }
.room-board-future .room-filter-bar .select { width: 160px; }
.room-board-future .room-future-board { min-height: 0; overflow: auto; }
.day-context-backdrop { position: fixed; inset: 0; z-index: 89; background: transparent; }
.day-room-context { position: fixed; z-index: 90; width: 160px; padding: 4px; border: 1px solid #eee; border-radius: 3px; background: #fff; color: #333; box-shadow: 0 3px 12px #0002; }
.day-room-context button { display: block; width: 100%; height: 34px; padding: 0 12px; border: 0; border-radius: 2px; background: #fff; color: #333; font-size: 14px; text-align: left; cursor: pointer; }
.day-room-context button:hover, .day-room-context button:focus-visible { background: #e6f4ff; color: #008bff; }
.modal-backdrop:has(.order-entry) { place-items: stretch end; padding: 0; z-index: 100; }
.modal:has(.order-entry) { width: min(820px, 100vw); height: 100vh; max-height: 100vh; border-radius: 0; overflow: hidden; }
.order-entry { display: flex; flex-direction: column; height: 100%; min-width: 0; color: #333; background: #fff; }
.order-entry .modal-head { flex: 0 0 54px; padding: 0 20px; border-bottom: 1px solid #eee; }
.order-entry .modal-head h3 { font-size: 18px; font-weight: 400; }
.order-entry .modal-head .btn { width: 24px; height: 24px; min-height: 24px; padding: 0; border: 0; background: #f5f5f5; color: #777; font-size: 22px; }
.entry-scroll { flex: 1; min-height: 0; overflow: auto; padding: 0 20px; }
.entry-scroll > section { padding: 18px 0; border-bottom: 1px solid #eee; }
.entry-scroll h4 { margin: 0 0 16px; padding-left: 8px; border-left: 3px solid #008bff; font-size: 16px; font-weight: 400; }
.entry-section-heading { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin-bottom: 16px; }
.entry-section-heading h4 { margin: 0; }
.entry-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px; }
.entry-field { display: flex; flex-direction: column; min-width: 0; gap: 8px; font-size: 14px; }
.order-entry .input, .order-entry .select, .order-entry .textarea { width: 100%; min-width: 0; border-radius: 3px; font-size: 14px; }
.order-entry .input, .order-entry .select { height: 34px; min-height: 34px; padding: 0 8px; }
.order-entry .input:disabled { background: #f5f5f5; color: #999; }
.order-entry .textarea { min-height: 76px; padding: 8px; }
.order-entry .btn { min-height: 32px; height: 32px; padding: 0 12px; border-radius: 3px; font-size: 14px; font-weight: 400; }
.entry-order-types { display: flex; gap: 24px; padding-bottom: 20px; font-size: 14px; }
.entry-order-types label { display: inline-flex; align-items: center; gap: 6px; }
.entry-room-row { padding: 16px 0; border-top: 1px dashed #ddd; }
.entry-room-top { display: grid; grid-template-columns: minmax(160px, 2fr) minmax(80px, 1fr) minmax(80px, 1fr) 32px; gap: 12px; align-items: end; margin-bottom: 14px; }
.entry-room-top:has([data-entry-key="hourlyRuleId"]) { grid-template-columns: minmax(140px, 2fr) minmax(130px, 2fr) minmax(70px, 1fr) minmax(70px, 1fr) 32px; }
.entry-room-top > .btn, .entry-money-row > .btn { width: 32px; padding: 0; font-size: 20px; color: #999; }
.entry-room-picker { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 10px; max-height: 240px; overflow: auto; padding: 12px; margin-bottom: 14px; border: 1px solid #ddd; }
.entry-room-picker label { display: flex; align-items: center; gap: 6px; font-size: 13px; }
.entry-room-picker label:has(:disabled) { color: #aaa; }
.entry-money-row { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) minmax(0, 1fr) 32px; align-items: end; gap: 12px; margin-bottom: 12px; }
.entry-color { display: flex; align-items: center; gap: 16px; margin-top: 16px; font-size: 14px; }
.entry-color input { width: 28px; height: 28px; border: 0; padding: 0; background: transparent; }
.entry-footer { flex: 0 0 auto; padding: 14px 20px; border-top: 1px solid #eee; background: #fff; }
.entry-print { display: flex; align-items: center; gap: 6px; font-size: 14px; margin-bottom: 12px; }
.entry-totals { display: flex; flex-wrap: wrap; gap: 12px 32px; padding: 10px 12px; margin-bottom: 14px; background: #f7f7fa; font-size: 14px; }
.entry-totals strong { color: #f5222d; font-weight: 400; }
.entry-footer .actions { justify-content: flex-end; }
.order-entry input[type='checkbox'], .order-entry input[type='radio'] { accent-color: #008bff; }
@media (max-width: 620px) {
  .entry-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .entry-room-top { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) 32px; }
  .entry-room-top > .entry-field:first-child { grid-column: 1 / -1; }
  .entry-room-top:has([data-entry-key="hourlyRuleId"]) { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) 32px; }
  .entry-room-top:has([data-entry-key="hourlyRuleId"]) > .entry-field:nth-child(2) { grid-column: 1 / -1; }
  .entry-money-row { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) 32px; }
  .entry-money-row > .entry-field:first-child { grid-column: 1 / -1; }
  .entry-room-picker { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 900px) {
  .room-shell .header-actions { display: none; }
  .room-shell .app-header { min-width: 780px; }
  .room-shell .calendar-topbar { min-width: 590px; }
  .room-shell .main-room .content { overflow-x: auto; }
  .room-shell .room-board-page { min-width: 590px; }
  .room-shell .calendar-order-drawer { grid-template-columns: 220px minmax(0, 1fr); min-width: 740px; }
  .room-shell .modal:has(.calendar-order-drawer) { overflow-x: auto; }
}
