:root {
  --color_lteal: rgb(24, 190, 212);
  --color_dteal: rgb(19, 152, 170);
  --color_whitesmoke: rgb(245, 245, 245);
  --color_nero: rgb(31, 31, 31);
  --color_grey: rgb(237, 236, 236);
}

body.portal-body,
body.portal-login-page {
  background-color: var(--color_whitesmoke);
  color: var(--color_nero);
}

.portal-navbar {
  background-color: #fff;
}

.portal-navbar .navbar-brand,
.portal-navbar .nav-link {
  color: var(--color_nero);
}

.portal-navbar .nav-link.active,
.portal-navbar .nav-link:hover {
  color: var(--color_dteal);
}

.portal-contextual-nav .nav-link {
  color: var(--color_nero);
  border-radius: 999px;
  white-space: nowrap;
}

.portal-contextual-nav .nav-link.active {
  background-color: var(--color_dteal);
  color: #fff;
}

.portal-contextual-nav .dropdown-menu {
  z-index: 1030;
}

.btn-primary {
  background-color: var(--color_dteal);
  border-color: var(--color_dteal);
}

.btn-primary:hover,
.btn-primary:focus {
  background-color: var(--color_lteal);
  border-color: var(--color_lteal);
}

.card {
  border-radius: 1rem;
}

.home-section-icon {
  line-height: 1;
  display: inline-block;
}

.placeholder-shell code {
  word-break: break-word;
}

/* Form validation errors rendered inline by Django */
.errorlist {
  color: #b00020;
  list-style: none;
  padding-left: 0;
  margin: 0.25rem 0 0.5rem 0;
  font-size: 0.875rem;
}

/* QMS-501 inline Markdown rendering */
.markdown-content {
  line-height: 1.6;
}
.markdown-content h1 {
  font-size: 1.5rem;
  margin-top: 1.5rem;
  margin-bottom: 0.75rem;
}
.markdown-content h2 {
  font-size: 1.25rem;
  margin-top: 1.25rem;
  margin-bottom: 0.5rem;
}
.markdown-content h3 {
  font-size: 1.1rem;
  margin-top: 1rem;
  margin-bottom: 0.5rem;
}
.markdown-content h1:first-child,
.markdown-content h2:first-child {
  margin-top: 0;
}
.markdown-content p {
  margin-bottom: 0.75rem;
}
.markdown-content ul,
.markdown-content ol {
  margin-bottom: 0.75rem;
  padding-left: 1.5rem;
}
.markdown-content code {
  background-color: var(--color_grey);
  padding: 0.1rem 0.3rem;
  border-radius: 0.25rem;
  font-size: 0.9em;
}
.markdown-content pre {
  background-color: var(--color_whitesmoke);
  padding: 0.75rem;
  border-radius: 0.5rem;
  overflow-x: auto;
}
.markdown-content blockquote {
  border-left: 3px solid var(--color_dteal);
  padding-left: 1rem;
  color: var(--color_nero);
  margin-bottom: 0.75rem;
}
.markdown-content hr {
  margin: 1.5rem 0;
}