/*//////////////////////////////////////////////////////////////////
[ FONT ]*/

:root {
  --alabaster-mist: #e7e4e4;
  --antiflash-white: #fafafb;
  --blue-gray: #425466;
  --light-blue: #e8eeff;
  --light-red: rgba(255, 230, 230, 0.6);
  --cadet-blue: #8492a6; /*all title heading icons color*/
  --light-silver: #dee2e6;
  --main-background: #cbd5e0;
  /* --blue-gray: #a0aec0; */
  --dangerous: #f16063;
  --dangerous2: #f160626c;
  --liberty: #505780;
  --main-color: #4c6fff;
  --charleston-green: #29272e;
  --error-color: #bd081c;
  --red-color: #cc0000;
  --secondary-color: #ffc10d;
  --medium-gray: #b5b5bd; /*disable and filter placeholder checkbox border*/
  --steel-blue: #425466; /*all paragraph*/
  --steel-gray: #7a828a;
  --gainsboro: #edf2f7; /*greish color use for line seprator  */
  --mid-night-blue: #27272e; /*sidebar link text*/
  --gunmetal-blue: #1f2d3d; /*all heading*/
  --alice-blue: #e4ecf7; /*button bg*/
  --whitish-gray: #f7fafc; /*screen background*/
  --white-color: #fff;
  --statistic-card: #fff;
  --input-box: #fff;
  --disabled-bg: #edeef2;
  --disabled-color: #9ea2b3;
  --honey-dew: #deffee;
  --medium-aquamarine: #66cb9f;
  --slate-gray: #425466;
  --slate-blue: #7a7a9d;
  --stormy-blue: #4a5568;
  --black-btn-txt: #101225;
  --label-color: #222222;

  /*
  --slate-blue: #7a7a9d; */

  /* --text-color-gray: #8f8f8f;
  --white-color: #ffffff;
  --text-color-black: #000000;
  --placeholder-color: #a19a9a;
  --sidebar-text-color: #8f9299;
  --footer-text-color: #d1d1d1;
  --primary-color: #4aeab1;
  --secondary-color: #19262b;
  --purple-color: #401f51;
  --text-dark-gray: #808080;
  --label-color: #9b9b9b;
  --disabled-input-color: #fafafa;
  --disabled-label-color: #ababab; */

  --border-radius: 16px;
  --primary-padding: 10px;
  --primary-margin: 10px;
  --light-slate-gray: #c9ced6;
  --filter-action-border: 6px;
  /* --black: #000;
  --medium-aquamarine: #66cb9f;
  --dark-slate-blue: #22293f;
  --honeydew: #deffee;

  --form-border-radius: 16px;

  --gunmetal: #21272a;

   */

  --btn-border-radius: 8px;
  --ghost-white: #f7fafc;
  --onyx: #343a3f;
  --grayish-blue: #1a202c;
  --rhino: #718096;
  --dim-gray: #6d6d6d;
  --charcoal-blue: #2d3748;
  --atomic-tangerine: #f7936f;

  --table-column: #ffff;
}
ul {
  padding: 0;
  margin: 0;
  list-style: none;
}

.c-p {
  cursor: pointer !important;
}
.dark-slate-blue {
  color: var(--dark-slate-blue) !important;
}

.blue-gray {
  color: var(--blue-gray);
}
.slate-blue {
  color: var(--slate-blue);
}
.mid-night-blue {
  color: var(--mid-night-blue);
}
.cadet-blue {
  color: var(--cadet-blue);
}
.onyx {
  color: var(--onyx);
}
body {
}

.overflow-hidden {
  overflow: hidden;
}
.medium-gray {
  color: var(--medium-gray);
}
/* Inter */
/* Regular (normal): 400
  Medium: 500
  SemiBold: 600
  InterBold: 700
  
  */

@font-face {
  font-family: "Inter-bold";
  src: url("./fonts/Inter/Inter-Bold.ttf");
}

@font-face {
  font-family: "Inter-medium";
  src: url("./fonts/Inter/Inter-Medium.ttf");
}

@font-face {
  font-family: "Inter-regular";
  src: url("./fonts/Inter/Inter-Regular.ttf");
}

