// ======================================================
//
// Theme Variables
//
// ======================================================


// This variable affects the `.h--*` and `.w--*` classes.
$additional-sizer: .25rem !default;
$additional-sizes: () !default;
// stylelint-disable-next-line scss/dollar-variable-default
$additional-sizes: map-merge(
  (
    1: (1 * $additional-sizer), // 0.25rem
    2: (2 * $additional-sizer), // 0.5rem
    3: (3 * $additional-sizer), // 0.75rem
    4: (4 * $additional-sizer), // 1rem
    5: (5 * $additional-sizer), // 1.25rem
    6: (6 * $additional-sizer), // 1.5rem
    8: (8 * $additional-sizer), // 2rem
    10: (10 * $additional-sizer), // 2.5rem
    12: (12 * $additional-sizer), // 3rem
    14: (14 * $additional-sizer), // 3.rem
    16: (16 * $additional-sizer), // 4rem
    18: (18 * $additional-sizer), // 4.5rem
    20: (20 * $additional-sizer), // 5rem
    24: (24 * $additional-sizer), // 6rem
    32: (32 * $additional-sizer), // 8rem
    40: (40 * $additional-sizer), // 10rem
    48: (48 * $additional-sizer), // 12rem
    56: (56 * $additional-sizer), // 14rem
    64: (64 * $additional-sizer), // 16rem
    96: (96 * $additional-sizer), // 24rem
    128: (128 * $additional-sizer), // 32rem
  ),
  $additional-sizes
);

$box-shadow-light:            0 0.5rem 1.5rem rgba($black, .05) !default;
$box-shadow-light-lg:         0 1.5rem 4rem rgba($black, .05) !default;

$box-shadow-dark:             0 0.5rem 1.5rem rgba($black, .12) !default;
$box-shadow-dark-lg:          0 1.5rem 4rem rgba($black, .12) !default;

$box-shadow-lift:             0 1rem 2.5rem rgba($black, .1), 0 .5rem 1rem -.75rem rgba($black, .1) !default;
$box-shadow-lift-lg:          0 2rem 5rem rgba($black, .1), 0 .5rem 1rem -.75rem rgba($black, .05) !default;


// Paragraphs
//
// Style p element.

$paragraph-line-height:         null !default;


// Typography
//
// Font, line-height, and color for body text, headings, and more.

$h1-line-height:                1.3 !default;
$h2-line-height:                1.35 !default;
$h3-line-height:                1.4 !default;
$h4-line-height:                1.45 !default;
$h5-line-height:                1.5 !default;
$h6-line-height:                1.55 !default;

$h1-font-weight:                500 !default;
$h2-font-weight:                500 !default;
$h3-font-weight:                500 !default;
$h4-font-weight:                500 !default;
$h5-font-weight:                600 !default;
$h6-font-weight:                600 !default;

$headings-link-color:           null !default;
$headings-white-link-color:     null !default;

$headings-letter-spacing:       -.01em !default;

$h1-font-size-md:               1.875rem !default; // 30px
$h2-font-size-md:               1.625rem !default; // 26px
$h3-font-size-md:               1.5rem !default; // 24px
$h4-font-size-md:               1.375rem !default; // 22px

$display1-line-height:          1.2 !default;
$display2-line-height:          1.2 !default;
$display3-line-height:          1.2 !default;
$display4-line-height:          1.2 !default;

$display1-size-md:              3.125rem !default; // 48px
$display2-size-md:              2.5rem !default; // 38px
$display3-size-md:              2.25rem !default; // 36px
$display4-size-md:              2rem !default; // 32px

$lead-font-size-md:             1.125rem !default; // 18px


// Buttons
//
// For each of Bootstrap's buttons, define text, background, and border color.

$btn-soft-bg-opacity:                    .1 !default;
$btn-soft-box-shadow-value:              null !default;
$btn-soft-box-shadow-opacity:            .35 !default;
$btn-soft-hover-bg-opacity:              .15 !default;
$btn-soft-active-bg-opacity:             .2 !default;

$btn-icon-width:                         ($btn-padding-y * 2 + $btn-font-size * $btn-line-height + calculatePxToRem($btn-border-width) * 2) !default;
$btn-icon-height:                        ($btn-padding-y * 2 + $btn-font-size * $btn-line-height + calculatePxToRem($btn-border-width) * 2) !default;
$btn-icon-font-size:                     ($btn-font-size * 1) !default;
$btn-icon-width-sm:                      ($btn-padding-y-sm * 2 + $btn-font-size-sm * $btn-line-height-sm + calculatePxToRem($btn-border-width) * 2) !default;
$btn-icon-height-sm:                     ($btn-padding-y-sm * 2 + $btn-font-size-sm * $btn-line-height-sm + calculatePxToRem($btn-border-width) * 2) !default;
$btn-icon-font-size-sm:                  ($btn-font-size * .8175) !default;
$btn-icon-width-lg:                      ($btn-padding-y-lg * 2 + $btn-font-size-lg * $btn-line-height-lg + calculatePxToRem($btn-border-width) * 2) !default;
$btn-icon-height-lg:                     ($btn-padding-y-lg * 2 + $btn-font-size-lg * $btn-line-height-lg + calculatePxToRem($btn-border-width) * 2) !default;
$btn-icon-font-size-lg:                  ($btn-font-size * 1.25) !default;

