$color-white: #fff;
$color-black: #000;
$color-blue: #1D35B4;
$color-blueberry: #3858E9;
$color-gray-900: #1E1E1E;
$color-gray-800: #2F2F2F;
$color-gray-700: #757575;
$color-gray-600: #949494;
$color-gray-500: #BBBBBB;
$color-gray-400: #CCCCCC;
$color-gray-300: #EBEBEB;
$color-gray-200: #E0E0E0;
$color-gray: #646970;

$shadow-card: 0 3px 6px 0 rgba(0, 0, 0, 0.15);
$shadow-selection-box: 0 2px 4px 0 rgba(0, 0, 0, 0.1);
$color-gradient-dark: #001435;
$gradient-header: linear-gradient(87.03deg, #003087 -0.49%, #001E51 29.22%, $color-gradient-dark 100%);

$max-width-onboarding: 1024px;
$max-width-onboarding-content: 662px;
$max-width-settings: 938px;

#ppcp-settings-container {
	--max-width-settings: #{$max-width-settings};
	--max-width-onboarding: #{$max-width-onboarding};
	--max-width-onboarding-content: #{$max-width-onboarding-content};

	--max-container-width: var(--max-width-settings);
}