.nav-wrapper {
  box-shadow: 0px 0px 15px 0px rgba(0,0,0,0.7);
}

.navbar-toggler {
  padding: var(--bs-navbar-toggler-padding-y) var(--bs-navbar-toggler-padding-x);
  font-size: 24px;
  box-shadow: 0px 0px 10px 5px rgba(0,0,0,0.3);
}

.bg-toggler {
  background-color: #c3c3c3;
}

.navbar {
  --bs-navbar-padding-x: 0;
  --bs-navbar-padding-y: 0.5rem;
  --bs-navbar-color: rgba(var(--bs-emphasis-color-rgb), 0.65);
  --bs-navbar-hover-color: rgba(var(--bs-emphasis-color-rgb), 0.8);
  --bs-navbar-disabled-color: rgba(var(--bs-emphasis-color-rgb), 0.3);
  --bs-navbar-active-color: rgba(var(--bs-emphasis-color-rgb), 1);
  --bs-navbar-brand-padding-y: 0.3125rem;
  --bs-navbar-brand-margin-end: 1rem;
  --bs-navbar-brand-font-size: 1.25rem;
  --bs-navbar-brand-color: rgba(var(--bs-emphasis-color-rgb), 1);
  --bs-navbar-brand-hover-color: rgba(var(--bs-emphasis-color-rgb), 1);
  padding: var(--bs-navbar-padding-y) var(--bs-navbar-padding-x);
  --bs-navbar-color: #fff;
  --bs-navbar-hover-color: #ffbf00;
  --bs-navbar-active-color: #ffbf00;
  --bs-navbar-toggler-padding-x: 6px;
  text-align: center;
  font-size: 18px;
  margin-bottom: 0;
  font-family: 'Roboto Condensed';
  font-weight: 700;
  text-shadow: 1px 1px 2px #000;
  transition: all .3s;
  background: #000a64;
  border-bottom: solid 1px #000a64;
}

.navbar-nav-scroll {
  max-height: 65vh;
  overflow-y: auto;
}

.navbar-toggler:focus {
  text-decoration: none;
  outline: 0;
  box-shadow: 0px 0px 10px 5px rgba(0,0,0,0.5);
}

@media (min-width:768px) {
  .navbar-expand-md .navbar-nav .nav-link {
    padding-right: 14px;
    padding-left: 14px;
    font-size: 18px;
  }
}

@media (min-width:992px) {
  .navbar-expand-md .navbar-nav .nav-link {
    padding-right: 24px;
    padding-left: 24px;
    font-size: 18px;
  }
}

@media (min-width:1400px) {
  .navbar-expand-md .navbar-nav .nav-link {
    padding-right: 10px;
    padding-left: 10px;
  }
}

.dropdown-menu {
  text-align: center;
  --bs-dropdown-padding-x: 0;
  --bs-dropdown-padding-y: 0.5rem;
  --bs-dropdown-font-size: 17px;
  --bs-dropdown-color: #fff;
  --bs-dropdown-bg: #000a64;
  --bs-dropdown-box-shadow: none;
  --bs-dropdown-link-color: #fff;
  --bs-dropdown-link-hover-color: #ffbf00;
  --bs-dropdown-link-hover-bg: #0019a0;
  --bs-dropdown-link-active-color: #ffbf00;
  --bs-dropdown-link-active-bg: #0019a0;
  --bs-dropdown-item-padding-x: 1rem;
  --bs-dropdown-item-padding-y: 0.5rem;
  border: none;
}

@media (min-width: 768px) {
  .dropdown-menu {
    box-shadow: 6px 6px 10px rgba(10,20,60,0.8);
  }
}

.dropdown-item {
  font-weight: 700;
}

@media (max-width: 576px) {
  .dropdown-item {
    white-space: normal;
    overflow-wrap: break-word;
  }
}

.dropdown-menu .dropdown-item.active {
  color: #ffbf00;
  background-color: #0019a0;
}

.nav-link.dropdown-toggle.active {
  color: #ffbf00;
}

/* CSS to apply to links via JS script to remove lingering hover state color */

.no-hover .navbar a:hover, .no-hover .dropdown-item:hover, .no-hover .nav-link:hover {
  color: inherit !important;
  background-color: transparent !important;
  text-decoration: none !important;
}

/* Dropdown animation */

@keyframes slideIn {
  0% {
    transform: translateY(40px);
    opacity: 0;
  }
  100% {
    transform: translateY(0px);
    opacity: 1;
  }
}

@media (min-width: 768px) {
  .slideIn {
    animation-name: slideIn;
    animation-duration: 0.5s;
    animation-fill-mode: both;
  }
}

[data-bs-theme=dark] .navbar-toggler-icon {
  --bs-navbar-toggler-icon-bg: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 30 30'%3e%3cpath stroke='rgba%280, 0, 0, 0.55%29' stroke-linecap='round' stroke-miterlimit='10' stroke-width='2' d='M4 7h22M4 15h22M4 23h22'/%3e%3c/svg%3e");
}

/* To style the nav links going to external sites to avoid the hover linger on mobile */

@media (hover: none) and (pointer: coarse) {
  a.external-link {
    color: var(--bs-navbar-color) !important;
    background-color: transparent !important;
  }
}

@media (hover: none) and (pointer: coarse) {
  a.external-link, a.external-link:hover, a.external-link:focus, a.external-link:active, a.external-link:focus-visible {
    --bs-nav-link-hover-color: var(--bs-navbar-color) !important;
    color: var(--bs-navbar-color) !important;
    background-color: transparent !important;
  }
}