/* EZ Loyalty brand override for the docfx "modern" template. */
/* Palette sampled from https://www.ez-loyalty.com/ */

@import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700&display=swap');

:root {
  --ez-purple: #6239ea;      /* nav / header background */
  --ez-purple-dark: #4c2bc0;
  --ez-ink: #2c186d;         /* body text on light background */
  --ez-lilac: #efeefc;       /* light page background */
  --ez-accent: #88baf6;      /* button / link accent */
  --ez-accent-dark: #6aa3ea;
}

body {
  font-family: 'Inter', -apple-system, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;
}

/* Navbar */
.navbar {
  background-color: var(--ez-purple) !important;
  border-bottom: 1px solid var(--ez-purple-dark);
}

.navbar-brand {
  color: #ffffff !important;
}

.navbar-brand img#logo {
  height: 28px;
  width: auto;
  max-width: none;
}

.navbar .nav-link,
#navpanel .nav-link {
  color: rgba(255, 255, 255, 0.85) !important;
}

.navbar .nav-link:hover,
#navpanel .nav-link:hover,
.navbar .nav-link.active {
  color: #ffffff !important;
}

/* Dropdown menu items sit on a white popup, not the purple navbar --
   reset them back to normal (dark) text regardless of the navbar rule above. */
.navbar .dropdown-menu .nav-link,
#navpanel .dropdown-menu .nav-link {
  color: var(--ez-ink) !important;
}

.navbar .dropdown-menu .nav-link:hover,
#navpanel .dropdown-menu .nav-link:hover,
.navbar .dropdown-menu .nav-link.active,
#navpanel .dropdown-menu .nav-link.active {
  color: var(--ez-purple) !important;
}

/* Links and accents */
a,
.toc .nav-link.active,
.pagination .page-item.active .page-link {
  color: var(--ez-purple);
}

a:hover {
  color: var(--ez-purple-dark);
}

.btn-primary {
  background-color: var(--ez-accent);
  border-color: var(--ez-accent);
  color: #ffffff;
}

.btn-primary:hover {
  background-color: var(--ez-accent-dark);
  border-color: var(--ez-accent-dark);
}

/* Sidebar TOC active item */
.toc .nav-item .nav-link.active {
  font-weight: 600;
  border-left: 2px solid var(--ez-purple);
  color: var(--ez-purple);
}

/* Headings */
h1, h2, h3, h4, h5, h6 {
  font-weight: 700;
  letter-spacing: -0.01em;
  color: var(--ez-ink);
}

/* Code blocks */
pre code, code {
  border-radius: 6px;
}

/* Search box focus ring */
#search-query:focus {
  border-color: var(--ez-purple);
  box-shadow: 0 0 0 0.2rem rgba(98, 57, 234, 0.25);
}

/* Dark mode: keep the navbar purple, let the page body stay dark */
html[data-bs-theme='dark'] .navbar {
  background-color: var(--ez-purple) !important;
}

html[data-bs-theme='dark'] h1,
html[data-bs-theme='dark'] h2,
html[data-bs-theme='dark'] h3,
html[data-bs-theme='dark'] h4,
html[data-bs-theme='dark'] h5,
html[data-bs-theme='dark'] h6 {
  color: inherit;
}