src/styles/variables.css
:root {
	--theme-white: #ffffff;
	--theme-black: #121213;

	--theme-color-primary-rgb: var(--theme-color-success-rgb);
	--theme-color-primary-50: var(--theme-color-success-50);
	--theme-color-primary-100: var(--theme-color-success-200);
	--theme-color-primary-200: var(--theme-color-success-200);
	--theme-color-primary-300: var(--theme-color-success-400);
	--theme-color-primary-400: var(--theme-color-success-400);
	--theme-color-primary-500: var(--theme-color-success-500);
	--theme-color-primary-600: var(--theme-color-success-600);
	--theme-color-primary-700: var(--theme-color-success-700);
	--theme-color-primary-800: var(--theme-color-success-800);
	--theme-color-primary-900: var(--theme-color-success-900);

	--theme-color-secondary-rgb: 165, 173, 185;
	--theme-color-secondary-50: #fcfdfd;
	--theme-color-secondary-100: #f7fafb;
	--theme-color-secondary-200: #eef3f5;
	--theme-color-secondary-300: #dbdee5;
	--theme-color-secondary-400: #c4c8cf;
	--theme-color-secondary-500: #a5adb9;
	--theme-color-secondary-600: #7e8a9c;
	--theme-color-secondary-700: #637282;
	--theme-color-secondary-800: #3c4249;
	--theme-color-secondary-900: #212225;
	--theme-color-secondary-900-rgb: 33, 34, 37;

	--theme-color-success-rgb: 40, 149, 72;
	--theme-color-success-50: #f6fdf8;
	--theme-color-success-100: #edf7f0;
	--theme-color-success-200: #e2f0e6;
	--theme-color-success-300: #b0dbbc;
	--theme-color-success-400: #8cc69d;
	--theme-color-success-500: #42b263;
	--theme-color-success-600: #289548;
	--theme-color-success-700: #307845;
	--theme-color-success-800: #2b4f35;
	--theme-color-success-900: #26372b;

	--theme-color-warning-rgb: 255, 174, 16;
	--theme-color-warning-50: #fff8eb;
	--theme-color-warning-100: #ffe6b8;
	--theme-color-warning-200: #ffd486;
	--theme-color-warning-300: #ffc359;
	--theme-color-warning-400: #feb933;
	--theme-color-warning-500: #ffae10;
	--theme-color-warning-600: #fc9f0f;
	--theme-color-warning-700: #f88e0d;
	--theme-color-warning-800: #f27c0b;
	--theme-color-warning-900: #ec5c08;

	--theme-color-danger-rgb: 201, 41, 44;
	--theme-color-danger-50: #fff5f2;
	--theme-color-danger-100: #ffdfda;
	--theme-color-danger-200: #feb8ae;
	--theme-color-danger-300: #ef7c6d;
	--theme-color-danger-400: #de5846;
	--theme-color-danger-500: #c9292c;
	--theme-color-danger-600: #b01e20;
	--theme-color-danger-700: #881a1b;
	--theme-color-danger-800: #5b1b1b;
	--theme-color-danger-900: #391919;

	--theme-color-hint-rgb: 91, 89, 220;
	--theme-color-hint-50: #f5f5ff;
	--theme-color-hint-100: #e5e5ff;
	--theme-color-hint-200: #d6d5ff;
	--theme-color-hint-300: #9c9aff;
	--theme-color-hint-400: #6e6cef;
	--theme-color-hint-500: #5b59dc;
	--theme-color-hint-600: #5452ce;
	--theme-color-hint-700: #4745b0;
	--theme-color-hint-800: #363383;
	--theme-color-hint-900: #212052;

	--theme-color-info-rgb: 0, 125, 255;
	--theme-color-info-50: #f5faff;
	--theme-color-info-100: #e0ecf5;
	--theme-color-info-200: #bad6f0;
	--theme-color-info-300: #99c7ee;
	--theme-color-info-400: #77b9fe;
	--theme-color-info-500: #3e9dff;
	--theme-color-info-600: #007dff;
	--theme-color-info-700: #075af2;
	--theme-color-info-800: #0b4dc7;
	--theme-color-info-900: #173e85;
}

.theme-light {
	--theme-background-color: var(--theme-white);
	--theme-secondary-background-color: var(--theme-color-secondary-100);

	--theme-text-color: var(--theme-color-secondary-900);
	--theme-secondary-text-color: var(--theme-color-secondary-700);

	--theme-scrollbar-color: var(--theme-color-primary-100);
	--theme-scrollbar-hover-color: var(--theme-color-primary-200);

	--theme-shadow-color: 0, 0, 0;

	--theme-shadow-opacity-xs: 0.05;
	--theme-shadow-opacity-sm: 0.05;
	--theme-shadow-opacity-base-primary: 0.1;
	--theme-shadow-opacity-base-secondary: 0.06;
	--theme-shadow-opacity-md-primary: 0.1;
	--theme-shadow-opacity-md-secondary: 0.06;
	--theme-shadow-opacity-lg-primary: 0.1;
	--theme-shadow-opacity-lg-secondary: 0.05;
	--theme-shadow-opacity-xl-primary: 0.1;
	--theme-shadow-opacity-xl-secondary: 0.04;
	--theme-shadow-opacity-2xl: 0.25;
	--theme-shadow-opacity-inner: 0.06;
}

.theme-dark {
	--theme-background-color: var(--theme-color-secondary-900);
	--theme-secondary-background-color: var(--theme-black);

	--theme-text-color: var(--theme-color-secondary-200);
	--theme-secondary-text-color: var(--theme-color-secondary-500);

	--theme-scrollbar-color: var(--theme-color-secondary-700);
	--theme-scrollbar-hover-color: var(--theme-color-secondary-700);

	--theme-shadow-color: 18, 18, 19;

	--theme-shadow-opacity-xs: 0.6;
	--theme-shadow-opacity-sm: 0.6;
	--theme-shadow-opacity-base-primary: 0.6;
	--theme-shadow-opacity-base-secondary: 0.6;
	--theme-shadow-opacity-md-primary: 0.6;
	--theme-shadow-opacity-md-secondary: 0.6;
	--theme-shadow-opacity-lg-primary: 0.6;
	--theme-shadow-opacity-lg-secondary: 0.6;
	--theme-shadow-opacity-xl-primary: 0.6;
	--theme-shadow-opacity-xl-secondary: 0.6;
	--theme-shadow-opacity-2xl: 0.6;
	--theme-shadow-opacity-inner: 0.6;
}
