/* stylelint-disable no-invalid-double-slash-comments, max-line-length, declaration-block-semicolon-newline-after, number-max-precision */

// Configures bootstrap variables to set our base theme

// Color system
$gray-100:  #f7f7f7;
$gray-200:  #f3f0f0;
$gray-300:  #e4e0df;
$gray-400:  #d9d2d0;
$gray-500:  #a8a0a0;
$gray-600:  #847c7c;
$gray-700:  #6d6565;
$gray-800:  #4a4a4a;
$gray-900:  #1c1c1c;

$white:     #ffffff;
$black:     #000000;
$blue:      #0070e0;
$indigo:    #6610f2;
$purple:    #6f42c1;
$pink:      #f04861;
$red:       #e84031;
$orange:    #ff893e;
$yellow:    #ffd630;
$green:     #17ad41;
$teal:      #20c997;
$cyan:      #17a2b8;
$sky-blue:  #42c6ff;

$primary:   $orange;
$secondary: $gray-300;
$info:      $blue;
$warning:   $yellow;
$danger:    $red;
$success:   $green;

$yiq-contrasted-threshold:  175;
$yiq-text-dark:             $gray-800;

// Options
//
// Quickly modify global styling by enabling or disabling optional features.
$enable-validation-icons:   false;

// Body
$body-bg:                   $white;
$body-color:                $gray-900;

// Links
//
// Style anchor elements.
$link-color:                $blue;

// Components
//
// Define common padding and border radius sizes and more.
$border-width:              1px;
$border-color:              $gray-400;

$border-radius:             .25rem;
$border-radius-sm:          .2rem;
$border-radius-lg:          .3rem;

$component-active-color:    $white;
$component-active-bg:       $blue;

// Typography
//
// Font, line-height, and color for body text, headings, and more.
$font-family-sans-serif:    Rubik, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, "Noto Sans", sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";

$font-size-base:            1rem; // Assumes the browser default, workstation = `12px`
$font-size-lg:              $font-size-base * 1.25;
$font-size-sm:              $font-size-base * .875;

$line-height-base:          1.5;

$h1-font-size:              $font-size-base * 2.5;  // 30px  (base:12)
$h2-font-size:              $font-size-base * 2;    // 24px  (base:12)
$h3-font-size:              $font-size-base * 1.5;  // 18px  (base:12)
$h4-font-size:              $font-size-base * 1.33; // ~16px (base:12)
$h5-font-size:              $font-size-base * 1.16; // ~14px (base:12)
$h6-font-size:              $font-size-base;

$font-weight-light:         $weight_light;
$font-weight-normal:        $weight_book;
$font-weight-bold:          $weight_bold;

$text-muted:                $gray-500;

// Buttons + Forms
//
// Shared variables that are reassigned to `$input-` and `$btn-` specific variables.
$input-btn-padding-y:           .65rem;
$input-btn-padding-x:           1.2rem;
$input-btn-line-height:         $line-height-base;

$input-btn-focus-width:         .2rem;
$input-btn-focus-color:         rgba($component-active-bg, .25);
$input-btn-focus-box-shadow:    0 0 0 $input-btn-focus-width $input-btn-focus-color;

$input-btn-padding-y-sm:        .25rem;
$input-btn-padding-x-sm:        .5rem;

$input-btn-padding-y-lg:        1rem;
$input-btn-padding-x-lg:        2rem;

$input-btn-border-width:        $border-width;

// Buttons
//
// For each of Bootstraps buttons, define text, background, and border color.
$btn-font-weight:                   500;
$btn-font-size-lg:                  1rem;

// Forms
$input-padding-y:                   $input-btn-padding-y;
$input-padding-x:                   $input-btn-padding-x;
$input-line-height:                 $input-btn-line-height;

$input-bg:                          $white;
$input-disabled-bg:                 $gray-200;

$input-color:                       $gray-900;
$input-border-color:                $gray-400;
$input-border-radius:               $border-radius;
$input-border-width:                $input-btn-border-width;
$input-box-shadow:                  inset 0 1px 1px rgba($black, .075);
$input-focus-border-color:          lighten($component-active-bg, 25%);
$input-focus-box-shadow:            $input-btn-focus-box-shadow;
$input-font-size:                   14px;

$input-height-border:               $input-border-width * 2;
$input-height-inner:                calc(#{$input-line-height * 1em} + #{$input-padding-y * 2});
$input-height:                      40px;

// Tooltips
$tooltip-bg:                        $gray-900;

// Dropdowns
$dropdown-box-shadow:               0 .5rem 1rem rgba($black, .175);
$dropdown-link-hover-color:         darken($gray-900, 5%);
$dropdown-link-hover-bg:            $gray-100;

$dropdown-link-active-color:        $component-active-color;
$dropdown-link-active-bg:           $component-active-bg;

$placeholder-color: $gray-600;