/* Retter-Portal v1.3.80
   Tablet + eingeklappte Sidebar: letzte Header-Korrektur.
   Kontobereich als echte Flexzeile (keine impliziten Grid-Spalten mehr) und
   Feuerwehr-Auswahl exakt auf derselben vertikalen Mittelachse wie die Aktionen. */

@media (min-width:1101px) and (max-width:1400px){
  html body.sidebar-collapsed .app-shell .main > .topbar .topbar-desktop-shell{
    align-items:center!important;
  }

  html body.sidebar-collapsed .app-shell .main > .topbar .topbar-context{
    display:flex!important;
    align-items:center!important;
    align-self:center!important;
    height:38px!important;
    min-height:38px!important;
    max-height:38px!important;
    margin:0!important;
    transform:none!important;
  }

  html body.sidebar-collapsed .app-shell .main > .topbar .department-context-switch,
  html body.sidebar-collapsed .app-shell .main > .topbar .department-context-static,
  html body.sidebar-collapsed .app-shell .main > .topbar.has-department-switch .department-context-switch{
    align-self:center!important;
    height:38px!important;
    min-height:38px!important;
    max-height:38px!important;
    margin:0!important;
    padding:3px 5px 3px 10px!important;
  }

  html body.sidebar-collapsed .app-shell .main > .topbar .department-context-switch select,
  html body.sidebar-collapsed .app-shell .main > .topbar .department-context-static strong{
    height:30px!important;
    min-height:30px!important;
    max-height:30px!important;
    line-height:30px!important;
  }

  html body.sidebar-collapsed .app-shell .main > .topbar .topbar-actions,
  html body.sidebar-collapsed .app-shell .main > .topbar .topbar-user-cluster{
    align-self:center!important;
  }

  html body.sidebar-collapsed .app-shell .main > .topbar .topbar-user-cluster{
    display:flex!important;
    align-items:center!important;
    justify-content:flex-end!important;
    gap:8px!important;
    width:auto!important;
    min-width:0!important;
    max-width:none!important;
    overflow:visible!important;
  }

  /* Alte Regeln platzierten Rolle und Name in Grid-Spalte 3/4 und erzeugten
     dadurch den sichtbaren leeren Block links. Flex beseitigt diese impliziten Spalten. */
  html body.sidebar-collapsed .app-shell .main > .topbar .topbar-account-info,
  html body.sidebar-collapsed .app-shell .main > .topbar .topbar-account-info.has-role{
    display:flex!important;
    align-items:center!important;
    justify-content:flex-start!important;
    gap:7px!important;
    width:auto!important;
    min-width:0!important;
    max-width:280px!important;
    height:38px!important;
    min-height:38px!important;
    max-height:38px!important;
    margin:0!important;
    padding:4px 7px!important;
    overflow:hidden!important;
  }

  html body.sidebar-collapsed .app-shell .main > .topbar .topbar-account-info.name-only{
    max-width:190px!important;
  }

  html body.sidebar-collapsed .app-shell .main > .topbar .topbar-role-badge{
    grid-column:auto!important;
    grid-row:auto!important;
    flex:0 0 auto!important;
    align-self:center!important;
    margin:0!important;
  }

  html body.sidebar-collapsed .app-shell .main > .topbar .user-chip,
  html body.sidebar-collapsed .app-shell .main > .topbar .user-chip.has-role-badge{
    grid-column:auto!important;
    grid-row:auto!important;
    display:block!important;
    flex:0 1 auto!important;
    width:auto!important;
    min-width:0!important;
    max-width:152px!important;
    margin:0!important;
    padding:0 2px!important;
    overflow:hidden!important;
    text-overflow:ellipsis!important;
    white-space:nowrap!important;
  }

  html body.sidebar-collapsed .app-shell .main > .topbar .topbar-account-info.name-only .user-chip{
    max-width:178px!important;
  }
}

@media (min-width:1101px) and (max-width:1229px){
  html body.sidebar-collapsed .app-shell .main > .topbar .topbar-account-info,
  html body.sidebar-collapsed .app-shell .main > .topbar .topbar-account-info.has-role{
    max-width:246px!important;
  }

  html body.sidebar-collapsed .app-shell .main > .topbar .user-chip,
  html body.sidebar-collapsed .app-shell .main > .topbar .user-chip.has-role-badge{
    max-width:126px!important;
  }
}