/* nav.css — one slice of the site stylesheet, split by concern.
   Load order is fixed in base.html and mirrors the old single-file
   source order; do not reorder the <link> tags. tokens.css holds
   every colour and must load first. */
/*********************************************************************


                            Navigation in header


**********************************************************************/
.navbar {
  border-width: 1px 0;
  -webkit-border-radius: 0;
  -webkit-background-clip: padding-box;
  -moz-border-radius: 0;
  -moz-background-clip: padding;
  border-radius: 0;
  background-clip: padding-box;
  width: 100%;
}
.navbar.stick {
  position: fixed;
  top: 0;
  left: 0;
  z-index: 1030;
  background-color: var(--bg-translucent);
  -webkit-backdrop-filter: blur(8px);
  backdrop-filter: blur(8px);
}
.navbar-collapse {
  -webkit-border-radius: 0;
  -webkit-background-clip: padding-box;
  -moz-border-radius: 0;
  -moz-background-clip: padding;
  border-radius: 0;
  background-clip: padding-box;
  font-family: "Open sans", Helvetica, Arial, sans-serif;
  font-weight: 300;
  text-transform: uppercase;
}
.navbar-collapse .navbar-nav {
  float: none;
  margin: 0 auto;
  text-align: center;
}
.navbar-collapse .navbar-nav > li {
  float: none;
  display: inline-block;
}
.navbar-collapse .navbar-nav > li > a {
  padding: 20px 30px;
}
.navbar-collapse .navbar-nav > li > a > i {
  margin-right: 6px;
}
.dropdown ul.dropdown-menu {
  top: 85%;
  text-align: left;
}
.dropdown ul.dropdown-menu > li > a {
  padding: 5px 30px;
}
.navbar-default {
  background-color: var(--bg-translucent);
  border-color: var(--border);
  -webkit-backdrop-filter: blur(8px);
  backdrop-filter: blur(8px);
}
.navbar-default .navbar-nav > li > a {
  color: var(--text);
}
.navbar-default .navbar-nav > li > a:hover,
.navbar-default .navbar-nav > li > a:focus {
  color: var(--accent-hover);
  background-color: transparent;
  box-shadow: inset 0 -3px 0 var(--accent-line);
}
.navbar-default .navbar-nav > .active > a,
.navbar-default .navbar-nav > .active > a:hover,
.navbar-default .navbar-nav > .active > a:focus {
  color: var(--accent);
  font-weight: 600;
  background-color: transparent;
  box-shadow: inset 0 -3px 0 var(--accent);
}
.navbar-default .dropdown ul.dropdown-menu > li > a {
  color: var(--text);
}
.navbar-default .dropdown ul.dropdown-menu > li > a:hover {
  background-color: var(--bg-elev-2);
  color: var(--text-strong);
}
.navbar-default .navbar-toggle {
  border-color: var(--border);
}
.navbar-default .navbar-toggle:hover,
.navbar-default .navbar-toggle:focus {
  background-color: var(--bg-elev-2);
}
.navbar-default .navbar-toggle .icon-bar {
  background-color: var(--text);
}
.navbar-default .navbar-collapse,
.navbar-default .navbar-form {
  border-color: var(--border);
}
.navbar-default .navbar-nav > .open > a,
.navbar-default .navbar-nav > .open > a:hover,
.navbar-default .navbar-nav > .open > a:focus {
  background-color: var(--bg-elev);
  color: var(--text-strong);
}
