/* DokumentWerk 3.2.1 – finale mobile Navigation, bewusst nach app.css geladen */
@media (max-width: 900px) {
  .top .brand, .mobile-nav-toggle { z-index: 103; }
  .mobile-nav-backdrop { z-index: 110; }
  .top nav { z-index: 120; width: min(390px, 88vw); }
  .mobile-nav-open .brand { pointer-events: none; }
  .mobile-nav-open .mobile-nav-toggle { opacity: 0; visibility: hidden; pointer-events: none; }
  .mobile-nav-head { position: relative; z-index: 2; min-height: 70px; padding: 7px 2px 20px; }
  .mobile-nav-head > div { min-width: 0; padding-right: 8px; }
  .mobile-nav-head strong { overflow-wrap: anywhere; }
  .mobile-nav-head button { position: relative; z-index: 3; }
  .top nav > a, .admin-nav-menu > button, .public-nav-logout > button {
    display: flex !important; box-sizing: border-box; width: 100%; min-height: 68px; margin: 0;
    align-items: center; flex-direction: row; justify-content: flex-start;
  }
  .top nav > a > span:not(.nav-icon), .admin-nav-menu > button > span:not(.nav-icon), .public-nav-logout > button > span:not(.nav-icon) { flex: 1; align-self: center; }
  .public-nav-logout { display: block !important; width: 100%; margin-top: 7px; padding-top: 9px; }
  .nav-icon { align-self: center; }

  /* Großzügiges, optisch ruhiges Hamburger-Symbol statt engem Grid */
  .mobile-nav-toggle {
    position: relative;
    display: flex;
    width: auto;
    height: 52px;
    padding: 0 17px 0 54px;
    align-items: center;
    justify-content: center;
    gap: 0;
    border-radius: 16px;
  }
  .mobile-nav-toggle span {
    position: absolute;
    left: 17px;
    display: block;
    width: 27px;
    height: 3px;
    border-radius: 99px;
    background: #fff;
    transform: none;
  }
  .mobile-nav-toggle span:nth-child(1) { top: 15px; }
  .mobile-nav-toggle span:nth-child(2) { top: 24px; }
  .mobile-nav-toggle span:nth-child(3) { top: 33px; }
  .mobile-nav-toggle b {
    display: block;
    font-size: 13px;
    line-height: 1;
  }
}
@media (max-width: 620px) {
  .top nav { left: 0; right: 0; width: 100vw; max-width: none; padding: 18px 18px 32px; transform: translateX(100%); }
  .mobile-nav-open nav { transform: translateX(0); }
  .mobile-nav-backdrop { display: none; }
  .mobile-nav-head { margin-bottom: 15px; }
  .top nav > a, .admin-nav-menu > button, .public-nav-logout > button { min-height: 72px; }
  .admin-submenu { margin-left: 18px; margin-right: 0; }
}
@media (max-width: 420px) {
  .top nav { padding-left: 13px; padding-right: 13px; }
  .top .brand.has-uploaded-logo .brand-logo { max-width: 225px; }
  .mobile-nav-head strong { font-size: 16px; }
  .mobile-nav-toggle {
    width: 54px;
    min-width: 54px;
    height: 54px;
    padding: 0;
  }
  .mobile-nav-toggle b { display: none; }
  .mobile-nav-toggle span { left: 13px; width: 28px; }
  .mobile-nav-toggle span:nth-child(1) { top: 16px; }
  .mobile-nav-toggle span:nth-child(2) { top: 25px; }
  .mobile-nav-toggle span:nth-child(3) { top: 34px; }
}