@font-face {
  font-family: "Inter-extraBold";
  src: url("./fonts/Inter/Inter-ExtraBold.ttf");
}
@font-face {
  font-family: "Inter-semiBold";
  src: url("./fonts/Inter/Inter-SemiBold.ttf");
}

/*//////////////////////////////////////////////////////////////////
    [ RESTYLE TAG ]*/

* {
  margin: 0px;
  padding: 0px;
  box-sizing: border-box;
}

/*---------------------------------------------*/

.fw-400 {
  font-family: "Inter-regular";
}
.fw-500 {
  font-family: "Inter-regular";
}
.fw-600 {
  font-family: "Inter-semiBold";
}
.fw-700 {
  font-family: "Inter-bold";
}

.lh-49 {
  line-height: 49px;
}
.lh-20 {
  line-height: 20px;
}
.lh-12 {
  line-height: 12px;
}
.lh-38 {
  line-height: 38px;
}
.lh-39 {
  line-height: 39px;
}
.lh-23 {
  line-height: 23px;
}
.lh-14 {
  line-height: 14px;
}
.lh-17 {
  line-height: 17px;
}
.lh-27 {
  line-height: 27px;
}
.f18 {
  font-size: 18px;
}
.f14 {
  font-size: 14px;
}
.f16 {
  font-size: 16px;
}
.f12 {
  font-size: 12px;
}
.f10 {
  font-size: 10px;
}
.f20 {
  font-size: 20px;
}
.f28 {
  font-size: 28px;
}
.f36 {
  font-size: 36px;
}
.fw-600 {
  font-family: "Inter-semiBold";
}
.fw-700 {
  font-family: "Inter-bold";
}

.white-color {
  color: var(--white-color);
}

.error-color {
  color: var(--error-color);
}
.bg-white {
  background-color: var(--white-color);
}
.main-color {
  color: var(--main-color);
}
.slate-gray {
  color: var(--slate-gray);
}
.blue-gray {
  color: var(--blue-gray);
}
.mt-10 {
  margin-top: 10px;
}

.gunmetal-blue {
  color: var(--gunmetal-blue);
}
.my-20 {
  margin-block: 20px;
}
.mt-14 {
  margin-top: 14px;
}
.mt-16 {
  margin-top: 16px;
}
.mt-15 {
  margin-top: 15px;
}
.mt-30 {
  margin-top: 30px !important;
}
.mt-18 {
  margin-top: 18px;
}
.mt-38 {
  margin-top: 38px;
}
.my-30 {
  margin-block: 30px !important;
}
.mt-25 {
  margin-top: 25px;
}
.mt-30 {
  margin-top: 30px;
}

.mb-30 {
  margin-bottom: 30px;
}

.mt-8 {
  margin-top: 8px !important;
}
.g-8 {
  gap: 8px;
}
.g-10 {
  gap: 10px;
}

.g-24 {
  gap: 24px;
}
.g-16 {
  gap: 16px;
}
.g-4 {
  gap: 4px;
}
.pt-24 {
  padding-top: 24px !important;
}
.gunmetal {
  color: var(--gunmetal);
}
a.link {
  font-family: "Inter-regular";
  font-size: 14px;
  line-height: 1.7;
  color: var(--d1d1d1-clr);
  margin: 0px;
  transition: all 0.4s;
  -webkit-transition: all 0.4s;
  -o-transition: all 0.4s;
  -moz-transition: all 0.4s;
}
.py-12 {
  padding-block: 12px;
}

a:focus {
  outline: none !important;
}

a:hover {
  text-decoration: none;
}
label {
  font-size: 14px;
  font-family: "Inter-regular";
}
body p {
  font-size: 16px;
  margin: 0;
  padding: 0;
  font-family: "Inter-regular";
}

.customPara {
  font-size: 16px;
  font-family: "Inter-regular";
}

body h1 {
  font-size: 57px;
  font-family: "Inter-bold";
}

body h2 {
  font-size: 28px;
  font-family: "Inter-semiBold";
  line-height: 31px;
  margin: 0;
}

body h3 {
  font-size: 36px;
  font-family: "Inter-regular";
}

