/* MY AMI membership colour palette.
 *
 * Loaded only when MY is the active theme (library my/palette). It overrides
 * the variables from tw_subtheme/src/css/palette.css, which Tailwind's
 * primary, secondary and accent utilities read, so TW Subtheme keeps its own
 * colours. html:root outranks the :root defaults regardless of load order.
 *
 * Brand swatches (docs/theme/Page layouts/AMI-membership-design-rationale.pdf):
 *   Main blue        #2B4A89  -> primary DEFAULT
 *   Light blue       #D9E3F7  -> primary-lighter, secondary-lighter
 *   Supporting blue  #4373D5  -> secondary DEFAULT
 *   Orange accent    #F7941D  -> accent DEFAULT
 * All other shades are derived on the same hue (blue 220, orange 33).
 */
html:root {
  /* MAIN BLUE: header, navigation, links, headings */
  --color-primary-lightest: hsl(220, 65%, 97%);
  --color-primary-lighter: #d9e3f7;
  --color-primary-light: hsl(220, 55%, 80%);
  --color-primary: #2b4a89;
  --color-primary-dark: hsl(220, 52%, 29%);
  --color-primary-darker: hsl(220, 52%, 23%);
  --color-primary-darkest: hsl(220, 52%, 17%);

  /* SUPPORTING BLUE: call-to-action bands, info tiles */
  --color-secondary-lightest: hsl(220, 65%, 97%);
  --color-secondary-lighter: #d9e3f7;
  --color-secondary-light: hsl(220, 63%, 75%);
  --color-secondary: #4373d5;
  --color-secondary-dark: hsl(220, 63%, 45%);
  --color-secondary-darker: hsl(220, 58%, 37%);
  --color-secondary-darkest: hsl(220, 55%, 27%);

  /* ORANGE: buttons, actions, selected details */
  --color-accent-50: hsl(33, 93%, 98%);
  --color-accent-lightest: hsl(33, 93%, 96%);
  --color-accent-lighter: hsl(33, 93%, 90%);
  --color-accent-light: hsl(33, 93%, 72%);
  --color-accent-400: hsl(33, 93%, 63%);
  --color-accent: #f7941d;
  --color-accent-dark: hsl(33, 93%, 42%);
  --color-accent-darker: hsl(33, 93%, 32%);
  --color-accent-darkest: hsl(33, 93%, 22%);
  --color-accent-900: hsl(33, 93%, 14%);
}