:root {
  --scrollthumb : #f3f3f3;
  --body-bg-rgb: 240, 241, 247;
  --primary-rgb: 132, 90, 223;
  --secondary-rgb: 35, 183, 229;
  --warning-rgb: 245, 184, 73;
  --info-rgb: 73, 182, 245;
  --success-rgb: 38, 191, 148;
  --danger-rgb: 230, 83, 60;
  --light-rgb: 243, 246, 248;
  --dark-rgb: 35, 35, 35;
  --orange-rgb: 255, 165, 5;
  --pink-rgb: 231, 145, 188;
  --teal-rgb: 18, 194, 194;
  --purple-rgb: 137, 32, 173;
  --default-body-bg-color: rgb(var(--body-bg-rgb));
  --primary-color: rgb(var(--primary-rgb));
  --primary-border: rgb(var(--primary-rgb));
  --primary01: rgba(var(--primary-rgb), 0.1);
  --primary02: rgba(var(--primary-rgb), 0.2);
  --primary03: rgba(var(--primary-rgb), 0.3);
  --primary04: rgba(var(--primary-rgb), 0.4);
  --primary05: rgba(var(--primary-rgb), 0.5);
  --primary06: rgba(var(--primary-rgb), 0.6);
  --primary07: rgba(var(--primary-rgb), 0.7);
  --primary08: rgba(var(--primary-rgb), 0.8);
  --primary09: rgba(var(--primary-rgb), 0.9);
  --primary005: rgba(var(--primary-rgb), 0.05);
  --default-font-family: "Inter", sans-serif;
  --default-font-weight: 400;
  --default-text-color: #333335;
  --default-border: #f3f3f3;
  --default-background: #f7f8f9;
  --menu-bg: #fff;
  --menu-prime-color: #536485;
  --menu-border-color: #f3f3f3;
  --header-bg: #fff;
  --header-prime-color: #536485;
  --header-border-color: #f3f3f3;
  --custom-white: #fff;
  --custom-black: #000;
  --bootstrap-card-border: #f3f3f3;
  --list-hover-focus-bg: #f5f6f7;
  --text-muted: #8c9097;
  --input-border: #e9edf6;
  --form-control-bg: #ffffff;

  /* Gray set */
  --gray-1: #f9fafb;
  --gray-2: #f2f4f5;
  --gray-3: #e6eaeb;
  --gray-4: #dbdfe1;
  --gray-5: #949eb7;
  --gray-6: #7987a1;
  --gray-7: #4d5875;
  --gray-8: #383853;
  --gray-9: #323251;

  /* White set */
  --white-1: rgba(255, 255, 255, 0.1);
  --white-2: rgba(255, 255, 255, 0.2);
  --white-3: rgba(255, 255, 255, 0.3);
  --white-4: rgba(255, 255, 255, 0.4);
  --white-5: rgba(255, 255, 255, 0.5);
  --white-6: rgba(255, 255, 255, 0.6);
  --white-7: rgba(255, 255, 255, 0.7);
  --white-8: rgba(255, 255, 255, 0.8);
  --white-9: rgba(255, 255, 255, 0.9);

  /* Black set */
  --black-1: rgba(0, 0, 0, 0.1);
  --black-2: rgba(0, 0, 0, 0.2);
  --black-3: rgba(0, 0, 0, 0.3);
  --black-4: rgba(0, 0, 0, 0.4);
  --black-5: rgba(0, 0, 0, 0.5);
  --black-6: rgba(0, 0, 0, 0.6);
  --black-7: rgba(0, 0, 0, 0.7);
  --black-8: rgba(0, 0, 0, 0.8);
  --black-9: rgba(0, 0, 0, 0.9);
}

/*Font Family*/
$default-font-family: var(--default-font-family);

/*Font Size*/
$default-font-size: 0.813rem;

/*Font Weight*/
$default-font-weight: var(--default-font-weight);

/*Body & Text colors*/
$default-body-color: var(--default-body-bg-color);
$default-text-color: var(--default-text-color);

/*Default Background Color*/
$default-background: var(--default-background);

/*Border Color*/
$default-border: var(--default-border);

/*Border Radius*/
$default-radius: 0.5rem;

/*Box Shadow*/
// $box-shadow: 											0 4px 4px rgba(169, 184, 200, 0.15);
$box-shadow: 0 0.125rem 0 rgba(10, 10, 10, 0.04);

/* Header Variables */
$header-bg: var(--header-bg);
$header-prime-color: var(--header-prime-color);
$header-border-color: var(--header-border-color);

/*Menu Variables*/
$menu-prime-color: var(--menu-prime-color);
$menu-bg: var(--menu-bg);
$menu-border-color: var(--menu-border-color);

/*Color Variables*/
$primary: var(--primary-color);
$primary-border: var(--primary-border);
$primary-transparent: var(--primary-transparent-color);
$primary-01: var(--primary01);
$primary-02: var(--primary02);
$primary-03: var(--primary03);
$primary-04: var(--primary04);
$primary-05: var(--primary05);
$primary-06: var(--primary06);
$primary-07: var(--primary07);
$primary-08: var(--primary08);
$primary-09: var(--primary09);
$primary-005: var(--primary005);
$custom-white: var(--custom-white);
$custom-black: var(--custom-black);
$secondary: rgb(var(--secondary-rgb));
$warning: rgb(var(--warning-rgb));
$info: rgb(var(--info-rgb));
$success: rgb(var(--success-rgb));
$danger: rgb(var(--danger-rgb));
$light: rgb(var(--light-rgb));
$dark: rgb(var(--dark-rgb));
$orange: rgb(var(--orange-rgb));
$pink: rgb(var(--pink-rgb));
$purple: rgb(var(--purple-rgb));
$teal: rgb(var(--teal-rgb));
$red: #d03d46;
$blue: #2b3e65;
$green: #1dd871;
$cyan: #00d1d1;
$indigo: #4d5ddb;
$white: #fff;
$gray: #8699a3;
$black: #000;
$yellow: #ffc102;
$text-muted: var(--text-muted);
$bootstrap-card-border: var(--bootstrap-card-border);
$list-hover-focus-bg: var(--list-hover-focus-bg);
$input-border: var(--input-border);
$form-control-bg: var(--form-control-bg);

