/**
 * Override :root for all our CD stuff
 *
 * @see https://github.com/UN-OCHA/hid_api/blob/4b5265a8df8afb627ccde70e9df04ca02c46ddc4/assets/css/page.css
 */
:root {
  /**
   * Custom properties for IE.
   *
   * This is needed due to inability to process calc() functions nested within
   * color functions.
   */
  --cd-ie-primary-color: #007faa;
  --cd-ie-primary-color--light: #4ca6c3;
  --cd-ie-primary-color--dark: #001b24;
  /*--cd-ie-primary-color--lighter: #a8ccf0;*/

  /**
   * Define our HSL for HID.
   */
  --cd-primary-color-h: 195;
  --cd-primary-color-s: 100%;
  --cd-primary-color-l: 33.333%;

  /**
   * The HID color was too saturated when using CD's default HSL light color.
   * We're overriding with a less saturated HSL.
   */
  --cd-primary-color--light: hsl(var(--cd-primary-color-h), calc(var(--cd-primary-color-s) - 50%), calc(var(--cd-primary-color-l) + 20%));

  /* darken */
  --cd-primary-color--dark: hsl(var(--cd-primary-color-h), var(--cd-primary-color-s), calc(var(--cd-primary-color-l) - 26%));

  /**
   * Adopt the CD colors for alerts
   *
   * @see https://feature.commondesign-unocha-org.ahconu.org/demo#cd-alert
   */
  --cd-red: #cd3a1f;
  --cd-red--light: #f8d8d3;
  --cd-orange: #db7b18;
  --cd-orange--light: #fae6d1;
  --cd-yellow: #d5de26;
  --cd-yellow--light: #f7f8d3;
  --cd-green: #7fb92f;
  --cd-green--light: #e8f5d6;

  /* CD colours for components */
  --cd-blue-grey: #e6ecf1;
  --cd-blue--bright: #80cbff;
  --cd-grey--light: #f2f2f2;
  --cd-grey--mid: #595959;
  --cd-grey--dark: #4a4a4a;
}