$btn-text-hover-darken-percentage:       15% !default;
$btn-text-white-hover-color:             rgba($white, .8) !default;


// Forms

// Soft Light
$input-soft-light-bg:                    rgba($white,.05) !default;
$input-soft-light-disabled-bg:           rgba($gray-200,.05) !default;

$input-soft-light-color:                 $white !default;
$input-soft-light-border-color:          rgba($white,.2) !default;
$input-soft-light-box-shadow:            none !default;

$input-soft-light-focus-bg:              rgba($white,.05) !default;
$input-soft-light-focus-border-color:    rgba($white,.5) !default;
$input-soft-light-focus-color:           $white !default;
$input-soft-light-focus-width:           $input-btn-focus-width !default;
$input-soft-light-focus-box-shadow:      $input-btn-focus-box-shadow !default;

$input-soft-light-placeholder-color:     rgba($white,.6) !default;
$input-soft-light-plaintext-color:       $white !default;

// Soft Dark
$input-soft-dark-bg:                     rgba($dark,.05) !default;
$input-soft-dark-disabled-bg:            rgba($gray-500,.05) !default;

$input-soft-dark-color:                  $dark !default;
$input-soft-dark-border-color:           rgba($dark,.2) !default;
$input-soft-dark-box-shadow:             none !default;

$input-soft-dark-focus-bg:               rgba($dark,.05) !default;
$input-soft-dark-focus-border-color:     rgba($dark,.5) !default;
$input-soft-dark-focus-color:            $dark !default;
$input-soft-dark-focus-width:            $input-btn-focus-width !default;
$input-soft-dark-focus-box-shadow:       $input-btn-focus-box-shadow !default;

$input-soft-dark-placeholder-color:      rgba($dark,.6) !default;
$input-soft-dark-plaintext-color:        $dark !default;


// Pagination

$pagination-min-width:          2.8125rem !default;
$pagination-margin-x:           .5rem !default;

$pagination-min-width-sm:       1.9375rem !default;
$pagination-min-width-lg:       3.375rem !default;


// Popovers

$popover-header-font-size:      $h6-font-size !default;


// Badges

$badge-padding-y-sm:            .125rem !default;
$badge-padding-x-sm:            .5em !default;
$badge-padding-y-md:            .5em !default;
$badge-padding-x-md:            1em !default;
$badge-padding-y-lg:            .75em !default;
$badge-padding-x-lg:            1.15em !default;

$badge-width:                   1.25rem !default;
$badge-width-sm:                1rem !default;
$badge-width-md:                1.5rem !default;
$badge-width-lg:                1.875rem !default;

$badge-z-index:                 5 !default;

$badge-soft-bg-opacity:         .1 !default;
$badge-soft-hover-bg-opacity:   .2 !default;


// Avatar

$avatar-size-base:              3rem !default;
$avatar-size-xs:                1.5rem !default;
$avatar-size-sm:                2rem !default;
$avatar-size-lg:                4.5rem !default;
$avatar-size-xl:                6.25rem !default;
$avatar-size-xxl:               9rem !default;

$avatar-title-bg:               $gray-500 !default;
$avatar-title-color:            $white !default;


// Icons

$icon-sizes: () !default;
// stylelint-disable-next-line scss/dollar-variable-default
$icon-sizes: map-merge(
  (
    1: .5rem,
    2: .75rem,
    3: 1rem,
    4: 1.5rem,
    5: 2rem,
    6: 2.5rem,
    7: 3rem
  ),
  $icon-sizes
);

$icon-boxed-ratio:                     2;


// List

$list-item-spacing-y:                  .5rem !default;

$list-link-font-size:                  $font-size-base !default;
$list-link-color:                      $gray-700 !default;
$list-link-hover-color:                $primary !default;

$list-striped-bg-color:                $light !default;


// Breadcrumbs

$breadcrumb-dark-item-color:           rgba($white, .75) !default;
$breadcrumb-dark-link-color:           rgba($white, .75) !default;
$breadcrumb-dark-link-hover-color:     rgba($white, .9) !default;
$breadcrumb-dark-divider-color:        rgba($white, .5) !default;
$breadcrumb-dark-active-color:         $white !default;

