:root {
	/* Color Palette */
	--color-black: #000;
	--color-dark-slate: #24272f;
	--color-charcoal-gray: #353841;
	--color-slate-gray: #5f6268;
	--color-cloudy-gray: #c0c2c7;
	--color-ice-gray: #F5F6F8;
	--color-lavender-mist: #ECEEF2;
	--color-white: #FFF;
	--color-dark-blue: #0A1E40;
	--color-medium-blue: #165BAA;
	--color-royal-blue: #0065DA;
	--color-light-blue: #40A8F5;
	--color-red: #ff0000;
	--color-green-light: #D1FAE5;
    --color-green-dark: #065F46;
    --color-green-border: #A7F3D0;
    --color-amber-light: #FEF3C7;
    --color-amber-dark: #92400E;
    --color-amber-border: #ffaa0d;
    --color-gray-hover: #E5E7EB;
    --color-green-emerald: #10B981;
    --color-green-emerald-dark: #059669;
    --color-blue-bright: #3B82F6;
    --color-blue-dark: #2563EB;
    --color-red-strong: #EF4444;
    --color-red-dark: #DC2626;

	/* Typography */
	--font-primary: "Inter", arial, helvetica, sans-serif;

	/* Text Colors */
	--text-title: var(--color-black);
	--text-title-form: var(--color-white);
	--text-paragraph-form: var(--color-white);
	--text-paragraph-placeholder: var(--color-black);
	--text-paragraph: var(--color-charcoal-gray);
	--text-ctrl-k: var(--color-black);
	--text-validation: var(--color-red);
	--text-underline: var(--color-light-blue);
	--text-button: var(--color-white);
	--text-button-hover: var(--color-royal-blue);

	/* Background Colors */
	--bg-primary: var(--color-white);
	--bg-secondary: var(--color-ice-gray);
	--bg-tertiary: var(--color-cloudy-gray);
	--bg-quaternary: var(--color-dark-blue);
	--bg-quinary: var(--color-black);
	--bg-senary: var(--color-medium-blue);
	--bg-septenary: var(--color-dark-slate);
	--bg-octonary: var(--color-royal-blue);
	--bg-nonary: var(--color-light-blue);
	--bg-line-aside: var(--color-charcoal-gray);
	--bg-scrollbar: var(--color-slate-gray);
	--bg-ctrl-k: var(--color-ice-gray);
	--bg-button: var(--color-royal-blue);
	--bg-button-hover: var(--color-medium-blue);
	--bg-button-hover-secondary: var(--color-dark-blue);

	/* Border Colors */
	--border-primary: var(--color-lavender-mist);
	--border-secondary: var(--color-black);
	--border-hover: var(--color-medium-blue);

	/* Box Shadow */
	--shadow-primary: rgb(0 0 0 / 10%);
	--shadow-secondary: rgb(0 0 0 / 20%);
	--shadow-quaternary: rgb(0 0 0 / 30%);
	--shadow-quintennial: rgb(0 0 0 / 35%);

	font-size: 62.5%;
}