$white: #fff;
$gray-0: rgba(230, 233, 238, 1);
$gray-1: #f7f7f8;
$gray-2: #e6e9ee;
$gray-3: #9da3ae;
$gray-4: #5f656f;
$gray-5: #2c3335;
$gray-5-selected: #3c4649;
$gray-5-selected-dark: #222829;
$gray-6: #191d1f;
$gray-7: #222829;

$navy-1: #080f2e;
$navy-2: #060b23;
$navy-3: #1f2f5f;
$navy-4: #141e3e;

$object-light: #e6e9ee;
$modal-item-bg-dark: #141c34;

$astar-blue: #0085ff;
$astar-blue-dark: #05b6fd;
$astar-pink: #e0338f;
$astar-pink-1: #e6007a;

$astar-purple: #703ac2;
$shiden-purple: #770cff;
$shiden-purple-dark: #a67cff;
$warning-red: #ff5621;
$negative: $warning-red; // Override Quasar negative color (--q-negative).
$warning-yellow: #d8a400;
$connected-green: #56f566;
$success-green: #38c146;

$neon-blue: rgb(33, 89, 254);

$body-bg-dark: $navy-1;
$body-bg-light: $gray-1;
$container-bg-dark: $navy-2;
$container-bg-white: #ffffff;
$item--bg--hover-dark: $gray-5-selected-dark;
$border-separator-dark: $navy-3;
$border-separator-light: $object-light;
$border-yellow: #f0b90b;
$backdrop-transparent-dark: rgba(44, 51, 53, 0.5);
$backdrop-transparent-dark-firefox: rgba(44, 51, 53, 0.9);
$backdrop-transparent-light: rgba(44, 51, 53, 0.2);
$backdrop-transparent-light-firefox: rgba(44, 51, 53, 0.8);

$container-border-shadow-dark: inset 0px 0px 4px rgba(0, 0, 0, 0.25);
$container-border-shadow-light: 0px 0px 8px 1px rgba(0, 0, 0, 0.1);

$box-red: rgba(255, 86, 33, 0.8);
$box-red-dark: rgba(255, 86, 33, 0.6);
$transparent-red: rgba(255, 86, 33, 0.2);
$transparent-yellow: rgba(242, 201, 76, 0.2);

$xs: 375px;
$sm: 640px;
$md: 768px;
$lg: 1024px;
$xl: 1280px;
$xxl: 1440px;
$xxxl: 1610px;
$widthCardLineUp: 900px;

$container-max-width: 1300px;
$register-form-max-width: 768px;

// Note: overwrite quasar color palette for the quasar components
// Ref: https://quasar.dev/style/color-palette
$blue: $astar-blue;
$light-blue: $astar-blue-dark;
