/*
 *
 * This is custom-variables.less, variables list for this plugin.
 *
 */

/* ----- Colors main ----- */
@white-color: #fff;
@grey: #9b9b9b;
@bg-color: #f2f5f7;
@text-color: #9b9b9b;
@text-dark: #4a4a4a;
@red-color: #ff2222;
@green-color: #7ed321;
@orange-color: #f5a623;
@blue-color: #4a79e2;
@navy-color: #070c63;

/* ----- Colors light ----- */
@red-light: #FE5D5D;
@orange-light: #EAA845;
@blue-light: #f2f5f7;
@green-light: #4ECD4F;
@grey-light: #eeeeee;

/* ----- Colors dark ----- */
@orange-dark: #FF7E47;
@grey-dark: #4a4a4a;

/* ----- Borders ----- */
@border-red: #f03a47;
@border-light-color: #ddd;
@border-radius-small: 2px;

/* ----- Transparent colors ----- */
@red-transparent-90: rgba(240, 58, 71, 0.1);
@red-transparent-85: rgba(240, 58, 71, 0.15);
@orange-transparent: rgba(245, 166, 35, 0.15);
@blue-transparent-90: rgba(106, 159, 255, .1);
@blue-transparent-85: rgba(106, 159, 255, .15);

/* ----- Breakpoints ----- */
@screen-xs:                  480px;
//** Deprecated `@screen-xs-min` as of v3.2.0
@screen-xs-min:              @screen-xs;
//** Deprecated `@screen-phone` as of v3.0.1
@screen-phone:               @screen-xs-min;

//** Custom added - medium small
@screen-msm:                  640px;
@screen-msm-min:              @screen-msm;

// Small screen / tablet
//** Deprecated `@screen-sm` as of v3.0.1
@screen-sm:                  768px;
@screen-sm-min:              @screen-sm;
//** Deprecated `@screen-tablet` as of v3.0.1
@screen-tablet:              @screen-sm-min;

// Medium screen / desktop
//** Deprecated `@screen-md` as of v3.0.1
@screen-md:                  992px;
@screen-md-min:              @screen-md;
//** Deprecated `@screen-desktop` as of v3.0.1
@screen-desktop:             @screen-md-min;

// Large screen / wide desktop
//** Deprecated `@screen-lg` as of v3.0.1
@screen-lg:                  1244px;
@screen-lg-min:              @screen-lg;
//** Deprecated `@screen-lg-desktop` as of v3.0.1
@screen-lg-desktop:          @screen-lg-min;

// So media queries don't overlap when required, provide a maximum
@screen-xs-max:              (@screen-msm-min - 1);
@screen-msm-max:             (@screen-sm-min - 1);
@screen-sm-max:              (@screen-md-min - 1);
@screen-md-max:              (@screen-lg-min - 1);

/* ----- Box shadow ----- */
@box-shadow-labels: 1px 1px 4px rgba(0,0,0, 50%);
@box-shadow-btn: 0px 2px 4px rgba(0,0,0, 50%);
@box-shadow-notice: 0px 1px 10px rgba(0,0,0, 20%);
@box-shadow-inputs: -2px -2px 4px 0 rgba(163,177,198,.1), 2px 2px 4px 0 rgba(163,177,198,.5);
@box-shadow-table-row: -6px -6px 10px 0 rgba(163, 177, 198, 0.1), 6px 6px 10px 0 rgba(163, 177, 198, 0.5);


/* ----- Fonts ----- */
@font-size-base: 16px;
@font-size-small: @font-size-base - 2;

@fa-font-family: "Font Awesome 5 Free";
@fa-font-path: "./../webfonts";