@import url('https://fonts.googleapis.com/css2?family=Roboto:ital,wght@0,100;0,300;0,400;0,500;0,700;0,900;1,100;1,300;1,400;1,500;1,700;1,900&display=swap');

.title{
  font-family: 'Roboto', sans-serif;
}

//font sizes
.xss{
  font-size: 0.625em;
}

.xs{
  font-size: 0.75em;
}

.small{
  //font-size: 0.9em;
  font-size: 13px;
}

.body{
  font-size: 1em;
}

.xxxl{
  font-size: 2em;
}

.xxxxl{
  font-size: 3em;
}

.xxxxxl{
  font-size: 4em;
}

//font weights

.thin{
  font-weight: 100;
}

.extra-light{
  font-weight: 200;
}

.light{
  font-weight: 300;
}

.regular{
  font-weight: 400;
}

.medium{
  font-weight: 500;
}

.semi-bold{
  font-weight: 600;
}

.bold{
  font-weight: 700;
}

.extra-bold{
  font-weight: 800;
}

.black{
  font-weight: 900;
}

//colors

.brand{
  color: #4763E4;
}

.bg-brand{
  background-color: #4763E4;
}

.sub-label{
  color: #A1A1A1;
}

.bg-sub-label{
  background-color: #A1A1A1;
}

.main-title{
  color: #343434;
}

.bg-main-title{
  background-color: #343434;
}

.bg-label{
  background-color: #525256;
}

.label{
  color: #525256;
}

.bg-card{
  background-color: #FFFFFF;
}

.bg{
  background-color: #FAFAFA;
}

.sidebar-text{
  color: #5F6D7E;
}

.border-stroke{
  //border-color: #D8DAE5;
  border: 1px solid #D8DAE5;
}

.border-select{
  //border-color: #4763E4;
  border: 1px solid #4763E4;
}

.border-warning{
  //border-color: #E30425;
  border: 1px solid #E30425 !important;
}

.shadow-sm{
  background: var(--Neutral-10, #FFF);
  box-shadow: 0px 8px 16px 0px rgba(15, 23, 42, 0.03), 0px 2px 4px 0px rgba(15, 23, 42, 0.05);
}

.shadow-md{
  background: var(--Neutral-10, #FFF);
  box-shadow: 0px 16px 48px 0px rgba(15, 23, 42, 0.03), 0px 8px 16px 0px rgba(15, 23, 42, 0.05);
}

.shadow-lg{
  background: var(--Neutral-10, #FFF);
  box-shadow: 0px 40px 64px 0px rgba(15, 23, 42, 0.05), 0px 8px 16px 0px rgba(15, 23, 42, 0.05);
}

.btn-primary{
  background-color: #4763E4;
  color: #FFFFFF;
}

.btn-primary:hover{
  background-color: #4763E4;
  color: #FFFFFF;
}


//margins

.mt-5{
  margin-top: 54px;
}

.mb-5{
  margin-bottom: 54px;
}

.ms-5{
  margin-left: 63px;
}

.me-5{
  margin-right: 63px;
}

//paddings

.pt-5{
  padding-top: 54px;
}

.pb-5{
  padding-bottom: 54px;
}

.ps-5{
  padding-left: 68px;
}

.pe-5{
  padding-right: 68px;
}

.focus-ring {
  box-shadow: 0 0 0 1px #FAFAFA !important;;
}


//$focus-ring-width:      .25rem;
//$focus-ring-opacity:    .0;
//$focus-ring-color:      rgba(#ffffff, $focus-ring-opacity);
//$focus-ring-blur:       0;
//$focus-ring-box-shadow: 0 0 $focus-ring-blur $focus-ring-width $focus-ring-color;

.cursor-pointer{
  cursor: pointer;
}

.status-bg{
  background-color: #FEF4E4;
}

.status-bg {
  padding: 0.25em 0.5em;
  border-radius: 4px;
  //color: white;
}

.status-bg.new {
  background-color: #E7EAEE;
  color: #4763E4;
}

.status-bg.pending {
  background-color: #FEF4E4;
  color: #32CD32;
}

.status-bg.inprogress {
  background-color: #FEF4E4;
  color: red;
}

.status-bg.completed {
  background-color: #FEF4E4;
  color: black;
}

.status-bg.failed {
  background-color: red;
  color: white;
}

.btn-filter{
  background-color: #405189;
}

.btn-edit{
  background: var(--May-Green, #388E3C);
}


.pagination{
  --bs-pagination-focus-box-shadow: 0 0 0 1px #FAFAFA !important;

}

.page-link.active, .active > .page-link {
  background-color: #4763E4!important;
  border-color: #4763E4!important;
}