/* ==================================================
   RC16.261 · Bottom Nav Accessibility Restyle
   Nur globale mobile Bottom-Navigation.
   Guided-/Notvorrat-Sektionsicons bleiben unveraendert.
   ================================================== */

@media (max-width:899px){
  /* Kompakt bleiben, aber allen Navigation-Icons deutlich mehr visuelle Flaeche geben. */
  :root{--nav-h:52px;}

  body.pandabu-authenticated .bottom-nav{
    height:calc(var(--nav-h) + env(safe-area-inset-bottom))!important;
    min-height:calc(var(--nav-h) + env(safe-area-inset-bottom))!important;
    padding:0 5px env(safe-area-inset-bottom)!important;
    align-items:stretch!important;
    overflow:visible!important;
  }

  body.pandabu-authenticated .bottom-nav .nav-item{
    justify-content:flex-end!important;
    align-items:center!important;
    padding:0 1px!important;
    gap:0!important;
    line-height:1!important;
    transform:translateY(2px)!important;
    overflow:visible!important;
  }

  /* Alle Icons gleich gross: ruhiger als ein stark skalierender Aktivzustand. */
  body.pandabu-authenticated .bottom-nav .nav-item .nicon{
    width:36px!important;
    height:36px!important;
    min-width:36px!important;
    flex:0 0 36px!important;
    display:grid!important;
    place-items:center!important;
    box-sizing:border-box!important;
    border:2px solid transparent!important;
    border-radius:50%!important;
    background:transparent!important;
    transform:none!important;
    transform-origin:center!important;
    transition:border-color .16s ease,background-color .16s ease,box-shadow .16s ease!important;
    overflow:visible!important;
  }

  body.pandabu-authenticated .bottom-nav .nav-item .nicon img{
    width:30px!important;
    height:30px!important;
    max-width:30px!important;
    max-height:30px!important;
    object-fit:contain!important;
    transform:none!important;
    filter:none!important;
  }

  /* Aktiver Bereich: keine Groessenspruenge, sondern klare Akzent-Umrandung. */
  body.pandabu-authenticated .bottom-nav .nav-item.active .nicon{
    transform:none!important;
    border-color:var(--accent,#19b8aa)!important;
    background:color-mix(in srgb,var(--accent,#19b8aa) 10%,transparent)!important;
    box-shadow:0 0 0 1px color-mix(in srgb,var(--accent,#19b8aa) 28%,transparent)!important;
    z-index:4;
  }

  /* Beschriftung bewusst etwas weiter nach unten; aktiver Text in Akzentfarbe. */
  body.pandabu-authenticated .bottom-nav .nav-item>span:last-child{
    margin-top:-1px!important;
    transform:translateY(2px)!important;
    font-size:8.8px!important;
    line-height:1!important;
    font-weight:650!important;
    color:inherit;
  }
  body.pandabu-authenticated .bottom-nav .nav-item.active>span:last-child{
    color:var(--accent,#19b8aa)!important;
    font-weight:850!important;
  }
}

/* Safari-Fallback fuer color-mix: Outline bleibt auch ohne color-mix klar sichtbar. */
@supports not (background:color-mix(in srgb,red 10%,transparent)){
  @media (max-width:899px){
    body.pandabu-authenticated .bottom-nav .nav-item.active .nicon{
      background:rgba(25,184,170,.10)!important;
      box-shadow:0 0 0 1px rgba(25,184,170,.24)!important;
    }
  }
}

@media (prefers-reduced-motion:reduce){
  body.pandabu-authenticated .bottom-nav .nav-item .nicon{
    transition:none!important;
  }
}