/* HotelPreflight v0.11.4 — REA Cloud inspired left-sidebar layout. */
:root{
  --sidebar-width:260px;
  --sidebar-bg:#0c2346;
  --sidebar-bg-2:#102b55;
  --sidebar-text:#e9f0ff;
  --sidebar-muted:#91a7cc;
  --sidebar-active:#ffffff;
  --sidebar-accent:#2f6fff;
}

#appShell{
  min-height:100vh;
  display:grid;
  grid-template-columns:var(--sidebar-width) minmax(0,1fr);
  grid-template-rows:auto auto 1fr;
  background:linear-gradient(180deg,#f4f7fc 0%,#eef3fb 100%);
}

.rea-sidebar{
  grid-column:1;
  grid-row:1 / span 3;
  position:sticky;
  top:0;
  align-self:start;
  height:100vh;
  z-index:20;
  display:flex;
  flex-direction:column;
  padding:18px 14px 16px;
  color:var(--sidebar-text);
  background:linear-gradient(180deg,var(--sidebar-bg-2) 0%,var(--sidebar-bg) 100%);
  border-right:1px solid rgba(255,255,255,.08);
  box-shadow:12px 0 32px rgba(11,29,57,.10);
  overflow:auto;
}

.rea-sidebar-brand{
  display:flex;
  align-items:center;
  gap:11px;
  padding:4px 6px 20px;
  margin-bottom:10px;
  border-bottom:1px solid rgba(255,255,255,.10);
}
.rea-sidebar-logo{
  width:62px;
  height:62px;
  flex:0 0 62px;
  display:grid;
  place-items:center;
  border-radius:15px;
  background:#fff;
  box-shadow:0 8px 20px rgba(0,0,0,.16);
  overflow:hidden;
}
.rea-sidebar .rea-sidebar-logo .brand-logo{
  width:58px!important;
  height:58px!important;
  min-width:58px!important;
  min-height:58px!important;
  max-width:58px!important;
  max-height:58px!important;
  flex-basis:58px!important;
}
.rea-sidebar-brand-copy{min-width:0}
.rea-sidebar-brand-copy strong{display:block;font-size:16px;letter-spacing:-.01em;color:#fff}
.rea-sidebar-brand-copy small{display:block;margin-top:4px;font-size:10px;line-height:1.35;color:#a9bcdd}

.rea-sidebar-nav{display:grid;gap:5px}
.rea-sidebar .workspace-tab,
.rea-sidebar .pms-subtab{
  position:relative;
  width:100%;
  border:0;
  display:flex;
  align-items:center;
  justify-content:flex-start;
  text-align:left;
  cursor:pointer;
  transition:background .16s ease,color .16s ease,transform .16s ease,border-color .16s ease;
}
.rea-sidebar .workspace-tab{
  min-height:46px;
  padding:11px 12px 11px 42px;
  border-radius:11px;
  background:transparent;
  color:#d8e4f8;
  font-weight:800;
  box-shadow:none;
}
.rea-sidebar .workspace-tab::before{
  position:absolute;
  left:14px;
  width:18px;
  text-align:center;
  font-size:16px;
  line-height:1;
  color:#8eabd8;
}
.rea-sidebar #preflightTab::before{content:"✓"}
.rea-sidebar #pmsTab::before{content:"▦"}
.rea-sidebar .workspace-tab:hover{background:rgba(255,255,255,.07);color:#fff;transform:none}
.rea-sidebar .workspace-tab.active{
  background:linear-gradient(90deg,rgba(47,111,255,.28) 0%,rgba(47,111,255,.12) 100%);
  color:#fff;
  box-shadow:inset 3px 0 0 var(--sidebar-accent);
}
.rea-sidebar .workspace-tab.active::before{color:#fff}

.rea-sidebar-subnav{
  display:grid;
  gap:3px;
  margin:0 0 8px 14px;
  padding:4px 0 7px 15px;
  border-left:1px solid rgba(255,255,255,.12);
}
.rea-sidebar .pms-subtab{
  min-height:38px;
  padding:8px 10px 8px 35px;
  border-radius:9px;
  background:transparent;
  color:var(--sidebar-muted);
  font-size:13px;
  font-weight:750;
}
.rea-sidebar .pms-subtab::before{
  position:absolute;
  left:11px;
  width:15px;
  text-align:center;
  color:#6f8fbd;
  font-size:12px;
}
.rea-sidebar .pms-subtab[data-pms-view="overview"]::before{content:"◫"}
.rea-sidebar .pms-subtab[data-pms-view="calendar"]::before{content:"▦"}
.rea-sidebar .pms-subtab[data-pms-view="reservations"]::before{content:"≡"}
.rea-sidebar .pms-subtab[data-pms-view="guests"]::before{content:"●"}
.rea-sidebar .pms-subtab[data-pms-view="rooms"]::before{content:"▣"}
.rea-sidebar .pms-subtab:hover{background:rgba(255,255,255,.06);color:#f7faff}
.rea-sidebar .pms-subtab.active{background:rgba(255,255,255,.08);color:#c8d8f2;box-shadow:none}
.rea-sidebar #pmsTab.active + .rea-sidebar-subnav .pms-subtab.active{
  background:#fff;
  color:#18345f;
  box-shadow:0 7px 16px rgba(0,0,0,.12);
}
.rea-sidebar #pmsTab.active + .rea-sidebar-subnav .pms-subtab.active::before{color:#2d62b9}

.rea-sidebar-footer{
  margin-top:auto;
  padding:16px 9px 4px;
  color:#7692be;
  font-size:11px;
  border-top:1px solid rgba(255,255,255,.08);
}

.topbar{
  grid-column:2;
  grid-row:1;
  height:70px;
  padding:0 26px;
  background:rgba(255,255,255,.97);
  color:#172033;
  border-bottom:1px solid #dde5f1;
  box-shadow:0 8px 22px rgba(16,37,74,.06);
  justify-content:flex-end;
  backdrop-filter:blur(10px);
}
.topbar .brand{display:none}
.topbar .top-actions{width:100%;justify-content:flex-end}
.topbar select{background:#fff;color:#233a62;border-color:#cfd9e9}
.topbar .secondary{background:#fff;color:#203a65;border-color:#cfd9e9}
.topbar .secondary:hover{background:#f5f8fc}
.topbar .top-user{color:#31496d;font-weight:650}

.page{
  grid-column:2;
  grid-row:3;
  width:100%;
  max-width:none;
  margin:0;
  padding:28px 30px 60px;
  min-width:0;
}
.hero{margin-bottom:18px}
.hero h1{font-size:30px}
.pms-heading{margin-top:0}

/* The old horizontal navigations are replaced by the sidebar. */
.workspace-tabs,.pms-subnav{display:none!important}


/* HotelPreflight v0.11.5 — moving slogan directly below the header. */
.slogan-ticker{
  grid-column:2;
  grid-row:2;
  height:34px;
  overflow:hidden;
  position:relative;
  display:flex;
  align-items:center;
  background:linear-gradient(90deg,#102b55 0%,#173d73 55%,#102b55 100%);
  border-bottom:1px solid rgba(12,35,70,.16);
  color:#f7faff;
  box-shadow:0 5px 14px rgba(16,37,74,.07);
}
.slogan-ticker::before,.slogan-ticker::after{
  content:"";position:absolute;z-index:2;top:0;bottom:0;width:42px;pointer-events:none;
}
.slogan-ticker::before{left:0;background:linear-gradient(90deg,#102b55,rgba(16,43,85,0))}
.slogan-ticker::after{right:0;background:linear-gradient(270deg,#102b55,rgba(16,43,85,0))}
.slogan-ticker-track{
  display:flex;align-items:center;width:max-content;min-width:max-content;height:100%;will-change:transform;
  animation:hpf-slogan-scroll 24s linear infinite;
}
.slogan-ticker-group{
  flex:0 0 auto;display:flex;align-items:center;gap:24px;padding-right:24px;white-space:nowrap;
}
.slogan-ticker-text{font-size:12px;font-weight:750;letter-spacing:.025em;color:#f7faff}
.slogan-ticker-brand{font-size:11px;font-weight:900;letter-spacing:.08em;text-transform:uppercase;color:#dbe7ff}
.slogan-ticker-mark{font-size:12px;color:#e0b75d;filter:drop-shadow(0 0 5px rgba(224,183,93,.25))}
.slogan-ticker:hover .slogan-ticker-track{animation-play-state:paused}
@keyframes hpf-slogan-scroll{from{transform:translateX(0)}to{transform:translateX(-50%)}}
@media(prefers-reduced-motion:reduce){
  .slogan-ticker-track{animation:none;transform:none}
  .slogan-ticker-group[aria-hidden="true"]{display:none}
}

@media(max-width:1100px){
  :root{--sidebar-width:225px}
  .rea-sidebar-brand-copy small{display:none}
  .rea-sidebar-logo{width:54px;height:54px;flex-basis:54px}
  .rea-sidebar .rea-sidebar-logo .brand-logo{width:50px!important;height:50px!important;min-width:50px!important;min-height:50px!important;max-width:50px!important;max-height:50px!important;flex-basis:50px!important}
  .page{padding-left:20px;padding-right:20px}
}

@media(max-width:780px){
  #appShell{display:block;min-height:100vh}
  .rea-sidebar{
    position:sticky;
    top:0;
    width:100%;
    height:auto;
    padding:8px 10px;
    display:block;
    overflow-x:auto;
    overflow-y:hidden;
    border-right:0;
    border-bottom:1px solid rgba(255,255,255,.12);
  }
  .rea-sidebar-brand{display:none}
  .rea-sidebar-nav{display:flex;align-items:center;gap:6px;min-width:max-content}
  .rea-sidebar .workspace-tab{width:auto;min-height:40px;padding:8px 12px 8px 34px}
  .rea-sidebar .workspace-tab::before{left:11px}
  .rea-sidebar-subnav{display:flex;margin:0;padding:0 0 0 4px;border:0;gap:4px}
  .rea-sidebar .pms-subtab{width:auto;min-height:36px;padding:7px 10px 7px 29px}
  .rea-sidebar .pms-subtab::before{left:8px}
  .rea-sidebar-footer{display:none}
  .topbar{height:auto;min-height:62px;padding:10px 12px;position:sticky;top:56px;z-index:8}
  .slogan-ticker{height:32px}
  .slogan-ticker-track{animation-duration:21s}
  .slogan-ticker-text{font-size:11px}
  .topbar .top-actions{gap:7px;flex-direction:row;align-items:center;flex-wrap:wrap;justify-content:flex-end}
  .topbar .top-user{gap:6px}
  .topbar #userEmail{display:none}
  .page{padding:18px 12px 50px}
}

/* HotelPreflight v0.11.6 — collapsible Preflight / PMS sidebar groups. */
.rea-sidebar .workspace-tab::after{
  content:"›";
  position:absolute;
  right:13px;
  top:50%;
  transform:translateY(-50%) rotate(0deg);
  color:#7898c7;
  font-size:20px;
  font-weight:500;
  line-height:1;
  transition:transform .18s ease,color .18s ease;
}
.rea-sidebar .workspace-tab[aria-expanded="true"]::after{
  transform:translateY(-50%) rotate(90deg);
  color:#fff;
}
.rea-sidebar-subnav.is-collapsed{display:none!important}
.rea-sidebar-subnav:not(.is-collapsed){animation:hpf-sidebar-open .16s ease-out}
@keyframes hpf-sidebar-open{
  from{opacity:0;transform:translateY(-4px)}
  to{opacity:1;transform:translateY(0)}
}

.rea-sidebar .preflight-subtab{
  position:relative;
  width:100%;
  min-height:38px;
  padding:8px 10px 8px 35px;
  border:0;
  border-radius:9px;
  background:transparent;
  color:var(--sidebar-muted);
  font-size:13px;
  font-weight:750;
  display:flex;
  align-items:center;
  justify-content:flex-start;
  text-align:left;
  cursor:pointer;
  transition:background .16s ease,color .16s ease,box-shadow .16s ease;
}
.rea-sidebar .preflight-subtab::before{
  position:absolute;
  left:11px;
  width:15px;
  text-align:center;
  color:#6f8fbd;
  font-size:12px;
}
.rea-sidebar .preflight-subtab[data-preflight-view="overview"]::before{content:"◫"}
.rea-sidebar .preflight-subtab[data-preflight-view="incidents"]::before{content:"!";font-weight:900}
.rea-sidebar .preflight-subtab[data-preflight-view="ready"]::before{content:"✓"}
.rea-sidebar .preflight-subtab[data-preflight-view="risk"]::before{content:"△"}
.rea-sidebar .preflight-subtab[data-preflight-view="blocked"]::before{content:"×";font-size:15px}
.rea-sidebar .preflight-subtab:hover{background:rgba(255,255,255,.06);color:#f7faff}
.rea-sidebar .preflight-subtab.active{background:rgba(255,255,255,.08);color:#c8d8f2;box-shadow:none}
.rea-sidebar #preflightTab.active + .rea-sidebar-subnav .preflight-subtab.active{
  background:#fff;
  color:#18345f;
  box-shadow:0 7px 16px rgba(0,0,0,.12);
}
.rea-sidebar #preflightTab.active + .rea-sidebar-subnav .preflight-subtab.active::before{color:#2d62b9}

@media(max-width:780px){
  .rea-sidebar .workspace-tab{padding-right:34px}
  .rea-sidebar .preflight-subtab{width:auto;min-height:36px;padding:7px 10px 7px 29px}
  .rea-sidebar .preflight-subtab::before{left:8px}
  .rea-sidebar-subnav:not(.is-collapsed){display:flex}
}

/* HotelPreflight v0.12.0 — shell alignment with the unified content surfaces. */
.topbar{min-height:70px;}
.topbar .top-actions{gap:9px;}
.topbar #langSelect{min-height:40px;padding:9px 12px;border-radius:10px;}
.topbar .secondary{min-height:40px;padding:9px 12px;}
.rea-sidebar{box-shadow:10px 0 28px rgba(11,29,57,.09);}
.rea-sidebar .workspace-tab,.rea-sidebar .pms-subtab,.rea-sidebar .preflight-subtab{letter-spacing:.005em;}
.page{max-width:1640px;margin:0 auto;}

@media(max-width:780px){
  .topbar{top:56px;}
  .topbar #langSelect{min-width:74px;}
}
