:root {

	/* Primary Colors */
	--color-primary: #de3163;
	--color-primary-hover: #fa0c64;
	--color-primary-active: #fd136a;
	--color-primary-light: #ff2072;
	--color-primary-dark: #e7055a;

	/* Dark Accents */
	--color-slate: #0e2228;
	--color-dark-purple: #261e43;
	--color-navy: #1b1f3c;

	/* Blue & Purple Accents */
	--color-royal-blue: #133796;
	--color-bright-blue: #1442a7;
	--color-azure: #1255c1;
	--color-navy-blue: #152c78;

	/* Light Accents */
	--color-sky-blue: #8dd3fa;
	--color-cool-gray: #cfe1f5;
	--color-soft-blue: #c5e2f7;
	--color-soft-purple: #a579d4;
	--color-steel-blue: #c9d0e0;

	/* Additional Semantic Colors */
	--color-background: #f4f7fa;
	--color-text-primary: #0e2228;
	--color-text-secondary: #4a5568;
	--color-border: #e2e8f0;
}

/* Global Reset and Base Styles */
body {
	background-color: var(--color-background);
	color: var(--color-text-primary);
	font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen, Ubuntu, Cantarell, "Open Sans", "Helvetica Neue", sans-serif;
}