/**
 * @license
 * Copyright Endlessjs. All Rights Reserved.
 * Licensed under the MIT License. See License.txt in the project root for license information.
 */

@import '../core/functions';
@import '../core/mixins';

$theme: (

  /**
   * Sass map contains a list of all Theme variables and also their mappings into Component variables
   * A theme consists of a list of colors, backgrounds, borders, text styles and supporting variables.
   */


  /* Status colors: primary, success, info, warning, danger - for colored elements (buttons, etc) */

  color-primary-100: #f2f6ff,
  color-primary-200: #d9e4ff,
  color-primary-300: #a6c1ff,
  color-primary-400: #598bff,
  color-primary-500: #3366ff,
  color-primary-600: #274bdb,
  color-primary-700: #1a34b8,
  color-primary-800: #102694,
  color-primary-900: #091c7a,

  color-primary-transparent-100: rgba(51, 102, 255, 0.08),
  color-primary-transparent-200: rgba(51, 102, 255, 0.16),
  color-primary-transparent-300: rgba(51, 102, 255, 0.24),
  color-primary-transparent-400: rgba(51, 102, 255, 0.32),
  color-primary-transparent-500: rgba(51, 102, 255, 0.4),
  color-primary-transparent-600: rgba(51, 102, 255, 0.48),

  color-success-100: #f0fff5,
  color-success-200: #ccfce3,
  color-success-300: #8cfac7,
  color-success-400: #2ce69b,
  color-success-500: #00d68f,
  color-success-600: #00b887,
  color-success-700: #00997a,
  color-success-800: #007d6c,
  color-success-900: #004a45,

  color-success-transparent-100: rgba(0, 214, 143, 0.08),
  color-success-transparent-200: rgba(0, 214, 143, 0.16),
  color-success-transparent-300: rgba(0, 214, 143, 0.24),
  color-success-transparent-400: rgba(0, 214, 143, 0.32),
  color-success-transparent-500: rgba(0, 214, 143, 0.4),
  color-success-transparent-600: rgba(0, 214, 143, 0.48),

  color-info-100: #f2f8ff,
  color-info-200: #c7e2ff,
  color-info-300: #94cbff,
  color-info-400: #42aaff,
  color-info-500: #0095ff,
  color-info-600: #006fd6,
  color-info-700: #0057c2,
  color-info-800: #0041a8,
  color-info-900: #002885,

  color-info-transparent-100: rgba(0, 149, 255, 0.08),
  color-info-transparent-200: rgba(0, 149, 255, 0.16),
  color-info-transparent-300: rgba(0, 149, 255, 0.24),
  color-info-transparent-400: rgba(0, 149, 255, 0.32),
  color-info-transparent-500: rgba(0, 149, 255, 0.4),
  color-info-transparent-600: rgba(0, 149, 255, 0.48),

  color-warning-100: #fffdf2,
  color-warning-200: #fff1c2,
  color-warning-300: #ffe59e,
  color-warning-400: #ffc94d,
  color-warning-500: #ffaa00,
  color-warning-600: #db8b00,
  color-warning-700: #b86e00,
  color-warning-800: #945400,
  color-warning-900: #703c00,

  color-warning-transparent-100: rgba(255, 170, 0, 0.08),
  color-warning-transparent-200: rgba(255, 170, 0, 0.16),
  color-warning-transparent-300: rgba(255, 170, 0, 0.24),
  color-warning-transparent-400: rgba(255, 170, 0, 0.32),
  color-warning-transparent-500: rgba(255, 170, 0, 0.4),
  color-warning-transparent-600: rgba(255, 170, 0, 0.48),

  color-danger-100: #fff2f2,
  color-danger-200: #ffd6d9,
  color-danger-300: #ffa8b4,
  color-danger-400: #ff708d,
  color-danger-500: #ff3d71,
  color-danger-600: #db2c66,
  color-danger-700: #b81d5b,
  color-danger-800: #94124e,
  color-danger-900: #700940,

  color-danger-transparent-100: rgba(255, 61, 113, 0.08),
  color-danger-transparent-200: rgba(255, 61, 113, 0.16),
  color-danger-transparent-300: rgba(255, 61, 113, 0.24),
  color-danger-transparent-400: rgba(255, 61, 113, 0.32),
  color-danger-transparent-500: rgba(255, 61, 113, 0.4),
  color-danger-transparent-600: rgba(255, 61, 113, 0.48),

  /* Basic colors - for backgrounds and borders and texts */

  color-basic-100: #ffffff,
  color-basic-200: #f7f9fc,
  color-basic-300: #edf1f7,
  color-basic-400: #e4e9f2,
  color-basic-500: #c5cee0,
  color-basic-600: #8f9bb3,
  color-basic-700: #2e3a59,
  color-basic-800: #222b45,
  color-basic-900: #192038,
  color-basic-1000: #151a30,
  color-basic-1100: #101426,

  color-basic-transparent-100: rgba(143, 155, 179, 0.08),
  color-basic-transparent-200: rgba(143, 155, 179, 0.16),
  color-basic-transparent-300: rgba(143, 155, 179, 0.24),
  color-basic-transparent-400: rgba(143, 155, 179, 0.32),
  color-basic-transparent-500: rgba(143, 155, 179, 0.4),
  color-basic-transparent-600: rgba(143, 155, 179, 0.48),

  color-basic-control-transparent-100: rgba(0, 0, 0, 0.08),
  color-basic-control-transparent-200: rgba(0, 0, 0, 0.16),
  color-basic-control-transparent-300: rgba(0, 0, 0, 0.24),
  color-basic-control-transparent-400: rgba(0, 0, 0, 0.32),
  color-basic-control-transparent-500: rgba(0, 0, 0, 0.4),
  color-basic-control-transparent-600: rgba(0, 0, 0, 0.48),

  /* Status colors states - focus, hover, default, active, disabled  */

  color-primary-focus: color-primary-600,
  color-primary-hover: color-primary-400,
  color-primary-default: color-primary-500,
  color-primary-active: color-primary-600,
  color-primary-disabled: color-primary-300,

  color-success-focus: color-success-600,
  color-success-hover: color-success-400,
  color-success-default: color-success-500,
  color-success-active: color-success-600,
  color-success-disabled: color-success-200,

  color-info-focus: color-info-600,
  color-info-hover: color-info-400,
  color-info-default: color-info-500,
  color-info-active: color-info-600,
  color-info-disabled: color-info-300,

  color-warning-focus: color-warning-600,
  color-warning-hover: color-warning-400,
  color-warning-default: color-warning-500,
  color-warning-active: color-warning-600,
  color-warning-disabled: color-warning-300,

  color-danger-focus: color-danger-600,
  color-danger-hover: color-danger-400,
  color-danger-default: color-danger-500,
  color-danger-active: color-danger-600,
  color-danger-disabled: color-danger-300,

  color-basic-focus: color-basic-600,
  color-basic-hover: color-basic-400,
  color-basic-default: color-basic-500,
  color-basic-active: color-basic-600,
  color-basic-disabled: color-basic-300,

  /* Backgrounds and borders - basic, alternative and primary  */

  background-basic-color-1: color-basic-100,
  background-basic-color-2: color-basic-200,
  background-basic-color-3: color-basic-300,
  background-basic-color-4: color-basic-400,

  border-basic-color-1: color-basic-100,
  border-basic-color-2: color-basic-200,
  border-basic-color-3: color-basic-300,
  border-basic-color-4: color-basic-400,
  border-basic-color-5: color-basic-500,

  background-alternative-color-1: color-basic-800,
  background-alternative-color-2: color-basic-900,
  background-alternative-color-3: color-basic-1000,
  background-alternative-color-4: color-basic-1100,

  border-alternative-color-1: color-basic-800,
  border-alternative-color-2: color-basic-900,
  border-alternative-color-3: color-basic-1000,
  border-alternative-color-4: color-basic-1100,
  border-alternative-color-5: color-basic-1100,

  background-primary-color-1: color-primary-500,
  background-primary-color-2: color-primary-600,
  background-primary-color-3: color-primary-700,
  background-primary-color-4: color-primary-800,

  border-primary-color-1: color-basic-500,
  border-primary-color-2: color-basic-600,
  border-primary-color-3: color-basic-700,
  border-primary-color-4: color-basic-800,
  border-primary-color-5: color-basic-900,

  /* Text colors - general and status */

  text-basic-color: color-basic-900,
  text-alternate-color: color-basic-100,
  text-control-color: color-basic-100,
  text-disabled-color: color-basic-transparent-600,
  text-hint-color: color-basic-600,

  text-primary-color: color-primary-default,
  text-primary-focus-color: color-primary-focus,
  text-primary-hover-color: color-primary-hover,
  text-primary-active-color: color-primary-active,
  text-primary-disabled-color: color-primary-400,

  text-success-color: color-success-default,
  text-success-focus-color: color-success-focus,
  text-success-hover-color: color-success-hover,
  text-success-active-color: color-success-active,
  text-success-disabled-color: color-success-400,

  text-info-color: color-info-default,
  text-info-focus-color: color-info-focus,
  text-info-hover-color: color-info-hover,
  text-info-active-color: color-info-active,
  text-info-disabled-color: color-info-400,

  text-warning-color: color-warning-default,
  text-warning-focus-color: color-warning-focus,
  text-warning-hover-color: color-warning-hover,
  text-warning-active-color: color-warning-active,
  text-warning-disabled-color: color-warning-400,

  text-danger-color: color-danger-default,
  text-danger-focus-color: color-danger-focus,
  text-danger-hover-color: color-danger-hover,
  text-danger-active-color: color-danger-active,
  text-danger-disabled-color: color-danger-400,

  /* Fonts and text styles - headings, subtitles, paragraphs, captions, button */

  font-family-primary: unquote('Open Sans, sans-serif'),
  font-family-secondary: font-family-primary,

  text-heading-1-font-family: font-family-secondary,
  text-heading-1-font-size: 2.25rem,
  text-heading-1-font-weight: 700,
  text-heading-1-line-height: 3rem,

  text-heading-2-font-family: font-family-secondary,
  text-heading-2-font-size: 2rem,
  text-heading-2-font-weight: 700,
  text-heading-2-line-height: 2.5rem,

  text-heading-3-font-family: font-family-secondary,
  text-heading-3-font-size: 1.875rem,
  text-heading-3-font-weight: 700,
  text-heading-3-line-height: 2.5rem,

  text-heading-4-font-family: font-family-secondary,
  text-heading-4-font-size: 1.625rem,
  text-heading-4-font-weight: 700,
  text-heading-4-line-height: 2rem,

  text-heading-5-font-family: font-family-secondary,
  text-heading-5-font-size: 1.375rem,
  text-heading-5-font-weight: 700,
  text-heading-5-line-height: 2rem,

  text-heading-6-font-family: font-family-secondary,
  text-heading-6-font-size: 1.125rem,
  text-heading-6-font-weight: 700,
  text-heading-6-line-height: 1.5rem,

  text-subtitle-font-family: font-family-primary,
  text-subtitle-font-size: 0.9375rem,
  text-subtitle-font-weight: 600,
  text-subtitle-line-height: 1.5rem,

  text-subtitle-2-font-family: font-family-primary,
  text-subtitle-2-font-size: 0.8125rem,
  text-subtitle-2-font-weight: 600,
  text-subtitle-2-line-height: 1.5rem,

  text-paragraph-font-family: font-family-primary,
  text-paragraph-font-size: 0.9375rem,
  text-paragraph-font-weight: 400,
  text-paragraph-line-height: 1.25rem,

  text-paragraph-2-font-family: font-family-primary,
  text-paragraph-2-font-size: 0.8125rem,
  text-paragraph-2-font-weight: 400,
  text-paragraph-2-line-height: 1.125rem,

  text-label-font-family: font-family-primary,
  text-label-font-size: 0.75rem,
  text-label-font-weight: 700,
  text-label-line-height: 1rem,

  text-caption-font-family: font-family-primary,
  text-caption-font-size: 0.75rem,
  text-caption-font-weight: 400,
  text-caption-line-height: 1rem,

  text-caption-2-font-family: font-family-primary,
  text-caption-2-font-size: 0.75rem,
  text-caption-2-font-weight: 600,
  text-caption-2-line-height: 1rem,

  text-button-font-family: font-family-primary,
  text-button-font-weight: 700,
  text-button-tiny-font-size: 0.625rem,
  text-button-tiny-line-height: 0.75rem,
  text-button-small-font-size: 0.75rem,
  text-button-small-line-height: 1rem,
  text-button-medium-font-size: 0.875rem,
  text-button-medium-line-height: 1rem,
  text-button-large-font-size: 1rem,
  text-button-large-line-height: 1.25rem,
  text-button-giant-font-size: 1.125rem,
  text-button-giant-line-height: 1.5rem,

  /* Supporting variables - border radius, outline, shadow, divider */

  border-radius: 0.25rem,

  outline-width: 0.375rem,
  outline-color: color-basic-transparent-200,

  scrollbar-color: background-basic-color-4,
  scrollbar-background-color: background-basic-color-2,
  scrollbar-width: 0.3125rem,

  shadow: 0 0.5rem 1rem 0 rgba(44, 51, 73, 0.1),

  divider-color: border-basic-color-3,
  divider-style: solid,
  divider-width: 1px,
);

$el-themes: el-register-theme($theme, default);
