/**
 * @see wp-content/themes/core-fse/assets/css/vars/semantic.css
 */

/** Override core-fse **/
:root {
  --line-height-tight  : 1.1;
  --line-height-normal : 1.4;
  --line-height-loose  : 1.7;

  --_spacing--edge-x: var(--size-fluid300-70px);
}


/** Color **/
:root {
  --color-base: white;        /* (required) main background (for page) - neutral base color */
  --color-base-1: #f0f0f5;
  --color-base-2: #d2d3e0;
  --color-base-3: #b3b6cb;
  --color-base-4: #8186a8;
  --color-base-5: #393b4a;
  --color-contrast: black;    /* (required) opposite to base (for text on it) */

  --color-accent-1: #faf6f8;
  --color-accent-2: #d3aec4;
  --color-accent: #851f5a;    /* (required) brand accent */
  --color-accent-6: #5a153d;
  --color-accent-7: #300b20;

  --color-on-accent: #f6f6f6;       /* (required) text/icons on accent background */
  --color-on-image: white;          /* (required) text/icons on image background */

  --color-links: #04548d;            /* (required) link color. IMP: CanNOT be "--color-link" because of conflict with WP class .has-link-color */
  --color-links-hover: #022c4a;      /* (required) link hover color */
}

/* LOCAL env colors */
html.env-local {
  /* Fire Engine Red */
  --color-accent-1: #faf6f6;
  --color-accent-2: #d1b2ae;
  --color-accent: #80281f; /* (required) brand accent */
  --color-accent-6: #571b15;
  --color-accent-7: #2e0e0b;
}

/* DEV env colors */
html.env-development {
  /* Emerald Green */
  --color-accent-1: #f6faf8;
  --color-accent-2: #b1d1c2;
  --color-accent: #23764f; /* (required) brand accent */
  --color-accent-6: #174d34;
  --color-accent-7: #0e2e1f;
}

/* STAGE env colors */
html.env-staging {}
/* PROD env colors */
html.env-production {}

/* Accent color variants for theme options */
accent-variants {
  /* Deep Magenta */
  --color-accent-1: #faf6f8;
  --color-accent-2: #d3aec4;
  --color-accent: #851f5a; /* (required) brand accent */
  --color-accent-6: #5a153d;
  --color-accent-7: #300b20;

  /* Fire Engine Red */
  --color-accent-1: #faf6f6;
  --color-accent-2: #d1b2ae;
  --color-accent: #80281f; /* (required) brand accent */
  --color-accent-6: #571b15;
  --color-accent-7: #2e0e0b;

  /* Crimson Red */
  --color-accent-1: #fcf5f6;
  --color-accent-2: #e0a3ab;
  --color-accent: #9b0014; /* (required) brand accent */
  --color-accent-6: #72000f;
  --color-accent-7: #3c0008;

  /* Emerald Green */
  --color-accent-1: #f6faf8;
  --color-accent-2: #b1d1c2;
  --color-accent: #23764f; /* (required) brand accent */
  --color-accent-6: #174d34;
  --color-accent-7: #0e2e1f;

  /* Teal Blue */
  --color-accent-1: #f6f8fa;
  --color-accent-2: #adc4ce;
  --color-accent: #19556e; /* (required) brand accent */
  --color-accent-6: #103748;
  --color-accent-7: #0a212b;
}