/* Retter-Portal v1.3.75
   Tablet-Header sauber konsolidiert: nur noch eine Header-Struktur, keine Duplikate. */

/* Die experimentelle zweite Tablet-Kopfzeile darf grundsätzlich nie erscheinen. */
html body .rp-expanded-tablet-shell{
  display:none!important;
}

/* Ausgeklappte Sidebar auf Tablets: kompakte, echte Ein-Zeilen-Anordnung. */
@media (min-width:900px) and (max-width:1400px){
  html body:not(.sidebar-collapsed) .app-shell .main > .topbar.topbar--expanded-tablet{
    display:block!important;
    width:100%!important;
    height:72px!important;
    min-height:72px!important;
    max-height:72px!important;
    padding:0!important;
    overflow:hidden!important;
  }

  html body:not(.sidebar-collapsed) .app-shell .main > .topbar.topbar--expanded-tablet .topbar-desktop-shell{
    display:grid!important;
    grid-template-columns:minmax(190px,max-content) minmax(220px,1fr) max-content!important;
    grid-template-areas:"brand context actions"!important;
    align-items:center!important;
    column-gap:8px!important;
    row-gap:0!important;
    width:100%!important;
    height:72px!important;
    min-height:72px!important;
    max-height:72px!important;
    margin:0!important;
    padding:10px 14px!important;
    overflow:hidden!important;
  }

  html body:not(.sidebar-collapsed) .app-shell .main > .topbar.topbar--expanded-tablet.is-developer-organization .topbar-desktop-shell{
    grid-template-columns:minmax(258px,max-content) minmax(220px,1fr) max-content!important;
  }

  html body:not(.sidebar-collapsed) .app-shell .main > .topbar.topbar--expanded-tablet .topbar-tablet-menu{
    display:none!important;
  }

  html body:not(.sidebar-collapsed) .app-shell .main > .topbar.topbar--expanded-tablet .topbar-title{
    grid-area:brand!important;
    display:flex!important;
    align-items:center!important;
    gap:8px!important;
    width:max-content!important;
    min-width:0!important;
    max-width:none!important;
    height:42px!important;
    margin:0!important;
    padding:0!important;
    overflow:visible!important;
    white-space:nowrap!important;
  }

  html body:not(.sidebar-collapsed) .app-shell .main > .topbar.topbar--expanded-tablet .topbar-product,
  html body:not(.sidebar-collapsed) .app-shell .main > .topbar.topbar--expanded-tablet .topbar-eyebrow{
    display:flex!important;
    align-items:center!important;
    gap:7px!important;
    width:max-content!important;
    min-width:max-content!important;
    max-width:none!important;
    margin:0!important;
    padding:0!important;
    overflow:visible!important;
    white-space:nowrap!important;
  }

  html body:not(.sidebar-collapsed) .app-shell .main > .topbar.topbar--expanded-tablet .topbar-eyebrow{
    color:var(--muted-2)!important;
    font-size:.60rem!important;
    line-height:1!important;
    font-weight:950!important;
    letter-spacing:.12em!important;
    text-transform:uppercase!important;
  }

  html body:not(.sidebar-collapsed) .app-shell .main > .topbar.topbar--expanded-tablet .topbar-eyebrow > span:first-child{
    display:inline!important;
    width:auto!important;
    min-width:max-content!important;
    max-width:none!important;
    overflow:visible!important;
    text-overflow:clip!important;
    white-space:nowrap!important;
  }

  html body:not(.sidebar-collapsed) .app-shell .main > .topbar.topbar--expanded-tablet .topbar-version{
    display:inline-grid!important;
    place-items:center!important;
    flex:0 0 auto!important;
    min-width:50px!important;
    height:28px!important;
    padding:0 8px!important;
    border:1px solid var(--line)!important;
    border-radius:999px!important;
    background:var(--surface)!important;
    color:var(--text)!important;
    box-shadow:var(--shadow-sm)!important;
    font-size:.58rem!important;
    line-height:1!important;
    font-weight:950!important;
    letter-spacing:.025em!important;
  }

  html body:not(.sidebar-collapsed) .app-shell .main > .topbar.topbar--expanded-tablet .dev-organization-chip{
    display:inline-grid!important;
    place-items:center!important;
    flex:0 0 auto!important;
    width:auto!important;
    min-width:max-content!important;
    max-width:none!important;
    height:28px!important;
    padding:0 9px!important;
    margin:0!important;
    overflow:visible!important;
    text-overflow:clip!important;
    white-space:nowrap!important;
    font-size:.49rem!important;
    line-height:1!important;
    letter-spacing:.05em!important;
  }

  html body:not(.sidebar-collapsed) .app-shell .main > .topbar.topbar--expanded-tablet .topbar-context{
    grid-area:context!important;
    display:flex!important;
    align-items:center!important;
    justify-content:flex-start!important;
    width:100%!important;
    min-width:0!important;
    max-width:none!important;
    height:42px!important;
    margin:0!important;
    padding:0!important;
    overflow:hidden!important;
  }

  html body:not(.sidebar-collapsed) .app-shell .main > .topbar.topbar--expanded-tablet .department-context-switch,
  html body:not(.sidebar-collapsed) .app-shell .main > .topbar.topbar--expanded-tablet .department-context-static,
  html body:not(.sidebar-collapsed) .app-shell .main > .topbar.topbar--expanded-tablet.has-department-switch .department-context-switch{
    display:grid!important;
    grid-template-columns:62px minmax(0,1fr)!important;
    align-items:center!important;
    gap:5px!important;
    width:100%!important;
    min-width:0!important;
    max-width:292px!important;
    height:42px!important;
    min-height:42px!important;
    max-height:42px!important;
    margin:0!important;
    padding:4px 5px 4px 9px!important;
    border:1px solid var(--line)!important;
    border-radius:14px!important;
    background:var(--surface)!important;
    box-shadow:var(--shadow-sm)!important;
    overflow:hidden!important;
  }

  html body:not(.sidebar-collapsed) .app-shell .main > .topbar.topbar--expanded-tablet .department-context-switch > span,
  html body:not(.sidebar-collapsed) .app-shell .main > .topbar.topbar--expanded-tablet .department-context-static > span{
    color:var(--muted-2)!important;
    font-size:.49rem!important;
    line-height:1!important;
    font-weight:950!important;
    letter-spacing:.10em!important;
    text-transform:uppercase!important;
    white-space:nowrap!important;
  }

  html body:not(.sidebar-collapsed) .app-shell .main > .topbar.topbar--expanded-tablet .department-context-switch select,
  html body:not(.sidebar-collapsed) .app-shell .main > .topbar.topbar--expanded-tablet .department-context-static strong{
    display:block!important;
    width:100%!important;
    min-width:0!important;
    max-width:100%!important;
    height:32px!important;
    min-height:32px!important;
    margin:0!important;
    padding:0 25px 0 9px!important;
    border:0!important;
    border-radius:10px!important;
    background:var(--surface-2)!important;
    color:var(--text)!important;
    box-shadow:none!important;
    font-size:.72rem!important;
    line-height:32px!important;
    font-weight:900!important;
    overflow:hidden!important;
    text-overflow:ellipsis!important;
    white-space:nowrap!important;
  }

  html body:not(.sidebar-collapsed) .app-shell .main > .topbar.topbar--expanded-tablet .department-context-static strong{
    padding-right:9px!important;
  }

  html body:not(.sidebar-collapsed) .app-shell .main > .topbar.topbar--expanded-tablet .topbar-actions{
    grid-area:actions!important;
    display:flex!important;
    align-items:center!important;
    justify-content:flex-end!important;
    gap:6px!important;
    width:max-content!important;
    min-width:0!important;
    max-width:none!important;
    height:42px!important;
    margin:0!important;
    padding:0!important;
    overflow:visible!important;
    white-space:nowrap!important;
  }

  html body:not(.sidebar-collapsed) .app-shell .main > .topbar.topbar--expanded-tablet .theme-switch{
    display:grid!important;
    grid-template-columns:23px 23px 38px!important;
    align-items:center!important;
    gap:1px!important;
    flex:0 0 91px!important;
    width:91px!important;
    min-width:91px!important;
    max-width:91px!important;
    height:36px!important;
    min-height:36px!important;
    margin:0!important;
    padding:3px!important;
    border:1px solid var(--line)!important;
    border-radius:999px!important;
    background:var(--surface)!important;
    box-shadow:var(--shadow-sm)!important;
  }

  html body:not(.sidebar-collapsed) .app-shell .main > .topbar.topbar--expanded-tablet .theme-switch .theme-dot{
    display:grid!important;
    place-items:center!important;
    width:100%!important;
    min-width:0!important;
    max-width:none!important;
    height:28px!important;
    min-height:28px!important;
    margin:0!important;
    padding:0!important;
    border:0!important;
    border-radius:999px!important;
    font-size:.58rem!important;
    line-height:1!important;
  }

  html body:not(.sidebar-collapsed) .app-shell .main > .topbar.topbar--expanded-tablet .topbar-user-cluster{
    display:flex!important;
    align-items:center!important;
    gap:6px!important;
    width:max-content!important;
    min-width:0!important;
    max-width:none!important;
    height:42px!important;
    margin:0!important;
    padding:0!important;
    overflow:visible!important;
  }

  html body:not(.sidebar-collapsed) .app-shell .main > .topbar.topbar--expanded-tablet .topbar-account-info,
  html body:not(.sidebar-collapsed) .app-shell .main > .topbar.topbar--expanded-tablet .topbar-account-info.has-role{
    display:grid!important;
    grid-template-columns:max-content minmax(92px,118px)!important;
    grid-template-areas:none!important;
    align-items:center!important;
    gap:6px!important;
    width:auto!important;
    min-width:0!important;
    max-width:225px!important;
    height:36px!important;
    min-height:36px!important;
    margin:0!important;
    padding:3px 7px!important;
    border:1px solid var(--line)!important;
    border-radius:14px!important;
    background:var(--surface)!important;
    box-shadow:var(--shadow-sm)!important;
    overflow:hidden!important;
  }

  html body:not(.sidebar-collapsed) .app-shell .main > .topbar.topbar--expanded-tablet .topbar-account-info.name-only{
    grid-template-columns:minmax(90px,130px)!important;
    min-width:105px!important;
  }

  html body:not(.sidebar-collapsed) .app-shell .main > .topbar.topbar--expanded-tablet .topbar-role-badge{
    display:inline-grid!important;
    grid-area:auto!important;
    grid-column:auto!important;
    grid-row:auto!important;
    justify-self:start!important;
    place-items:center!important;
    width:max-content!important;
    min-width:max-content!important;
    max-width:none!important;
    height:27px!important;
    min-height:27px!important;
    padding:0 8px!important;
    margin:0!important;
    overflow:visible!important;
    text-overflow:clip!important;
    white-space:nowrap!important;
    font-size:.48rem!important;
    line-height:1!important;
    letter-spacing:.05em!important;
  }

  html body:not(.sidebar-collapsed) .app-shell .main > .topbar.topbar--expanded-tablet .user-chip,
  html body:not(.sidebar-collapsed) .app-shell .main > .topbar.topbar--expanded-tablet .user-chip.has-role-badge{
    display:block!important;
    grid-area:auto!important;
    grid-column:auto!important;
    grid-row:auto!important;
    justify-self:stretch!important;
    width:100%!important;
    min-width:0!important;
    max-width:118px!important;
    height:28px!important;
    margin:0!important;
    padding:0!important;
    color:var(--text)!important;
    font-size:.67rem!important;
    line-height:28px!important;
    font-weight:900!important;
    overflow:hidden!important;
    text-overflow:ellipsis!important;
    white-space:nowrap!important;
  }

  html body:not(.sidebar-collapsed) .app-shell .main > .topbar.topbar--expanded-tablet .topbar-logout,
  html body:not(.sidebar-collapsed) .app-shell .main > .topbar.topbar--expanded-tablet .topbar-logout .btn{
    flex:0 0 auto!important;
    width:auto!important;
    min-width:66px!important;
    max-width:none!important;
    height:36px!important;
    min-height:36px!important;
    max-height:36px!important;
    margin:0!important;
  }

  html body:not(.sidebar-collapsed) .app-shell .main > .topbar.topbar--expanded-tablet .topbar-logout .btn{
    display:inline-grid!important;
    place-items:center!important;
    padding:0 10px!important;
    border-radius:13px!important;
    font-size:.66rem!important;
    line-height:1!important;
  }

  /* Wenn die echte Restbreite zu klein wird, kontrolliert auf zwei Zeilen wechseln. */
  html body:not(.sidebar-collapsed) .app-shell .main > .topbar.topbar--expanded-tablet.topbar--narrow-expanded{
    height:112px!important;
    min-height:112px!important;
    max-height:112px!important;
  }

  html body:not(.sidebar-collapsed) .app-shell .main > .topbar.topbar--expanded-tablet.topbar--narrow-expanded .topbar-desktop-shell,
  html body:not(.sidebar-collapsed) .app-shell .main > .topbar.topbar--expanded-tablet.topbar--narrow-expanded.is-developer-organization .topbar-desktop-shell{
    grid-template-columns:minmax(220px,max-content) minmax(230px,1fr)!important;
    grid-template-rows:44px 44px!important;
    grid-template-areas:"brand context" "actions actions"!important;
    height:112px!important;
    min-height:112px!important;
    max-height:112px!important;
    padding:8px 14px!important;
    row-gap:4px!important;
  }

  html body:not(.sidebar-collapsed) .app-shell .main > .topbar.topbar--expanded-tablet.topbar--narrow-expanded .topbar-actions{
    width:100%!important;
    justify-content:flex-end!important;
  }
}

/* Die funktionierende Variante mit eingeklappter Sidebar bleibt unangetastet. */