body h4 {
  font-size: 28px;
  font-family: "Inter-regular";
  font-weight: 400;
}

body h5 {
  font-size: 24px;
  font-family: "Inter Tight", sans-serif;
  font-weight: 400;
}

body h6 {
  font-size: 22px;
  font-family: "Inter Tight", sans-serif;
  font-weight: 400;
}

/*---------------------------------------------*/

h1,
h2,
h3,
h4,
h5,
h6,
p,
button,
a,
svg {
  margin: 0px;
}
body p {
  font-family: "Inter-regular";
}
body p.large {
  font-size: 24px;
  font-family: "Inter-semiBold";
}

body p.reg {
  font-size: 22px !important;
  font-family: "Inter-bold" !important;
}

.p18 {
  font-size: 18px;
  font-family: "Inter-regular";
}
ul {
  padding: 0;
  margin: 0;
  list-style: none;
}

ul,
li {
  margin: 0px;
  list-style-type: none;
}

/*---------------------------------------------*/

input {
  outline: none;
  border: none;
}

input::-webkit-outer-spin-button,
input::-webkit-inner-spin-button {
  -webkit-appearance: none;
  margin: 0;
}

/* / Firefox / */
input[type="number"] {
  -moz-appearance: textfield;
}

body.dark-mode {
  background-color: #333;
  color: #fff;
}

body.light-mode {
  background-color: #fff;
  color: #333;
}

/*=====
  font classes
  =======
  */

.f14px {
  line-height: 20px;
  font-size: 14px;
  color: var(--slate-gray);
  font-family: "Inter-regular";
}

/*
  =========
  utility classes
  */
.p-0 {
  padding: 0 !important;
}

ul {
  padding: 0;
  margin: 0;
  list-style: none;
}
.font-medium {
  font-family: "Inter-medium";
  font-size: 14px;
  line-height: 14px;
}
.font-regular {
  line-height: 20px;
}
.border-radius {
  border-radius: 6px;
}
.mb8px {
  margin-bottom: 8px;
}
.g-0 {
  gap: 0 !important;
}

.h-100 {
  height: 100%;
}
.mt-30px {
  margin-top: 30px;
}
.align_grid_1rem_gap {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 1rem;
}
.errorText {
  color: var(--red-color);
  font-size: 14px;
  line-height: 20px;
  padding-top: 5px;
  font-family: "Inter-regular";
  text-transform: capitalize;
  margin: 0;
}
.steric {
  color: var(--red-color);
  font-family: "NotoSans-semiBold";
}
.flex_grid_justify-content-center {
  display: flex;
  justify-content: center;
  gap: 1rem;
}

.flex_1rem_gap {
  display: flex;
  align-items: center;
  gap: 1rem;
}
.flex_grid_justify-content-between {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 1rem;
}
.dFlex {
  display: flex;
}
.alignItemsCenter {
  align-items: center;
}
.justifyContentCenter {
  justify-content: center;
}
.justifyContentBetween {
  justify-content: space-between;
}
.gap1rem {
  gap: 1rem;
}
.gap5px {
  gap: 5px;
}
.gap-9 {
  gap: 9px;
}

.button_transparent {
  border-color: transparent;
  background: transparent !important;
  outline: none;
}

.lightBtn {
  font-family: "Inter-semiBold";
  line-height: 12px !important;
  font-size: 12px !important;
  color: var(--dark-slate-blue) !important;
  padding: 12px 20px !important;
  border: 1px solid var(--gainsboro) !important;
  border-radius: var(--filter-action-border) !important;
  background: var(--white-color) !important;
}

.cancel {
  background: var(--alice-blue) !important;
  color: var(--dark-slate-blue) !important;
}

.btn-half {
  width: 50%;
}

.modalBtnColor {
  color: var(--liberty);
}

.py-16 {
  padding-block: 16px !important;
}

.shadow {
  background-color: #ffff;
}

/* material ui */
.MuiPaper-root {
  right: 5% !important;
  width: fit-content !important;
}

.form-check-input:checked {
  background-color: var(--main-color) !important;
  border-color: var(--main-color) !important;
}

input:-webkit-autofill {
  background-color: transparent !important;
  color: inherit !important;
}
