
/* Hotfixes after purge — mobile navbar + dropdown UX */
.navbar-clean{position:sticky;top:0;z-index:1050;}
.navbar-clean .navbar-toggler{border:1px solid rgba(255,255,255,.25);border-radius:999px;padding:.45rem .6rem;background:rgba(255,255,255,.08);}
.navbar-clean .navbar-toggler:focus{outline:none;box-shadow:0 0 0 .2rem rgba(0,171,204,.25);}

@media (max-width: 991.98px){
  .navbar-clean .navbar-collapse{
    background: rgba(20,40,80,.96);
    border: 1px solid rgba(255,255,255,.10);
    border-radius: 16px;
    padding: 12px 14px;
    margin-top: 10px;
  }
  .navbar-clean .navbar-nav{gap:6px;}
  .navbar-clean .nav-link{padding:.55rem .5rem;border-radius:12px;}
  .navbar-clean .nav-link:hover{background:rgba(255,255,255,.06);}
  /* Dropdown menu should look like part of the dark panel on mobile */
  .navbar-clean .dropdown-menu{
    background: transparent;
    border: 0;
    box-shadow: none;
    padding: 0 0 8px 0;
  }
  .navbar-clean .dropdown-item{
    color: rgba(255,255,255,.88);
    padding: .55rem .5rem;
    border-radius: 12px;
  }
  .navbar-clean .dropdown-item:hover{
    background: rgba(255,255,255,.06);
    color:#fff;
  }
}

/* Desktop dropdown look */
@media (min-width: 992px){
  .navbar-clean .dropdown-menu{
    background: #ffffff;
    border: 1px solid rgba(20,40,80,.10);
    border-radius: 14px;
    padding: 8px;
  }
  .navbar-clean .dropdown-item{border-radius:12px;}
  .navbar-clean .dropdown-item:hover{background: rgba(0,171,204,.10);}
}
