:root {
  /* Primary color shades */
  --color-primary-50: #e8fee2;
  --color-primary-100: #c8f7b9;
  --color-primary-200: #a5f08e;
  --color-primary-300: #83ea62;
  --color-primary-400: #61e437;
  --color-primary-500: #48ca1e;
  --color-primary-600: #379d15;
  --color-primary-700: #26700d;
  --color-primary-800: #144305;
  --color-primary-900: #021700;
  --color-primary-main: #3eb318;
  /* Secondary color shades */
  --color-secondary-50: #eef1fa;
  --color-secondary-100: #d1d6e0;
  --color-secondary-200: #b4bbc9;
  --color-secondary-300: #96a0b4;
  --color-secondary-400: #78859e;
  --color-secondary-500: #5f6b85;
  --color-secondary-600: #495368;
  --color-secondary-700: #343b4b;
  --color-secondary-800: #1f242e;
  --color-secondary-900: #060c14;
  --color-secondary-main: #242a36;
  /* Tertiary color shades */
  --color-tertiary-50: #efe9ff;
  --color-tertiary-100: #ccbff7;
  --color-tertiary-200: #ab96eb;
  --color-tertiary-300: #896ce1;
  --color-tertiary-400: #6742d7;
  --color-tertiary-500: #4d28bd;
  --color-tertiary-600: #3c1f94;
  --color-tertiary-700: #2b156b;
  --color-tertiary-800: #190c42;
  --color-tertiary-900: #0b021c;
  /* Neutral colors */
  --color-neutral-0: #ffffff;
  --color-neutral-100: #fafafa;
  --color-neutral-200: #eeeeee;
  --color-neutral-300: #bdbdbd;
  --color-neutral-400: #757575;
  --color-neutral-500: #000000;
  /* Semantic colors - Error */
  --color-error-50: #fcecef;
  --color-error-100: #f6d0d6;
  --color-error-200: #e39fa2;
  --color-error-300: #d77a7c;
  --color-error-400: #df5e5e;
  --color-error-500: #e4514a;
  --color-error-600: #d64746;
  --color-error-700: #c43e40;
  --color-error-800: #b83739;
  --color-error-900: #aa2d2d;
  /* Semantic colors - Warning */
  --color-warning-50: #fffde7;
  --color-warning-100: #fef8c6;
  --color-warning-200: #fdf3a1;
  --color-warning-300: #fcf07d;
  --color-warning-400: #fbeb64;
  --color-warning-500: #f7e54d;
  --color-warning-600: #f8d74a;
  --color-warning-700: #f4bf42;
  --color-warning-800: #f1a73b;
  --color-warning-900: #eb7e31;
  /* Semantic colors - Success */
  --color-success-50: #e8fee2;
  --color-success-100: #c8f7b9;
  --color-success-200: #a5f08e;
  --color-success-300: #83ea62;
  --color-success-400: #61e437;
  --color-success-500: #48ca1e;
  --color-success-600: #379d15;
  --color-success-700: #26700d;
  --color-success-800: #144305;
  --color-success-900: #021700;
  /* Semantic colors - Information */
  --color-info-50: #efe9ff;
  --color-info-100: #ccbff7;
  --color-info-200: #ab96eb;
  --color-info-300: #896ce1;
  --color-info-400: #6742d7;
  --color-info-500: #4d28bd;
  --color-info-600: #3c1f94;
  --color-info-700: #2b156b;
  --color-info-800: #190c42;
  --color-info-900: #0b021c;
}

header nav {
  background-color: var(--color-secondary-main) !important;
}