// New Colors
$color__primary: #1765d8;
$color__text_one: #111111;
$color__text_two: #222222;
$color__border: #cacaca;
$color__background: #f7f7ff;
$color__success: #408321;
$color__notification: #1765D8;
$color__error: #e52424;
$color__code_one: #b2cacd;
$color__code_two: #062e32;
$color__black: #000000;
$color__white: #ffffff;
$color__white_hover: rgba(255, 255, 255, 0.6);

// New Typography
$font__heading: "Roboto", sans-serif;
$font__body: "Roboto", sans-serif;
$font__code : "Monaco", "Courier 10 Pitch", Courier, monospace;

// Spacing
$spacing-none               : 0;
$spacing-1                  : 8px;
$spacing-2                  : 16px;
$spacing-3                  : 24px;
$spacing-mobile-4           : 24px;
$spacing-desktop-4          : 32px;
$spacing-mobile-5           : 32px;
$spacing-desktop-5          : 40px;
$spacing-mobile-6           : 32px;
$spacing-desktop-6          : 48px;
$spacing-mobile-7           : 40px;
$spacing-desktop-7          : 56px;
$spacing-mobile-8           : 40px;
$spacing-desktop-8          : 72px;
$spacing-mobile-9           : 48px;
$spacing-desktop-9          : 96px;
$spacing-mobile-10          : 48px;
$spacing-desktop-10         : 144px;

$spacing-xxs                : 4px;
$spacing-xs                 : 8px;
$spacing-s                  : 12px;

// Grid Margins
$grid-margins-s             : 24px;
$grid-margins-m             : 32px;
$grid-margins-l             : 48px;

// Spacing Headerbar
$stickyheader-mobile        : 55px;
$stickyheader-desktop       : 88px;

// Grid Columns
$col1                       : 104px; // 1 grid columns
$col2                       : 208px; // 2 grid columns
$col3                       : 312px; // 3 grid columns
$col4                       : 416px; // 4 grid columns
$col5                       : 520px; // 5 grid columns
$col6                       : 624px; // 6 grid columns
$col7                       : 728px; // 7 grid columns
$col8                       : 832px; // 8 grid columns
$col9                       : 936px; // 9 grid columns
$col10                      : 1040px; // 10 grid columns
$col11                      : 1144px; // 11 grid columns
$col12                      : 1248px; // 12 grid columns
$col7-no-margin             : 680px; // 7 grid columns without padding
$col12-no-margin            : 1200px;

// Border Radius
$border-radius-xs: 8px;
$border-radius-s: 12px;
$border-radius-m: 24px;
$border-radius-l: 36px;
$border-radius-circle: 100px;