//Colors

// White/black
$white: #ffffff;
$black: #000000;

// Blues
$blue-100: #e4f1f7; // Used in theme
$blue-200: #c1dfee;
$blue-300: #9fcee6;
$blue-400: #69adcf; // Used in theme
$blue-500: #3b8fb8;
$blue: #1574a1; // Default Blue
$blue-700: #06577c;
$blue-800: #003d58;
$blue-900: #002433; // Used in theme

// Reds
$red-100: #ffe6e4;
$red-200: #fcbfbb;
$red-300: #f89892;
$red-400: #e65c53;
$red: #d4281c; // Default Red
$red-600: #ac160b;
$red-700: #840900;
$red-800: #5b0600;
$red-900: #330300;

// Greens
$green-100: #e3f2ea;
$green-150: #e6f2ec;
$green-200: #bcedd4;
$green-300: #94d7b6;
$green-400: #5abc8c; // Used in theme
$green-500: #2ca168;
$green: #0c7e47; // Default Green
$green-700: #006a36;
$green-800: #004f28;
$green-900: #00331a;

// Yellows
$yellow-100: #fff5eb;
$yellow-200: #ffe1c6;
$yellow-300: #ffcaa0;
$yellow-400: #f5975d;
$yellow: #e86421; // Default Yellow
$yellow-600: #bb4b06;
$yellow-700: #8e3c00;
$yellow-800: #602d00;
$yellow-900: #331a00;

// Grays
$gray-100: #f5f5f5; // Used in theme
$gray-200: #e3e4e4; // Used in theme
$gray-300: #d2d4d4;
$gray-350: #b3b4b5; // Used for hr
$gray: #b0b3b3; // Default Gray
$gray-500: #8e9292; // Used in theme
$gray-550: #727676; // Used in theme
$gray-600: #4d5151; // Used in theme
$gray-700: #303333; // Used in theme
$gray-800: #222424; // Used in theme
$gray-900: #181a1a; // Used in theme

// Miscellaneous Colors
$indigo: #6610f2;
$purple: #6f42c1;
$pink: #d63384;
$orange: #fd7e14;
$teal: #20c997;
$cyan: #0dcaf0;

// Darker gray
$darker-gray: #525656;

// scss-docs-start colors-map
$colors: (
    "blue": $blue,
    "indigo": $indigo,
    "purple": $purple,
    "pink": $pink,
    "red": $red,
    "orange": $orange,
    "yellow": $yellow,
    "green": $green,
    "teal": $teal,
    "cyan": $cyan,
    "white": $white,
    "gray": $gray,
    "gray-dark": $gray-500,
    "darker-gray":$darker-gray,
);

// scss-docs-start theme-color-variables
$primary: $blue;
$secondary: $red;
$success: $green;
$info: $cyan;
$warning: $yellow;
$danger: $red;
$light: $gray-100;
$dark: $gray-500;

// scss-docs-start theme-colors-map
$theme-colors: (
    "primary": $primary,
    "secondary": $secondary,
    "success": $success,
    "info": $info,
    "warning": $warning,
    "danger": $danger,
    "light": $light,
    "dark": $dark,
);

//Default font color
$body-color: $gray-600;

//Fonts
$font-family-sans-serif: Urbanist, Roboto, Arial, sans-serif;
$font-family-monospace: SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New",
    monospace;
// stylelint-enable value-keyword-case
$font-family-base: $font-family-sans-serif;
$font-family-code: $font-family-monospace;
$font-size-base: 1rem; // Assumes the browser default, typically `16px`

//Headings
$h1-font-size: $font-size-base * 3;
$h2-font-size: $font-size-base * 2.625;
$h3-font-size: $font-size-base * 2;
$h4-font-size: $font-size-base * 1.625;
$h5-font-size: $font-size-base * 1.25;
$h6-font-size: $font-size-base * 0.875;

//Custom Font size (extra small)
$font-size-xsm: $font-size-base * 0.75;
$font-sizes: (
    5: $h5-font-size,
    7: $font-size-xsm,
);

//Font weight
$font-weight-lighter: lighter;
$font-weight-light: 300;
$font-weight-normal: 400;
$font-weight-bold: 500;
$font-weight-bolder: bolder;


//Border Radius
// Helper classes are rounded, rounded-1, rounded-2, rounded-3
$border-radius: 0.25rem;
$border-radius-sm: 0.2rem;
$border-radius-lg: 0.5rem; //Used for buttons. Can be used for other things, of course.
$border-radius-pill: 50rem;

//Progress Bar Styling
$progress-bar-success-color: $green;
$progress-bar-background-color: #cacbcc;

//Spacing
// 8 spacers available instead of the usual 5
$spacer: 1rem;
$spacers: (
    0: 0,
    1: $spacer * 0.25,
    /* 8px */
    2: $spacer * 0.5,
    /* 12px */
    3: $spacer * 0.75,
    /* 16px */
    4: $spacer * 1,
    /* 24px */
    5: $spacer * 1.5,
    /* 32px */
    6: $spacer * 2,
    /* 40px */
    7: $spacer * 2.5,
    /* 48px */
    8: $spacer * 3,
);

//Line Height


//Bootstrap Grid Breakpoints - Use these breakpoints only
$grid-breakpoints: (
    xs: 0,
    md: 768px,
    xl: 1200px,
    xxl: 1440px,
);

//Shadow
$box-shadow: 0 0.5rem 1rem rgba($black, 0.15);
$box-shadow-sm: 0 0.125rem 0.25rem rgba($black, 0.075);
$box-shadow-lg: 0 1rem 3rem rgba($black, 0.25); //Safelite default
$box-shadow-inset: inset 0 1px 2px rgba($black, 0.075);
$box-shadow-input: rgba($black, 0.2) 0rem 0.0625rem 0.3125rem 0rem;

//Alerts
$alert-bg-scale: -90%;
$alert-border-scale: -100%;
$alert-color-scale: 40%;

//Modal animation
// This affects all [Bootstrap] modals
$modal-fade-transform: translate(0, 100%);
$modal-backdrop-opacity: 0;

//Disable default !important behavior
$enable-important-utilities: false;

// Letter Spacing
$letter-spacing-primary: 0.03em;
// Borders
$border-input: 1px solid rgba(179, 180, 181);
$border-input-focus: 2.5px solid $blue;

//Heritage
$heritage-blue-primary: #0070D1;
$heritage-blue-secondary: #167cac;