/* Authenticated shell only. The public start page retains its original controls. */
.shell[data-app] > .main > .inapp-workspace-tools {
  position:relative;
  display:flex;
  align-items:center;
  min-width:0;
  padding:4px 12px;
}
.shell[data-app] .inapp-system-menu,
.shell[data-app] .pld-system-tools,
.shell[data-app] .inapp-applex-header {
  display:none;
}
/* The chat composer keeps its own remaining space when contextual help opens. */
html body #app > .shell[data-app="teamo"] > .main > .content {
  overflow:hidden!important;
  display:flex!important;
  flex-direction:column!important;
}
html body #app > .shell[data-app="teamo"] .content > [data-applex-panel-host] {
  flex:0 0 auto;
  min-height:0;
  max-height:45%;
  overflow-y:auto;
  overscroll-behavior:contain;
}
html body #app > .shell[data-app="teamo"] .content > .tm-app {
  flex:1 1 auto;
  height:auto!important;
  min-height:0!important;
}

@media (min-width:901px) {
  /* A reserved desktop row keeps the help icon reachable without covering data. */
  html body #app > .shell[data-app] > .main {
    display:grid!important;
    grid-template-columns:minmax(0,1fr)!important;
    grid-template-rows:auto minmax(0,1fr) auto!important;
    height:100dvh!important;
    min-height:0!important;
    max-height:100dvh!important;
    overflow:hidden!important;
  }
  html body #app > .shell[data-app] > .main > .topbar {
    grid-row:1!important;
    position:relative!important;
    top:auto!important;
  }
  html body #app > .shell[data-app] > .main > .content {
    grid-row:2!important;
    min-height:0!important;
    height:auto!important;
    max-height:100%!important;
    overflow-y:auto!important;
  }
  html body #app > .shell[data-app] > .main > .inapp-workspace-tools {
    grid-row:3!important;
  }
}

