:root {
    --base-50: hsla(60, 9%, 98%, 1.000);
    --base-100: hsla(60, 5%, 96%, 1.000);
    --base-200: hsla(20, 6%, 90%, 1.000);
    --base-300: hsla(24, 6%, 83%, 1.000);
    --base-400: hsla(24, 5%, 64%, 1.000);
    --base-500: hsla(25, 5%, 45%, 1.000);
    --base-600: hsla(33, 5%, 32%, 1.000);
    --base-700: hsla(30, 6%, 25%, 1.000);
    --base-800: hsla(12, 6%, 15%, 1.000);
    --base-900: hsla(24, 10%, 10%, 1.000);
    --base-950: hsla(20, 14%, 4%, 1.000);
    --primary-brand-color: #395382;
    --brand-300: #5879b6;
    --brand-400: #4665a0;
    --brand-500: #3a5383;
    --brand-600: #2d4167;
    --brand-700: #212f4a;
    --primary-300: hsla(35, 100%, 65%, 1.000);
    --primary-400: hsla(35, 100%, 55%, 1.000);
    --primary-500: hsla(35, 100%, 45%, 1.000);
    --primary-600: hsla(35, 100%, 35%, 1.000);
    --primary-700: hsla(35, 100%, 25%, 1.000);
    --secondary-300: hsla(216, 46%, 56%, 1.000);
    --secondary-400: hsla(216, 46%, 46%, 1.000);
    --secondary-500: hsla(216, 46%, 36%, 1.000);
    --secondary-600: hsla(216, 46%, 26%, 1.000);
    --secondary-700: hsla(216, 46%, 16%, 1.000);
    --tertiary-300: hsla(159, 55%, 55%, 1.000);
    --tertiary-400: hsla(159, 55%, 45%, 1.000);
    --tertiary-500: hsla(159, 55%, 35%, 1.000);
    --tertiary-600: hsla(159, 55%, 25%, 1.000);
    --tertiary-700: hsla(159, 55%, 15%, 1.000);
    --success-300: hsla(159, 55%, 55%, 1.000);
    --success-400: hsla(159, 55%, 45%, 1.000);
    --success-500: hsla(159, 55%, 35%, 1.000);
    --success-600: hsla(159, 55%, 25%, 1.000);
    --success-700: hsla(159, 55%, 15%, 1.000);
    --warning-300: hsla(35, 100%, 73%, 1.000);
    --warning-400: hsla(35, 100%, 63%, 1.000);
    --warning-500: hsla(35, 100%, 53%, 1.000);
    --warning-600: hsla(35, 100%, 43%, 1.000);
    --warning-700: hsla(35, 100%, 33%, 1.000);
    --danger-300: hsla(0, 84%, 80%, 1.000);
    --danger-400: hsla(0, 84%, 70%, 1.000);
    --danger-500: hsla(0, 84%, 60%, 1.000);
    --danger-600: hsla(0, 84%, 50%, 1.000);
    --danger-700: hsla(0, 84%, 40%, 1.000);
}

body.color-switch-dark {
    --base-50: hsla(20, 14%, 4%, 1.000);
    --base-100: hsla(24, 10%, 10%, 1.000);
    --base-200: hsla(12, 6%, 15%, 1.000);
    --base-300: hsla(30, 6%, 25%, 1.000);
    --base-400: hsla(33, 5%, 32%, 1.000);
    --base-500: hsla(25, 5%, 45%, 1.000);
    --base-600: hsla(24, 5%, 64%, 1.000);
    --base-700: hsla(24, 6%, 83%, 1.000);
    --base-800: hsla(20, 6%, 90%, 1.000);
    --base-900: hsla(60, 5%, 96%, 1.000);
    --base-950: hsla(60, 9%, 98%, 1.000);
    --brand-300: #212f4a;
    --brand-400: #2d4167;
    --brand-500: #3a5383;
    --brand-600: #4665a0;
    --brand-700: #5879b6;
    --primary-300: hsla(35, 100%, 25%, 1.000);
    --primary-400: hsla(35, 100%, 35%, 1.000);
    --primary-500: hsla(35, 100%, 45%, 1.000);
    --primary-600: hsla(35, 100%, 55%, 1.000);
    --primary-700: hsla(35, 100%, 65%, 1.000);
    --secondary-300: hsla(216, 46%, 16%, 1.000);
    --secondary-400: hsla(216, 46%, 26%, 1.000);
    --secondary-500: hsla(216, 46%, 36%, 1.000);
    --secondary-600: hsla(216, 46%, 46%, 1.000);
    --secondary-700: hsla(216, 46%, 56%, 1.000);
    --tertiary-300: hsla(159, 55%, 15%, 1.000);
    --tertiary-400: hsla(159, 55%, 25%, 1.000);
    --tertiary-500: hsla(159, 55%, 35%, 1.000);
    --tertiary-600: hsla(159, 55%, 45%, 1.000);
    --tertiary-700: hsla(159, 55%, 55%, 1.000);
    --success-300: hsla(159, 55%, 15%, 1.000);
    --success-400: hsla(159, 55%, 25%, 1.000);
    --success-500: hsla(159, 55%, 35%, 1.000);
    --success-600: hsla(159, 55%, 45%, 1.000);
    --success-700: hsla(159, 55%, 55%, 1.000);
    --warning-300: hsla(35, 100%, 33%, 1.000);
    --warning-400: hsla(35, 100%, 43%, 1.000);
    --warning-500: hsla(35, 100%, 53%, 1.000);
    --warning-600: hsla(35, 100%, 63%, 1.000);
    --warning-700: hsla(35, 100%, 73%, 1.000);
    --danger-300: hsla(0, 84%, 40%, 1.000);
    --danger-400: hsla(0, 84%, 50%, 1.000);
    --danger-500: hsla(0, 84%, 60%, 1.000);
    --danger-600: hsla(0, 84%, 70%, 1.000);
    --danger-700: hsla(0, 84%, 80%, 1.000);
}