/*******************************/
// Custom Variables
/*******************************/

/*Theme Colors*/

$themecolor: #398bf7;
$themecolor-dark: #028ee1;
$themecolor-alt: #26c6da;
$theme-light: #fff;
$theme-dark: #212529;

$skin1: #242a33;
$skin6: #fff;

/*Topbar Colors*/

$topbar: $theme-light;
$topbar-height: 64px;
$topbar-navlink-padding: 0px 14px;
$topbar-navlink-font-size: 0.875rem;
$topbar-navlink-height: 64px;
$topbar-navbrand-padding: 0 10px 0 10px;

/*Sidebar Colors*/

$sidebar: $theme-light;
$sidebar-alt: #e8eff0;
$sidebar-text: #fff;
$sidebar-icons: #fff;
$sidebar-text-dark: #212529;
$sidebar-icons-dark: #4f5467;

$sidebar-width-full: 250px;
$sidebar-width-mini: 65px;

/*Boxed layout width*/

$boxed-width: 1200px;

/*Shadow*/

$shadow: 1px 0px 20px rgba(0, 0, 0, 0.08);

/*transitions*/

$transitions: 0.2s ease-in;

/*Dark transparent bg*/

$transparent-dark-bg: rgba(0, 0, 0, 0.05);

$lft: left;
$rgt: right;
$card-alt: #e4e9ef;

%square {
  border-radius: 0px;
}

%rotate45 {
  transform: rotate(45deg);
  -ms-transform: rotate(45deg);
  -webkit-transform: rotate(45deg);
  -o-transform: rotate(45deg);
  -moz-transform: rotate(45deg);
}

/*******************************/
// Bootstrap overrides
/*******************************/

/**
 * Table Of Content
 *
 *  1. Color system
 *  2. Options
 *  3. Body
 *  4. Typography
 *  5. Breadcrumbs
 *  6. Cards
 *  7. Dropdowns
 *  8. Buttons
 *  9. Typography
 *  10. Progress bars
 *  11. Tables
 *  12. Forms
 *  14. Component
 */

//
// Color system
//
$white: #fff !default;
$gray-100: #f8f9fa !default;
$gray-200: #e9ecef !default;
$gray-300: #dee2e6 !default;
$gray-400: #ced4da !default;
$gray-500: #a1aab2 !default;
$gray-600: #6c757d !default;
$gray-700: #4f5467 !default;
$gray-800: #343a40 !default;
$gray-900: #212529 !default;
$black: #000 !default;

$blue: #398bf7 !default;
$indigo: #6610f2 !default;
$purple: #745af2 !default;
$pink: #e83e8c !default;
$red: #ef5350 !default;
$orange: #fb8c00 !default;
$yellow: #ffb22b !default;
$green: #06d79c !default;
$teal: #20c997 !default;
$cyan: #4fc3f7 !default;
$primary: #7460ee !default;
$text-muted: $gray-500 !default;

$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-600,
  "gray-dark": $gray-800,
);

$primary: $purple !default;
$secondary: $gray-600 !default;
$success: $green !default;
$info: $blue !default;
$warning: $yellow !default;
$danger: $red !default;
$light: $gray-100 !default;
$dark: $gray-800 !default;
$cyan: $cyan !default;
$orange: $orange !default;
$theme-colors: () !default;
$theme-colors: map-merge(
  (
    "primary": $primary,
    "secondary": $secondary,
    "success": $success,
    "info": $info,
    "warning": $warning,
    "danger": $danger,
    "light": $light,
    "dark": $dark,
    "cyan": $cyan,
    "orange": $orange,
    "purple": $purple,
  ),
  $theme-colors
);

// Quickly modify global styling by enabling or disabling optional features.

$enable-caret: true !default;
$enable-rounded: true !default;
$enable-shadows: false !default;
$enable-gradients: false !default;
$enable-transitions: true !default;
$enable-hover-media-query: false !default;
$enable-grid-classes: true !default;
$enable-print-styles: true !default;

// Body
//
// Settings for the  element.

$main-body-bg: #fff !default;
$body-bg: #f4f6f9;
$body-color: #67757c !default;
$grid-gutter-width: 20px !default;

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

$font-size-base: 0.875rem;
$font-family-sans-serif: "Montserrat", sans-serif !default;
$font-weight-light: 300 !default;
$font-weight-normal: 400 !default;
$font-weight-medium: 600 !default;
$font-weight-bold: 800 !default;

$h1-font-size: 36px !default;
$h2-font-size: 24px !default;
$h3-font-size: 21px !default;
$h4-font-size: 18px !default;
$h5-font-size: 16px !default;
$h6-font-size: 14px !default;

$headings-margin-bottom: (1rem / 2) !default;
$headings-font-weight: 400 !default;
$headings-color: inherit !default;

// Breadcrumbs

$breadcrumb-bg: $body-bg;
$breadcrumb-margin-bottom: 1.5rem;

// Cards

$card-border-width: 0px !default;
$card-border-color: transparent !default;
$card-border-radius: 0px !default;

// Dropdowns

$dropdown-item-padding-x: 1rem !default;
$dropdown-item-padding-y: 0.65rem !default;
$dropdown-border-color: $gray-200;
$dropdown-divider-bg: $gray-100;

// Buttons

$btn-secondary-border: $gray-300;

// Progress bars

$progress-bg: $gray-100;

//
// Define common padding and border radius sizes and more.

$border-width: 1px !default;
$border-color: $gray-200 !default;
$border-radius: 2px !default;
$border-radius-lg: 2px !default;
$border-radius-sm: 1px !default;

// Progress bars

$progress-height: 5px !default;

//Tabs

$nav-tabs-link-active-bg: $white !default;

// Grid breakpoints
//
// Define the minimum dimensions at which your layout will change,
// adapting to different screen sizes, for use in media queries.

$grid-breakpoints: (
  xs: 0,
  sm: 576px,
  md: 768px,
  lg: 992px,
  xl: 1600px,
) !default;

//Navbar

$navbar-dark-color: rgba($white, 0.8) !default;
$navbar-dark-hover-color: rgba($white, 1) !default;
