:root {
  --default_font: #000000;
  --primary: #1E71F2;
  --light_primary: #EAF2FF;
  --secondary: #999999;
  --bg_light: #F7F7F8;
  --border: #DBDBDB;
  --dull: #CCCCCC;
  --line: #EDEDED;
  --gray: #8E8E93;
  --bottom_bar: #f3f3f370;
  --place_holder: #A7A7A7;
  --username: #687684
}

.fs8 {
  font-size: 8px;
}

.fs10 {
  font-size: 10px;
}

.fs12 {
  font-size: 12px;
}

.fs14 {
  font-size: 14px;
}

.fs16 {
  font-size: 16px;
}

.fs18 {
  font-size: 18px;
}

.fs20 {
  font-size: 20px;
}

.fs24 {
  font-size: 24px;
}

.fs32 {
  font-size: 32px;
}

.fw500 {
  font-weight: 500;
}

.fw600 {
  font-weight: 600;
}

.text_primary {
  color: var(--primary);
}

.text_secondary {
  color: var(--secondary);
}

.text_gray {
  color: var(--gray);
}

.text_left {
  text-align: left;
}

.text_username {
  color: var(--username);
}

.bg_primary {
  background-color: var(--primary);
}

.mt10 {
  margin-top: 10px;
}

.mt12 {
  margin-top: 12px;
}

.mt14 {
  margin-top: 14px;
}

.mt18 {
  margin-top: 18px;
}

.mt20 {
  margin-top: 20px;
}

.mt22 {
  margin-top: 22px;
}

.mt26 {
  margin-top: 26px;
}

.mt30 {
  margin-top: 30px;
}

.mt32 {
  margin-top: 32px;
}

.mt42 {
  margin-top: 42px;
}

.mt40 {
  margin-top: 40px;
}

.mt50 {
  margin-top: 50px;
}

.mt65 {
  margin-top: 65px;
}

.mb24 {
  margin-bottom: 24px;
}

.mb30 {
  margin-bottom: 30px;
}

.ms10 {
  margin-left: 10px;
}

.ms40 {
  margin-left: 40px;
}

.ms60 {
  margin-left: 60px;
}

.mx40 {
  margin-inline: 40px;
}

.r0 {
  right: 0;
}

.gap6 {
  gap: 6px;
}

.gap10 {
  gap: 10px;
}

.gap12 {
  gap: 12px;
}

.gap20 {
  gap: 20px;
}

.gap24 {
  gap: 24px;
}

p {
  margin-bottom: 0 !important;
}

h1 {
  margin-bottom: 0 !important;
}

button {
  border: none;
  font-size: 16px;
  font-weight: 500;
}

button:disabled {
  opacity: 0.25;
}

button:focus-visible {
  outline: none;
}

button:disabled:hover {
  background-color: var(--secondary);
}

input:focus {
  border: 1px solid var(--secondary);
}

input:focus-visible {
  outline: none;
}

.form-control:focus {
  border-color: #000000 !important;
  box-shadow: none !important;
}

a {
  color: var(--primary) !important;
  text-decoration: none !important;
}

.underline {
  text-decoration: underline;
}