/* social icons colors */
$facebook: #3b5998;
$twitter: #00acee;
$github: #333;
$google: #cf4e43;
$youtube: #ff0000;

/*gradient variables*/
$primary-gradient: linear-gradient(to right, $primary 0%, #0086ed 100%);
$secondary-gradient: linear-gradient(to right, $secondary 0%, #6789d8 100%);
$success-gradient: linear-gradient(to right, $success 0%, #00a1c0 100%);
$warning-gradient: linear-gradient(to right, $warning 0%, #7fa53a 100%);
$pink-gradient: linear-gradient(to right, $pink 0%, #ffa795 100%);
$teal-gradient: linear-gradient(to right, $teal 0%, #0695dd 100%);
$danger-gradient: linear-gradient(to right, $danger 0%, #a34a88 100%);
$info-gradient: linear-gradient(to right, $info 0%, #52f0ce 100%);
$orange-gradient: linear-gradient(to right, $orange 0%, #9ba815 100%);
$purple-gradient: linear-gradient(to right, $purple 0%, #ff496d 100%);
$light-gradient: linear-gradient(to right, $light 0%, #d1d6de 100%);
$dark-gradient: linear-gradient(to right, $dark 0%, #54505d 100%);

/*gray set*/
$gray-1: var(--gray-1);
$gray-2: var(--gray-2);
$gray-3: var(--gray-3);
$gray-4: var(--gray-4);
$gray-5: var(--gray-5);
$gray-6: var(--gray-6);
$gray-7: var(--gray-7);
$gray-8: var(--gray-8);
$gray-9: var(--gray-9);

/*white set*/
$white-1: var(--white-1);
$white-2: var(--white-2);
$white-3: var(--white-3);
$white-4: var(--white-4);
$white-5: var(--white-5);
$white-6: var(--white-6);
$white-7: var(--white-7);
$white-8: var(--white-8);
$white-9: var(--white-9);

/*black set*/
$black-1: var(--black-1);
$black-2: var(--black-2);
$black-3: var(--black-3);
$black-4: var(--black-4);
$black-5: var(--black-5);
$black-6: var(--black-6);
$black-7: var(--black-7);
$black-8: var(--black-8);
$black-9: var(--black-9);

/* dark mode */
[data-theme-mode="dark"] {
  --scrollthumb : #4d4c4c;
  --body-bg-rgb: 26, 28, 30;
  --body-bg-rgb2: 37, 39, 41;
  --menu-bg: rgb(var(--body-bg-rgb));
  --menu-border-color: rgba(255, 255, 255, 0.1);
  --menu-prime-color: rgba(255, 255, 255, 0.6);
  --header-bg: rgb(var(--body-bg-rgb));
  --header-prime-color: rgba(255, 255, 255, 0.6);
  --header-border-color: rgba(255, 255, 255, 0.1);
  --custom-white: rgb(var(--body-bg-rgb));
  --custom-black: #fff;
  --default-border: rgba(255, 255, 255, 0.1);
  --default-text-color: rgba(255, 255, 255, 0.7);
  --light-rgb: 43, 46, 49;
  --dark-rgb: 240, 245, 248;
  --bootstrap-card-border: rgba(255, 255, 255, 0.1);
  --list-hover-focus-bg: rgba(255, 255, 255, 0.1);
  --default-background: rgba(255, 255, 255, 0.07);
  // --default-body-bg-color:							rgb(var(--body-bg-rgb),0.95);
  --default-body-bg-color: rgb(var(--body-bg-rgb2));
  --text-muted: rgba(255, 255, 255, 0.5);
  --input-border: #313335;
  --form-control-bg: #232628;

  /* Gray Set */
  --gray-100: #110f0f;
  --gray-200: #17171c;
  --gray-300: #393946;
  --gray-400: #505062;
  --gray-500: #73738c;
  --gray-600: #8f8fa3;
  --gray-700: #ababba;
  --gray-800: #c7c7d1;
  --gray-900: #e3e3e8;

  /* white set */
  --white-1: rgba(0, 0, 0, 0.1);
  --white-2: rgba(0, 0, 0, 0.2);
  --white-3: rgba(0, 0, 0, 0.3);
  --white-4: rgba(0, 0, 0, 0.4);
  --white-5: rgba(0, 0, 0, 0.5);
  --white-6: rgba(0, 0, 0, 0.6);
  --white-7: rgba(0, 0, 0, 0.7);
  --white-8: rgba(0, 0, 0, 0.8);
  --white-9: rgba(0, 0, 0, 0.9);

  /* black set */
  --black-1: rgba(255, 255, 255, 0.05);
  --black-2: rgba(255, 255, 255, 0.2);
  --black-3: rgba(255, 255, 255, 0.3);
  --black-4: rgba(255, 255, 255, 0.4);
  --black-5: rgba(255, 255, 255, 0.5);
  --black-6: rgba(255, 255, 255, 0.6);
  --black-7: rgba(255, 255, 255, 0.7);
  --black-8: rgba(255, 255, 255, 0.8);
  --black-9: rgba(255, 255, 255, 0.9);

}