:root {
  --cyto-ink: #17342d;
  --cyto-green: #087f73;
  --cyto-green-dark: #123c35;
  --cyto-heading: #123c35;
  --cyto-nav-bg: #123c35;
  --cyto-amber: #e6a04b;
  --cyto-mist: #eef7f3;
}

body {
  letter-spacing: -0.008em;
}

.navbar {
  background-color: var(--cyto-nav-bg) !important;
  border-bottom: 3px solid var(--cyto-green);
  box-shadow: 0 4px 16px rgba(18, 60, 53, 0.22);
}

.navbar .navbar-brand,
.navbar .nav-link,
.navbar .nav-text {
  color: #ffffff !important;
  font-weight: 600;
}

.navbar .nav-link:hover,
.navbar .nav-link:focus,
.navbar .navbar-brand:hover,
.navbar .navbar-brand:focus {
  color: #bff4e8 !important;
}

.navbar .form-control {
  background-color: #ffffff;
  border: 2px solid #b7d8d0;
  color: #17342d;
}

.navbar .form-control:focus {
  border-color: #6ed7c5;
  box-shadow: 0 0 0 0.2rem rgba(110, 215, 197, 0.3);
}

.navbar .navbar-toggler {
  border-color: rgba(255, 255, 255, 0.7);
}

.navbar .navbar-toggler-icon {
  filter: brightness(0) invert(1);
}

.navbar .dropdown-menu {
  border-color: #c9ded8;
  box-shadow: 0 10px 28px rgba(18, 60, 53, 0.18);
}

.navbar-brand img {
  max-height: 48px;
}

.template-home .page-header {
  border: 0;
  padding-top: 3rem;
}

/* The README heading includes a right-aligned logo for GitHub. pkgdown already
   supplies its own correctly sized homepage logo, so hide only the duplicate
   README image on the generated website. */
.template-home .page-header h1 img[alt="cytoGateR hex sticker"] {
  display: none !important;
}

.template-home .page-header h1 {
  color: var(--cyto-heading);
  font-weight: 750;
  letter-spacing: -0.035em;
}

.template-home main > .section.level2 {
  border-top: 1px solid #dce8e3;
  margin-top: 2.5rem;
  padding-top: 2rem;
}

.contents a,
.page-header a {
  text-underline-offset: 0.16em;
}

pre {
  border: 1px solid #d9e7e1;
  box-shadow: 0 12px 30px rgba(18, 60, 53, 0.07);
}

.ref-index th {
  color: var(--cyto-heading);
}

.pkgdown-footer-left,
.pkgdown-footer-right {
  color: #557069;
}

[data-bs-theme="dark"] .template-home main > .section.level2 {
  border-top-color: var(--bs-border-color);
}

[data-bs-theme="dark"] pre {
  border-color: var(--bs-border-color);
  box-shadow: var(--bs-box-shadow);
}

[data-bs-theme="dark"] .template-home .page-header h1,
[data-bs-theme="dark"] .ref-index th {
  color: var(--bs-heading-color);
}

[data-bs-theme="dark"] .pkgdown-footer-left,
[data-bs-theme="dark"] .pkgdown-footer-right {
  color: var(--bs-secondary-color);
}

@media (max-width: 767px) {
  .template-home .page-header {
    padding-top: 1.5rem;
  }
}