@media (max-width:900px) {
  html body:has(#app > .shell[data-app]) > .global-info-cluster {
    display:none!important;
  }
  /* The existing assistant gets its own header slot, as in native Appstead. */
  html body #app > .shell[data-app] > .main {
    display:grid!important;
    grid-template-columns:minmax(0,1fr)!important;
    grid-template-rows:auto minmax(0,1fr)!important;
    min-height:0!important;
    max-height:100%!important;
    overflow:hidden!important;
  }
  html body #app > .shell[data-app] > .main > .topbar {
    grid-row:1!important;
    position:relative!important;
    top:auto!important;
  }
  html body #app > .shell[data-app] > .main > .content {
    grid-row:2!important;
    min-height:0!important;
    height:auto!important;
    max-height:100%!important;
    overflow-y:auto!important;
    scroll-padding-bottom:16px!important;
  }
  html body #app > .shell[data-app] > .main > .inapp-workspace-tools {
    display:none!important;
  }
  html body #app > .shell[data-app] .inapp-applex-header {
    display:flex!important;
    flex:0 0 44px;
    align-items:center;
    justify-content:center;
    min-width:44px;
    min-height:44px;
    position:relative;
    z-index:1;
  }
  html body #app > .shell[data-app].pld-navigation-open .inapp-applex-header {
    visibility:hidden;
    pointer-events:none;
  }

  /* MAX-Cloud's Info controls are inside its existing Mehr menu, not below it. */
  html body #app > .shell[data-app="max-cloud"] > .sidebar {
    height:calc(62px + env(safe-area-inset-bottom))!important;
    min-height:calc(62px + env(safe-area-inset-bottom))!important;
    max-height:calc(62px + env(safe-area-inset-bottom))!important;
    grid-template-rows:62px!important;
    padding-bottom:env(safe-area-inset-bottom)!important;
  }
  html body #app > .shell[data-app="max-cloud"] .mobile-more-sheet {
    bottom:calc(66px + env(safe-area-inset-bottom))!important;
  }
  html body #app > .shell[data-app] .mobile-more-sheet > .inapp-system-bar {
    grid-column:1/-1;
  }
  html body #app > .shell[data-app] :is(.mobile-more-sheet,.inapp-system-menu-panel,.pld-system-tools) > .inapp-system-bar {
    position:relative!important;
    display:grid!important;
    grid-template-columns:repeat(5,minmax(0,1fr))!important;
    align-items:start!important;
    gap:4px!important;
    width:100%!important;
    min-height:0!important;
    padding:8px 0!important;
    border-top:1px solid color-mix(in srgb,currentColor 18%,transparent)!important;
    background:transparent!important;
    color:inherit!important;
  }
  html body #app > .shell[data-app] .inapp-system-action {
    position:relative!important;
    display:flex!important;
    flex-direction:column!important;
    align-items:center!important;
    justify-content:center!important;
    gap:4px!important;
    min-width:0!important;
    min-height:44px!important;
    width:100%!important;
    margin:0!important;
    padding:4px 2px!important;
    border:0!important;
    border-radius:8px!important;
    background:transparent!important;
    color:inherit!important;
    font:inherit;
    font-size:.65rem!important;
    text-decoration:none;
    white-space:normal!important;
    text-align:center;
  }
  html body #app > .shell[data-app] .inapp-system-action > img {
    width:24px!important;
    height:24px!important;
    object-fit:contain;
  }
  html body #app > .shell[data-app] .inapp-system-action > span:first-child {
    font-size:22px!important;
    line-height:24px!important;
  }
  html body #app > .shell[data-app] .inapp-info-menu {
    min-width:0;
  }
  html body #app > .shell[data-app] .inapp-info-menu > nav {
    position:static!important;
    inset:auto!important;
    width:auto!important;
    min-width:0!important;
    max-width:none!important;
    padding:4px!important;
    background:transparent!important;
    color:inherit!important;
    box-shadow:none!important;
  }
  html body #app > .shell[data-app] .inapp-info-menu[open] {
    grid-column:1/-1;
  }
  html body #app > .shell[data-app] .inapp-info-menu > nav > a {
    display:block;
    min-height:44px;
    padding:8px;
    color:inherit;
    overflow-wrap:anywhere;
  }
  html body #app > .shell[data-app] .inapp-language-select {
    cursor:pointer;
  }
  html body #app > .shell[data-app] .inapp-language > select {
    position:absolute!important;
    inset:0!important;
    width:100%!important;
    height:100%!important;
    opacity:0!important;
    cursor:pointer!important;
  }

  /* Other suite apps expose system controls via a compact menu in navigation. */
  html body #app > .shell[data-app] .inapp-system-menu {
    display:block!important;
    flex:0 0 auto!important;
    min-width:64px;
  }
  html body #app > .shell[data-app] .inapp-system-menu > summary {
    display:flex;
    align-items:center;
    justify-content:center;
    min-height:44px;
    padding:8px;
    cursor:pointer;
    list-style:none;
  }
  html body #app > .shell[data-app] .inapp-system-menu > summary::-webkit-details-marker {
    display:none;
  }
  html body #app > .shell[data-app] .inapp-system-menu-panel {
    position:fixed;
    inset-inline:8px;
    bottom:calc(76px + env(safe-area-inset-bottom));
    max-height:min(70dvh,520px);
    overflow-y:auto;
    padding:12px;
    border:1px solid color-mix(in srgb,currentColor 20%,transparent);
    border-radius:14px;
    background:var(--deep,#102842);
    color:white;
    z-index:80;
    overscroll-behavior:contain;
  }
  /* Only an open menu releases its navigation clipping; normal navigation scrolls. */
  html body #app > .shell[data-app] > .sidebar > .nav:has(> .inapp-system-menu[open]) {
    overflow:visible!important;
  }

  /* Plandero's existing drawer scrolls as one surface down to Konto/Abmelden. */
  html body #app > .shell[data-app="plandero"].pld-shell > .sidebar.pld-sidebar {
    display:block!important;
    overflow-y:auto!important;
    overflow-x:hidden!important;
    padding-bottom:max(12px,env(safe-area-inset-bottom))!important;
    overscroll-behavior:contain;
    -webkit-overflow-scrolling:touch;
    touch-action:pan-y;
  }
  html body #app > .shell[data-app="plandero"].pld-shell .nav.pld-sidebar-nav {
    overflow:visible!important;
    height:auto!important;
    max-height:none!important;
  }
  html body #app > .shell[data-app="plandero"] .pld-system-tools {
    grid-column:1/-1;
    display:block!important;
    min-width:0;
  }
  html body #app > .shell[data-app="plandero"] .pld-system-tools > .inapp-system-bar {
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
  }
  html body #app > .shell[data-app="plandero"] .sidebar-foot {
    padding-bottom:max(12px,env(safe-area-inset-bottom))!important;
  }
}
/* These app-owned chat scrollers stay separate from the generic content scroller. */
html body #app > .shell[data-app="teamo"] > .main > .content {
  overflow:hidden!important;
}
