/* Palette-2/palette-1 resting/hover pair for the main interactive
   accent (see hosts/globalServices/branding/README.md). --fg-accent
   drives --link-fg (plain link text) too; light mode's palette-2 has
   enough contrast against a light background, but on dark backgrounds
   it read too dark/low-contrast for body text specifically -- swapped
   to the brighter palette-1 in dark mode only, buttons/borders stay
   palette-2 in both since those are solid fills (contrast is against
   their own text color, not the page background) rather than raw text
   sitting directly on the page. */
:root {
  --fg-accent: #d91e4d !important;
  --button-bg: #d91e4d !important;
  --button-hover-bg: #ff0026 !important;
  --border-accent: #d91e4d !important;
  --input-border: #d91e4d !important;
  --input-focus-border: #d91e4d !important;
}

@media (prefers-color-scheme: dark) {
  :root {
    --fg-accent: #ff0026 !important;
  }
}

/* Account page: the "admin"/"moderator" role badges default to
   --orange2/--blue2, clashing against the red accent everywhere else.
   Kept distinguishable from each other and from the main accent
   (palette-1 red for admin, palette-4 violet for moderator) rather than
   collapsing both to the same red. */
:root {
  --role-admin: #ff0026 !important;
  --role-mod: #e000ff !important;
}

/* Settings page (/settings): the left sidebar's section headers and
   active/selected item default to --orange2 and --blue3 respectively,
   independent of the vars above. */
:root {
  --settings-nav-header-fg: #d91e4d !important;
  --settings-nav-bg-active: #d91e4d !important;
  --settings-nav-border-active: #ff0026 !important;
}

/* Settings page: sub-section tab buttons (e.g. interaction policy
   presets) default their *resting* (non-hover, non-active) state to
   --blue1 -- hover/active already chain to --button-hover-bg/
   --button-bg above and didn't need a rule here. Neutral gray for
   resting, not another red, so the active tab still reads as visually
   distinct from the others. */
.tab-button {
  background: var(--bg-accent) !important;
}