.navbar {
  background-color: var(--addgene-dark-blue);
  height: 4.7rem;

  .nav-link.active,
  .nav-link.show {
    color: var(--addgene-link-hover-on-dark-blue);
  }
}

#navbar-main-menu {
  .list-group-flush {
    margin-top: 1rem;
    padding-left: 0;

    > .list-group-item {
      border-bottom: 1px solid var(--addgene-dark-blue-subtle-border);
      padding: 0.8rem 0;

      &:first-child {
        border-bottom: 1px solid var(--addgene-dark-blue-subtle-border);
      }
    }

    a,
    a:visited {
      color: var(--addgene-gray-7);
      text-decoration: none;
    }

    a:hover {
      text-decoration: underline;
    }
  }

  [data-bs-theme="dark"] & {
    .list-group-flush a,
    .list-group-flush a:visited {
      color: #fff;
    }
  }
}

.navbar-brand {
  .logo {
    width: auto;
    height: 24px;
    margin-right: 1rem;
  }
}

@media (min-width: 576px) {
  .navbar {
    height: 6.375rem;
  }

  .navbar-brand {
    .logo {
      height: 38px;
    }
  }
}

.navbar-toggler-icon {
  background-image: url('data:image/svg+xml,<svg width="30" height="25" fill="none" xmlns="http://www.w3.org/2000/svg"><g clip-path="url(%23a)" stroke="%23fff" stroke-width="3" stroke-linecap="round"><path d="M1.5 1.5h27M1.5 12.5h27M1.5 23.5h27"/></g><defs><clipPath id="a"><path fill="%23fff" d="M0 0h30v25H0z"/></clipPath></defs></svg>');
}

.navbar-toggler {
  padding: 0.25rem;
  border: none;
  font-size: var(--bs-body-font-size);

  &.btn.btn-link:hover,
  &.btn.btn-link:active {
    box-shadow: none;
  }

  &:focus {
    color: var(--bs-primary);
    box-shadow: 0 0 0 0.1rem var(--bs-primary);
    border-radius: 2px;
  }
}

.btn-close:focus {
  color: var(--bs-primary);
  box-shadow: 0 0 0 0.1rem var(--bs-primary);
  border-radius: 2px;
}