/* OutcomeOps brand overrides for MkDocs Material.
 * Sky-blue palette mirrors ui/tailwind.config.js primary tokens. */

/* Header banner uses primary-800 to match the deep sky the main site
 * uses on the "Assign and forget" panel (HowItWorks.tsx L1727 gradient
 * from-primary-900 via-primary-800). White nav text lands with 8+:1
 * contrast on this. */
:root {
  --md-primary-fg-color:        #075985; /* primary-800  -- header + banners */
  --md-primary-fg-color--light: #0284c7; /* primary-600  -- hover states */
  --md-primary-fg-color--dark:  #0c4a6e; /* primary-900  -- deepest */
  --md-accent-fg-color:         #0ea5e9; /* primary-500  -- in-body links / callouts */
  --md-accent-fg-color--transparent: rgba(14, 165, 233, 0.1);
}

/* Dark mode: keep the header the same deep sky-800 as light mode so
 * the banner reads consistent across themes. Body-content accent
 * (links, callouts) lifts to primary-400 so it stays legible against
 * slate. */
[data-md-color-scheme="slate"] {
  --md-primary-fg-color:        #075985; /* primary-800  -- match light mode header */
  --md-primary-fg-color--light: #0284c7; /* primary-600  -- hover */
  --md-primary-fg-color--dark:  #0c4a6e; /* primary-900 */
  --md-accent-fg-color:         #38bdf8; /* primary-400  -- brighter for readable links on slate */
  --md-accent-fg-color--transparent: rgba(56, 189, 248, 0.12);
  --md-hue: 210;
}

/* Header logo sizing -- SVG is embedded and can be tall. Constrain
 * height and preserve aspect. */
.md-header__button.md-logo img,
.md-header__button.md-logo svg {
  height: 1.5rem;
  width: auto;
}