/* GotItOps v5.6.7 — mobile navigation drawer and phone-density refinements. */
.mobileMenuButton,.mobileMenuBackdrop{display:none}

@media(max-width:760px){
  body.mobileNavOpen{overflow:hidden!important;touch-action:none}
  .mobileMenuButton{display:flex;position:fixed;top:calc(env(safe-area-inset-top,0px) + 10px);left:12px;width:44px;height:44px;border:1px solid #d7e0ea;border-radius:11px;background:#fff;color:#526171;align-items:center;justify-content:center;flex-direction:column;gap:4px;z-index:1302;box-shadow:0 5px 18px rgba(32,49,68,.13);padding:0}
  .mobileMenuButton span{display:block;width:20px;height:2px;border-radius:999px;background:currentColor}
  .mobileMenuButton:focus-visible{outline:3px solid #cfe0ff;outline-offset:2px}
  .mobileMenuButton[aria-expanded="true"]{color:var(--accent);background:#f7faff}
  .mobileMenuBackdrop{display:block;position:fixed;inset:0;background:rgba(28,39,51,.38);opacity:0;pointer-events:none;transition:opacity .18s ease;z-index:1198}
  body.mobileNavOpen .mobileMenuBackdrop{opacity:1;pointer-events:auto}

  .sidebar,.app.sidebarCollapsed .sidebar{position:fixed!important;inset:0 auto 0 0!important;top:0!important;left:0!important;width:min(330px,86vw)!important;height:100dvh!important;max-height:100dvh!important;transform:translateX(-105%);transition:transform .2s ease!important;z-index:1200!important;overflow-y:auto!important;overflow-x:hidden!important;overscroll-behavior:contain;background:#eef5fb!important;border-right:1px solid #d9e4ee!important;border-bottom:0!important;box-shadow:12px 0 34px rgba(35,50,66,.18);padding:calc(env(safe-area-inset-top,0px) + 68px) 14px calc(env(safe-area-inset-bottom,0px) + 18px)!important;display:flex!important;flex-direction:column!important;gap:14px!important}
  body.mobileNavOpen .sidebar{transform:translateX(0)}
  .sidebarToggle{display:none!important}
  .sidebar .brand,.app.sidebarCollapsed .sidebar .brand{display:flex!important;align-items:center!important;justify-content:flex-start!important;gap:11px!important;position:absolute!important;top:calc(env(safe-area-inset-top,0px) + 14px)!important;left:14px!important;right:14px!important;min-height:42px!important;padding:0 0 11px!important;border-bottom:1px solid #d9e4ee}
  .sidebar .brandcopy,.app.sidebarCollapsed .sidebar .brandcopy,.app.sidebarCollapsed .brand>div:nth-child(2){display:block!important;min-width:0}
  .sidebar .brandname{font-size:19px!important;line-height:1.1}.sidebar .brandtagline{font-size:11px;color:#8291a0;margin-top:2px}
  .sidebar .mark,.app.sidebarCollapsed .sidebar .mark{width:38px!important;height:38px!important;flex:0 0 38px!important}
  .sidebar .nav,.app.sidebarCollapsed .sidebar .nav{display:flex!important;flex-direction:column!important;gap:4px!important;min-width:0!important;width:100%!important;overflow:visible!important}
  .sidebar .nav button,.app.sidebarCollapsed .sidebar .nav button{display:flex!important;width:100%!important;min-width:0!important;min-height:48px!important;justify-content:flex-start!important;align-items:center!important;gap:11px!important;padding:11px 12px!important;border-radius:10px!important;text-align:left!important}
  .sidebar .navtext,.app.sidebarCollapsed .sidebar .navtext{display:block!important;flex:1 1 auto!important;font-size:14px!important;line-height:1.2!important;white-space:normal!important}
  .sidebar .ico,.app.sidebarCollapsed .sidebar .ico{width:22px!important;height:22px!important;flex:0 0 22px!important}.sidebar .ico svg{width:21px!important;height:21px!important}
  .sidebar .countbubble,.app.sidebarCollapsed .sidebar .countbubble{display:inline-grid!important;margin-left:auto!important;flex:0 0 auto!important}
  .sidebar .sideblock,.sidebar .sidefoot,.app.sidebarCollapsed .sideblock,.app.sidebarCollapsed .sidefoot{display:none!important}

  .topbar{position:sticky!important;top:0!important;z-index:1100!important;min-height:64px!important;height:auto!important;padding:calc(env(safe-area-inset-top,0px) + 9px) 10px 9px 64px!important;gap:7px!important;background:rgba(255,255,255,.96)!important}
  .topbar h2{font-size:15px!important;line-height:1.2!important;min-width:64px}
  .topActions{min-width:0!important;gap:5px!important;justify-content:flex-end!important;flex-wrap:wrap!important}
  #cloudWorkspaceSelector{min-width:0!important;width:min(100%,245px)!important;max-width:245px!important;min-height:42px!important}
  .testModeBar{position:static!important;padding:8px 10px!important;line-height:1.35!important;align-items:flex-start!important}

  /* Keep the Events controls useful without making the phone scroll through a full screen of filters. */
  #events .cardhead{display:block!important}
  #events .eventFilterGrid{grid-template-columns:1fr 1fr!important;gap:8px!important}
  #events .eventFilterGrid .field:nth-child(3){grid-column:1/-1!important}
  #events #eventResultCount{margin-top:8px!important;display:block!important}
  #events .chips{flex-wrap:nowrap!important;overflow-x:auto!important;overscroll-behavior-x:contain;padding-bottom:4px!important;scrollbar-width:none}
  #events .chips::-webkit-scrollbar{display:none}#events .chip{flex:0 0 auto!important;white-space:nowrap!important}
  #events .bulkbar{justify-content:space-between!important}
}

@media(max-width:460px){
  /* Event cards use one readable column on narrow phones; the filter controls remain two-up. */
  #events .localTable.masterWideTable tbody tr{grid-template-columns:1fr!important}
  #events .localTable.masterWideTable tbody td:nth-child(5),#events .localTable.masterWideTable tbody td:nth-child(6),#events .localTable.masterWideTable tbody td:nth-child(9){grid-column:auto!important}
}

/* v5.59.268 — visible feedback before a phone page begins rendering. */
#g268PageLoading[hidden]{display:none!important}
@media(max-width:760px){
 #g268PageLoading{position:fixed;top:calc(env(safe-area-inset-top,0px) + 68px);left:12px;right:12px;z-index:1450;display:flex;align-items:center;gap:10px;padding:12px 14px;border:1px solid #d7e0ea;border-radius:11px;background:#fff;color:#303c4d;box-shadow:0 5px 18px rgba(32,49,68,.16);font-size:14px;font-weight:650;pointer-events:none}
 .g268NavSpinner{width:18px;height:18px;flex:0 0 18px;border:2px solid #d7e0ea;border-top-color:var(--accent,#4f7fea);border-radius:50%;animation:g268NavSpin .7s linear infinite}
}
@keyframes g268NavSpin{to{transform:rotate(360deg)}}
@media(prefers-reduced-motion:reduce){.g268NavSpinner{animation:none}}
@media(min-width:761px){#g268PageLoading{display:none!important}}

/* v5.6.8 — keep detail drawers closable above mobile chrome. */
@media(max-width:760px){
  .drawerBackdrop.open{z-index:1500!important}
  .drawerBackdrop.open .drawer{width:100vw!important;height:100dvh!important;max-height:100dvh!important;top:0!important;bottom:auto!important;right:0!important;display:flex!important;flex-direction:column!important;padding-top:env(safe-area-inset-top,0px)!important}
  .drawerBackdrop.open .drawerhead{position:sticky!important;top:0!important;z-index:3!important;background:#fff!important;padding:calc(env(safe-area-inset-top,0px) + 12px) 14px 12px!important;align-items:center!important;box-shadow:0 1px 0 var(--line)!important}
  .drawerBackdrop.open .drawerhead .close{display:inline-flex!important;align-items:center!important;justify-content:center!important;flex:0 0 44px!important;width:44px!important;height:44px!important;min-height:44px!important;border:1px solid #d7e0ea!important;background:#f7f9fc!important;color:#394b5d!important;border-radius:11px!important;font-size:26px!important;font-weight:700!important;line-height:1!important}
  .drawerBackdrop.open .drawerbody{flex:1 1 auto!important;min-height:0!important;overflow-y:auto!important;-webkit-overflow-scrolling:touch!important;padding:14px 14px calc(env(safe-area-inset-bottom,0px) + 24px)!important}
  body:has(.drawerBackdrop.open) .mobileMenuButton{display:none!important}
}

/* v5.7.0 — Bookings list has 7 columns after moving references into detail. */
@media(max-width:760px){
 #bookings tbody td:nth-child(6){display:block!important;grid-column:1/-1!important}
 #bookings tbody td:nth-child(7){display:block!important;grid-column:1/-1!important}
 #bookings tbody td:nth-child(6)::before{content:'Operational Event'!important}
 #bookings tbody td:nth-child(7)::before{content:'Actions'!important}
 #bookings tbody td:nth-child(7) .inlineActions{display:grid!important;grid-template-columns:1fr 1fr;gap:7px}
 #bookings tbody td:nth-child(7) .btn{width:100%;min-height:42px}
}