//================================================
// Webapp Variables
//================================================

$wideminwidth: 767px !default;
$confortableminwidth: 1020px !default;

// Typography
$font-light: 'Poppins-Light' !default;
$font-regular: 'Poppins-Regular' !default;
$font-medium: 'Poppins-Medium' !default;
$font-semibold: 'Poppins-Semibold' !default;
$font-bold: 'Poppins-Bold' !default;
$font-size-base: 0.9rem !default;

$font-family-base:      $font-regular !default;
$headings-font-family:  $font-bold !default;

// Color system
$white:         #FFFFFF !default;
$black:         #0B344E !default;
$primary:       #FF9661 !default;
$secondary:     #758D9B !default;
$success:       #43AA8B !default;
$warning:       #E27646 !default;
$danger:        #E54122 !default;
$light:         #F3F5F7 !default;
$extra-light:   #E4E9EF !default;
$dark:          $black !default;

$gray-100: if(lightness($black) < lightness($white), mix($black, $white, 10%), mix($white, $black, 10%));
$gray-200: if(lightness($black) < lightness($white), mix($black, $white, 20%), mix($white, $black, 20%));
$gray-300: if(lightness($black) < lightness($white), mix($black, $white, 30%), mix($white, $black, 30%));
$gray-400: if(lightness($black) < lightness($white), mix($black, $white, 40%), mix($white, $black, 40%));
$gray-500: if(lightness($black) < lightness($white), mix($black, $white, 50%), mix($white, $black, 50%));
$gray-600: if(lightness($black) < lightness($white), mix($black, $white, 60%), mix($white, $black, 60%));
$gray-700: if(lightness($black) < lightness($white), mix($black, $white, 70%), mix($white, $black, 70%));
$gray-800: if(lightness($black) < lightness($white), mix($black, $white, 80%), mix($white, $black, 80%));
$gray-900: if(lightness($black) < lightness($white), mix($black, $white, 90%), mix($white, $black, 90%));

// Adjusting YIQ contrast settings for better text contrast
$yiq-contrasted-threshold: 180;
$yiq-text-dark:             if(lightness($black) < lightness($white), $black, $white);
$yiq-text-light:            if(lightness($black) < lightness($white), $white, $black);

$theme-colors: () !default;
$theme-colors: map-merge(
  (
    "white": $white,
    "black": $black,
    "extra-light": $extra-light,
  ),
  $theme-colors
);

// Grid
$grid-gutter-width: 32px !default;
$grid-breakpoints: (
  xs: 0,
  sm: 576px,
  md: 768px,
  lg: 992px,
  xl: 1200px,
  xxl: 1400px,
) !default;

// Body
$body-bg:  $light !default;
$body-color: $black !default;
$border-color: $extra-light !default;
$hr-border-color: $border-color !default;


// Options
$enable-rounded:   true !default;
$enable-gradients: false !default;
$enable-responsive-font-sizes: true !default;

// Card
$card-spacer-y:                     1rem !default;
$card-spacer-x:                     1rem !default;
$card-border-color: $extra-light !default;
$card-border-radius: 1rem !default;
$card-border-width:  0 !default;
$card-cap-bg:        $white !default;

// Tables
$table-cell-padding-sm: 0.25rem !default;
$table-color:           $black !default;
$table-head-color:      $black !default;
$table-head-bg:         $light !default;
$table-hover-bg:        $light !default;
$table-border-color:    $extra-light !default;

// Buttons
$btn-font-size: $font-size-base !default;
$btn-padding-y: 0.25em !default;
$btn-padding-x: 1em !default;
$input-btn-border-width: 1px !default;

$input-btn-focus-width:     2px !default;
$btn-focus-box-shadow:  none !default;
$btn-active-box-shadow: none !default;

$btn-font-size-lg:  16px !default;
$btn-font-family:   $font-medium !default;

$list-group-hover-bg:               $light !default;
$list-group-action-color: $black !default;
$list-group-action-active-bg:       $primary !default;
$list-group-action-active-color:    $black !default;

// Tabs
$nav-link-color:                    $black !default;
$nav-tabs-border-color:             transparent !default;
$nav-tabs-border-width:             4px !default;
$nav-tabs-border-radius:            0 !default;
$nav-tabs-link-hover-border-color:  transparent transparent $secondary !default;
$nav-tabs-link-active-color:        $black !default;
$nav-tabs-link-active-bg:           transparent !default;
$nav-tabs-link-active-border-color: transparent transparent $primary !default;

// Navbar
$navbar-bg:             $white !default;
$navbar-color:          $black !default;
$navbar-border:         $primary !default;
$navbar-active-bg:      $white !default;
$navbar-active-color:   $primary !default;
$navbar-active-border:  $primary !default;
$navbar-hover-bg:       $white !default;
$navbar-hover-color:    $primary !default;
$navbar-hover-border:   $primary !default;
$navbar-height:         50px !default;
$navbar-padding-y:      0 !default;
$navbar-padding-x:      0 !default;

$navbar-toggler-font-size:  24px !default;

// Dropdowns
$dropdown-link-color:               $black !default;
$dropdown-link-hover-color:         $black !default;
$dropdown-link-hover-bg:            $light !default;

// Pagination
$pagination-color:        $primary !default;
$pagination-disabled-bg:  transparent !default;
$pagination-bg:           transparent !default;
$pagination-active-bg:    $primary !default;
$pagination-border-width: 0 !default;

// Forms
$input-font-family: $font-family-base !default;
$input-color: $black !default;
$input-disabled-bg: $light !default;

$input-border-color:  $extra-light !default;
$input-border-width:  2px !default;

$input-focus-box-shadow:    none !default;
$input-focus-border-color:  $primary !default;

$input-placeholder-color: $secondary !default;

$input-group-addon-bg:   $extra-light !default;

// Corteza specific variables
// Topbar
$topbar-height:         64px !default;
$topbar-bg:             $body-bg !default;

// Sidebar
$sidebar-width:         320px !default;
$sidebar-bg:            $white !default;

$corteza-specific: () !default;
$corteza-specific: map-merge(
  (
    "body-bg": $body-bg,
    "topbar-height": $topbar-height,
    "topbar-bg": $topbar-bg,
    "sidebar-width": $sidebar-width,
    "sidebar-bg": $sidebar-bg,
    "font-regular": $font-regular,
    "font-semibold": $font-semibold,
    "font-family-base": $font-family-base,
    "font-medium": $font-medium,
    "btn-font-family": $btn-font-family,
    "btn-padding-x": $btn-padding-x,
    "btn-padding-y": $btn-padding-y,
  ),
  $corteza-specific
);
