/* ELVAD brand theme (Smart Livestock Solutions), served by the proxy in docker/proxy.
   Palette from the Smart Livestock Solutions site and logo:
   red #6b1f23 / logo red #872930, sand #e9d8c4, peach #ffe0c1, cream #fff7f0,
   dark brown #291901 / #1a0e00.
   RULE: red is for the logo and calls to action (primary buttons) only.
   Never use it as a background or a general accent. */
:root {
  --elvad-red: #6b1f23;
  --elvad-logo-red: #872930;
  --elvad-sand: #e9d8c4;
  --elvad-peach: #ffe0c1;
  --elvad-cream: #fff7f0;
  --elvad-brown: #291901;
  --elvad-ink: #1a0e00;

  /* DHIS2's blue (UI accents) and teal (secondary) scales, replaced by the brown/sand scale */
  --colors-blue900: #1a0e00 !important;
  --colors-blue800: #291901 !important;
  --colors-blue700: #4a2f10 !important;
  --colors-blue600: #6f4a20 !important;
  --colors-blue500: #9a7345 !important;
  --colors-blue400: #c1a27a !important;
  --colors-blue300: #e9d8c4 !important;
  --colors-blue200: #f3e7d8 !important;
  --colors-blue100: #faf1e7 !important;
  --colors-blue050: #fffaf5 !important;
  --theme-primary900: #1a0e00 !important;
  --theme-primary800: #291901 !important;
  --theme-primary700: #4a2f10 !important;
  --theme-primary600: #6f4a20 !important;
  --theme-primary500: #9a7345 !important;
  --theme-primary400: #c1a27a !important;
  --theme-primary300: #e9d8c4 !important;
  --theme-primary200: #f3e7d8 !important;
  --theme-primary100: #faf1e7 !important;
  --theme-primary050: #fffaf5 !important;
  --theme-secondary900: #1a0e00 !important;
  --theme-secondary800: #291901 !important;
  --theme-secondary700: #4a2f10 !important;
  --theme-secondary600: #6f4a20 !important;
  --theme-secondary500: #9a7345 !important;
  --theme-secondary400: #c1a27a !important;
  --theme-secondary300: #e9d8c4 !important;
  --theme-secondary200: #f3e7d8 !important;
  --theme-secondary100: #faf1e7 !important;
  --theme-secondary050: #fffaf5 !important;
}

/* Calls to action: the only place red is used */
button.primary {
  background: var(--elvad-logo-red) !important;
  border-color: var(--elvad-red) !important;
  color: #fff !important;
}
button.primary:hover:not([disabled]) {
  background: var(--elvad-red) !important;
}

/* Global shell top bar; the reversed (cream) logo lockup sits directly on the dark brown */
header.global-shell-header,
header.global-shell-header > div {
  background: var(--elvad-brown) !important;
}

header.global-shell-header .headerbar-apps-menu button,
header.global-shell-header .badge {
  background: var(--colors-blue700) !important;
}

/* Login page (class set by brand.js) */
html.elvad-login body {
  background: var(--elvad-cream) !important;
  color: var(--elvad-ink) !important;
}
html.elvad-login body * {
  color: var(--elvad-ink);
}
html.elvad-login button.primary,
html.elvad-login button.primary * {
  color: #fff;
}
html.elvad-login .footer {
  border-top-color: var(--elvad-sand) !important;
}

/* Login layout: one centred column (logo, flag + title, sign-in card) */
html.elvad-login .app {
  flex-direction: column !important;
  align-items: center !important;
}
html.elvad-login .heading {
  flex-direction: column-reverse !important;
  align-items: center !important;
  height: auto !important;
  gap: 20px !important;
  padding: 48px 24px 0 !important;
  text-align: center;
}
html.elvad-login .title-container {
  flex-direction: column !important;
  align-items: center !important;
  gap: 0 !important;
}
html.elvad-login .titles {
  align-items: center !important;
  text-align: center !important;
}
html.elvad-login .flag-wrapper {
  display: none !important;
}
html.elvad-login .logo-wrapper {
  width: auto !important;
  height: 170px !important;
  max-height: none !important;
}
html.elvad-login .logo-wrapper img {
  display: block;
  height: 170px !important;
  width: auto !important;
}
html.elvad-login .login-container {
  margin: 32px auto !important;
}