/* Palette: #001021 (navy), #034748 (teal), #FFFFFF (white) */
:root {
  --llm-navy: #001021;
  --llm-teal: #034748;
}

body {
  background-color: var(--llm-navy);
  color: #ffffff;
}

a {
  color: #ffffff;
}

/* Navbar (relies on Bootstrap's built-in navbar-dark text/icon styling) */
.site-navbar {
  background-color: var(--llm-teal);
  border-bottom: 1px solid #ffffff;
}

.navbar-nav {
  gap: 0.25rem;
}

.navbar-dark .nav-link.active,
.navbar-dark .nav-link:hover {
  background-color: #ffffff;
  color: var(--llm-teal);
  border-radius: 0.25rem;
}

/* Hero */
.hero-section {
  background-color: var(--llm-teal);
  border-bottom: 1px solid #ffffff;
}

/* Cards */
.card {
  background-color: var(--llm-navy);
  color: #ffffff;
  border: 1px solid var(--llm-teal);
}

.card-title {
  border-bottom: 1px solid var(--llm-teal);
  padding-bottom: 0.5rem;
}

.list-group-item {
  background-color: var(--llm-navy);
  color: #ffffff;
  border-color: var(--llm-teal);
}

/* Footer */
.site-footer {
  background-color: var(--llm-navy);
  border-top: 1px solid #ffffff;
}

.btn-teal {
  background-color: var(--llm-teal);
  color: #ffffff;
  border: 1px solid #ffffff;
}

.btn-teal:hover {
  background-color: #045f61;
  color: #ffffff;
}

/* Feed pagination */
.pagination .page-item.active .page-link {
  background-color: var(--llm-teal);
  border-color: var(--llm-teal);
}

/* Charts: fixed height so a chart never exceeds a normal browser window */
.chart-container {
  position: relative;
  height: 320px;
}