$breadcrumb-light-item-color:          rgba($dark, .75) !default;
$breadcrumb-light-link-color:          rgba($dark, .75) !default;
$breadcrumb-light-link-hover-color:    rgba($dark, .9) !default;
$breadcrumb-light-divider-color:       rgba($dark, .5) !default;
$breadcrumb-light-active-color:        $dark !default;


// Navs

$nav-pills-modern-bg:                             $white !default;
$nav-pills-modern-border-radius:                  $border-radius !default;

$nav-pills-modern-link-min-width:                 8rem !default;
$nav-pills-modern-link-color:                     $body-color !default;
$nav-pills-modern-link-active-color:              $component-active-color !default;
$nav-pills-modern-link-active-bg:                 $component-active-bg !default;

$nav-pills-modern-soft-light-bg:                  rgba($white, .1) !default;
$nav-pills-modern-soft-light-link-color:          $white !default;
$nav-pills-modern-soft-light-link-active-color:   $white !default;
$nav-pills-modern-soft-light-link-active-bg:      rgba($white, .1) !default;

$nav-pills-modern-soft-dark-bg:                   rgba($dark, .1) !default;
$nav-pills-modern-soft-dark-link-color:           $dark !default;
$nav-pills-modern-soft-dark-link-active-color:    $dark !default;
$nav-pills-modern-soft-dark-link-active-bg:       rgba($dark, .1) !default;


// Navbar

$navbar-brand-font-weight:             $font-weight-bold !default;

$navbar-nav-link-padding-y-lg:            1rem !default;
$navbar-nav-link-font-weight:          400 !default;

$navbar-nav-item-spacing:              1.5rem !default;


// Dropdowns

$dropdown-min-width-md:                25rem !default;
$dropdown-min-width-lg:                35rem !default;
$dropdown-min-width-xl:                40rem !default;

$dropdown-padding-x:                   $dropdown-item-padding-x !default;
$dropdown-padding-y-lg:                1.75rem !default;
$dropdown-padding-x-lg:                0 !default;

$dropdown-body-padding-y:              1.5rem !default;
$dropdown-body-padding-x:              1.5rem !default;

$dropdown-body-padding-y-lg:           2rem !default;
$dropdown-body-padding-x-lg:           2rem !default;

$dropdown-item-padding-y-lg:           .75rem !default;
$dropdown-item-padding-x-lg:           1.75rem !default;


// Card

$card-cap-bg:                          $white !default;
$card-bg-light:                        $gray-200 !default;
$card-bg-light-hover:                  darken($card-bg-light, 1%) !default;
$card-frame-hover-border-color:        rgba($primary, .3) !default;
$card-text-dark-color:                 $dark !default;
$card-text-dark-hover-color:           $primary !default;
$card-btn-color:                       $dark !default;
$card-btn-arrow-color:                 $primary !default;

$card-collapse-bg-color:               $white !default;
$card-collapse-hover-bg-color:         $light !default;

$card-border-color:                    $gray-300 !default;
$card-frame-border-color:              $card-border-color !default;

$card-frame-hover-box-shadow:          0 0 35px rgba($primary, .125) !default;

$card-spacer-y:                        1rem !default;
$card-spacer-x:                        1rem !default;

$card-frame-transition:                .2s !default;
$card-collapse-transition:             $card-frame-transition ease-in-out !default;
$card-btn-arrow-transition:            $card-frame-transition ease-in-out !default;
$card-btn-arrow-collapsed-rotation:    rotate(180deg) !default;


// Website Slider

$slider-item-inner-sm:                 540px !default;
$slider-item-inner-md:                 720px !default;
$slider-item-inner-lg:                 960px !default;
$slider-item-inner-xl:                 1140px !default;

$slider-item-inner-border-radius:      $border-radius-lg !default;


// Loader

$loader-bg:                            $white !default;
$loader-animation-time:                .5s !default;


// Divider

$divider-width:                        2rem !default;
$divider-width-sm:                     1.25rem !default;
$divider-width-lg:                     3rem !default;

$divider-height:                       .125rem !default;
$divider-bg:                           $gray-700 !default;


// Slick

$slick-arrow-bg:                       $white !default;
$slick-arrow-color:                    $dark !default;
$slick-arrow-hover-bg:                 $white !default;
$slick-arrow-hover-color:              $primary !default;
$slick-arrow-width:                    3.375rem !default;
$slick-arrow-height:                   3.375rem !default;
$slick-arrow-border-radius:            0.25rem !default;
$slick-arrow-font-size:                1.25rem !default;

$slick-dots-bg:                        $gray-300 !default;
$slick-dots-active-bg:                 $dark !default;
