/* Front Desk is a section inside the shared portal frame. The outer logo,
   navigation, hotel scope and phone menu use the same layout on every page.
   This final layer retires the legacy viewport-sized inner shell. */
html body #view-operationsmode #bpOpsModeShell {
  display:grid!important;
  grid-template-columns:200px minmax(0,1fr)!important;
  align-items:start;
  gap:20px;
  width:100%!important;
  height:auto!important;
  min-height:0!important;
  overflow:visible!important;
  background:transparent!important;
  border:0!important;
  border-radius:0!important;
  box-shadow:none!important;
}
html body #view-operationsmode #bpOpsModeShell .bp-ops-sidebar {
  position:sticky!important;
  top:88px!important;
  z-index:2!important;
  display:flex!important;
  flex-direction:column!important;
  width:100%!important;
  height:auto!important;
  min-height:0!important;
  max-height:calc(100dvh - 108px);
  padding:0 12px 0 0!important;
  overflow:auto!important;
  background:transparent!important;
  color:var(--inn-ink,#193047)!important;
  border:0!important;
  border-right:1px solid var(--inn-line,#dbe4e9)!important;
  border-radius:0!important;
  box-shadow:none!important;
}
html body #view-operationsmode #bpOpsModeShell :is(.bp-ops-brand,.bp-ops-exit,.bp-ops-mobile-exit) { display:none!important }
html body #view-operationsmode #bpOpsModeShell .bp-ops-property { display:grid!important;width:100%!important;margin:0 0 12px!important;gap:6px!important }
html body #view-operationsmode #bpOpsModeShell .bp-ops-property label { display:block!important;color:var(--inn-muted,#526779)!important;font-size:12px!important;margin:0!important }
html body #view-operationsmode #bpOpsModeShell .bp-ops-property select { background:var(--inn-surface,#fff)!important;color:var(--inn-ink,#193047)!important;border:1px solid var(--inn-line,#dbe4e9)!important;border-radius:8px!important;font-weight:500!important;min-height:40px!important }
html body #view-operationsmode #bpOpsModeShell .bp-ops-nav { display:flex!important;flex-direction:column!important;gap:2px!important;width:100%!important;padding:0!important;overflow:visible!important;flex:0 0 auto!important }
html body #view-operationsmode #bpOpsModeShell .bp-ops-nav-group { display:block!important;color:var(--inn-muted,#526779)!important;margin:14px 9px 5px!important;font-size:10px!important }
html body #view-operationsmode #bpOpsModeShell .bp-ops-nav button {
  grid-template-columns:20px minmax(0,1fr) auto!important;
  gap:8px!important;
  min-width:0!important;
  min-height:40px!important;
  padding:8px 9px!important;
  margin:0!important;
  border:1px solid transparent!important;
  border-radius:8px!important;
  background:transparent!important;
  color:var(--inn-ink,#193047)!important;
  font-size:13px!important;
  line-height:1.4!important;
  font-weight:500!important;
  transform:none!important;
  box-shadow:none!important;
}
html body #view-operationsmode #bpOpsModeShell .bp-ops-nav button:hover { background:var(--inn-surface-alt,#edf2f3)!important }
html body #view-operationsmode #bpOpsModeShell .bp-ops-nav button.on { background:var(--inn-surface,#fff)!important;border-color:var(--inn-line,#dbe4e9)!important;color:var(--inn-action,#205b77)!important;font-weight:650!important }
html body #view-operationsmode #bpOpsModeShell .bp-ops-nav button>span:not(.bp-ops-nav-icon) { display:block!important }
html body #view-operationsmode #bpOpsModeShell .bp-ops-nav button.on .bp-ops-nav-icon { color:inherit!important }
html body #view-operationsmode #bpOpsModeShell .bp-ops-workspace { width:100%!important;min-width:0!important;height:auto!important;min-height:0!important;padding:0!important;overflow:visible!important;background:transparent!important }
html body #view-operationsmode #bpOpsModeShell .bp-ops-topbar { position:static!important;min-height:0!important;margin:0 0 16px!important;padding:0 0 14px!important;gap:12px!important;flex-wrap:wrap!important;background:transparent!important;backdrop-filter:none!important;border-bottom:1px solid var(--inn-line,#dbe4e9)!important }
html body #view-operationsmode #bpOpsModeShell .bp-ops-eyebrow { display:none!important }
html body #view-operationsmode #bpOpsModeShell .bp-ops-topbar h2 { font-size:20px!important }
html body #view-operationsmode #bpOpsModeShell .bp-ops-top-actions { margin-left:auto }
html body #view-operationsmode #bpOpsModeShell .bp-ops-activity { height:auto!important;max-height:420px!important;overflow:auto!important }
/* A saved entry preference gives Front Desk the full canvas without replacing
   the shared header. The normal phone drawer keeps its existing behavior. */
#bpFrontDeskMainMenu { display:none!important }
@media(min-width:1025px) {
  html body.bp-compact-layout.bp-frontdesk-main-menu-hidden .app { grid-template-columns:minmax(0,1fr)!important }
  html body.bp-frontdesk-main-menu-hidden .app > #sidebar { display:none!important }
  html body.bp-frontdesk-view-active #bpFrontDeskMainMenu:not([hidden]) { display:inline-flex!important;align-items:center;justify-content:center;gap:6px;min-height:38px;padding:8px 10px;white-space:nowrap;font-size:12px;border:1px solid var(--inn-line,#dbe4e9);border-radius:8px;background:var(--inn-surface,#fff);color:var(--inn-ink,#193047) }
}
html body #view-operationsmode #bpOpsModeShell .bp-fd-layout-settings { position:relative;align-self:flex-end }
html body #view-operationsmode #bpOpsModeShell .bp-fd-layout-settings > summary { display:flex;align-items:center;gap:7px;cursor:pointer;list-style:none;min-height:40px;padding:8px 12px;background:var(--inn-surface,#fff);border:1px solid var(--inn-line,#dbe4e9);border-radius:8px;color:var(--inn-ink,#193047) }
.bp-fd-layout-settings > summary::-webkit-details-marker { display:none }
.bp-fd-layout-settings > summary::after { content:'⌄' }
.bp-fd-layout-settings[open] > summary::after { content:'⌃' }
html body #view-operationsmode #bpOpsModeShell .bp-fd-layout-options { position:absolute;right:0;top:calc(100% + 6px);z-index:30;width:280px;max-width:calc(100vw - 40px);padding:12px;background:var(--inn-surface,#fff);color:var(--inn-ink,#193047);border:1px solid var(--inn-line,#dbe4e9);border-radius:10px;box-shadow:0 8px 24px #16382620 }
html body #view-operationsmode #bpOpsModeShell .bp-fd-layout-options label { display:flex!important;align-items:flex-start;gap:9px;min-height:44px;font-size:13px;line-height:1.5;cursor:pointer }
html body #view-operationsmode #bpOpsModeShell .bp-fd-layout-options input { width:18px!important;height:18px!important;min-height:18px!important;flex:0 0 18px;margin:2px 0 0;accent-color:var(--inn-action,#205b77) }
html body #view-operationsmode #bpOpsModeShell .bp-fd-layout-options p { display:block!important;margin:4px 0 0!important;font-size:12px!important;line-height:1.5;color:var(--inn-muted,#526779) }
@media(max-width:820px) {
  html body #view-operationsmode #bpOpsModeShell { grid-template-columns:minmax(0,1fr)!important;gap:16px }
  html body #view-operationsmode #bpOpsModeShell .bp-ops-sidebar { position:static!important;max-height:none;padding:0 0 12px!important;border-right:0!important;border-bottom:1px solid var(--inn-line,#dbe4e9)!important;overflow:visible!important }
  html body #view-operationsmode #bpOpsModeShell .bp-ops-property { max-width:360px;margin:0 0 10px!important }
  html body #view-operationsmode #bpOpsModeShell .bp-ops-property select { min-height:44px!important;font-size:16px!important }
  html body #view-operationsmode #bpOpsModeShell .bp-ops-nav { flex-direction:row!important;overflow-x:auto!important;overflow-y:hidden!important;padding:3px!important;gap:6px!important;scroll-padding:3px }
  html body #view-operationsmode #bpOpsModeShell .bp-ops-nav-group { display:none!important }
  html body #view-operationsmode #bpOpsModeShell .bp-ops-nav button { flex:0 0 auto!important;width:auto!important;min-height:44px!important;grid-template-columns:20px auto auto!important;white-space:nowrap!important }
  html body #view-operationsmode #bpOpsModeShell .bp-ops-top-actions { margin-left:0 }
  html body #view-operationsmode #bpOpsModeShell .bp-ops-date-control span { display:block!important }
}