:root {
  /*--main-color: #041420;*/
  --main-color: #FFFFFF;
  --white-color: #000000;
  --black-color: #FFFFFF;
  --black-50-color: #00000080;
  --black-30-color: #0000004d;
  --placeholder-color: #888888;
  --button-color: #6253F3;

  --font-family: 'Google Sans Flex 24pt';

  --font-size-30: 30px;
  --font-size-24: 24px;
  --font-size-20: 20px;
  --font-size-18: 18px;
  --font-size-16: 16px;
  --font-size-14: 14px;
  --font-size-12: 12px;

  --line-height-100: 100%;

  --regular-font: normal;
  --medium-font: 500;
  --semibold-font: 600;

  --text-allign-left: left;
  --text-allign-center: center;
  --text-allign-right: right;
}

button:focus,
button:focus-visible,
input:focus,
input:focus-visible {
  box-shadow: unset !important;
  outline: unset !important;
}

a:focus-visible {
  outline: unset !important;
}

a,
a:hover {
  text-decoration: none;
}

.container {
  padding-left: 30px;
  padding-right: 30px;
}

.view-entry .container,
.view-book .container,
.add-entry .container,
.edit-entry .container {
  padding-top: 70px;
}

h3 {
  font-family: var(--font-family);
  font-weight: var(--semibold-font);
  font-size: var(--font-size-30);
  color: var(--white-color);
}

h4 {
  font-family: var(--font-family);
  font-weight: var(--semibold-font);
  font-size: var(--font-size-20);
  color: var(--white-color);
}

p {
  font-family: var(--font-family);
  font-weight: var(--regular-font);
  font-size: var(--font-size-16);
  color: #000;
}

label {
  font-family: var(--font-family);
  font-weight: var(--regular-font);
  font-size: var(--font-size-14);
  color: var(--white-color);
}

input {
  height: 50px !important;
  background-color: #FFFFFF !important;
  border: 1px solid #CFCFCF !important;
  border-radius: 5px !important;
  font-family: var(--font-family) !important;
  font-weight: var(--regular-font) !important;
  font-size: var(--font-size-16) !important;
  color: #000000 !important;
}

textarea {
  background-color: #FFFFFF !important;
  border: 1px solid #CFCFCF !important;
  border-radius: 5px !important;
  font-family: var(--font-family) !important;
  font-weight: var(--regular-font) !important;
  font-size: var(--font-size-16) !important;
  color: #000000 !important;
}

input::placeholder {
  color: #00000080;
}


input:focus, select:focus{
    box-shadow:unset;
}

.input-group input {
  border-right: 0px;
}

.input-group-text {
  background-color: #FFFFFF;
  border: 1px solid #CFCFCF;
  cursor: pointer;
}

button {
  background-color: var(--button-color) !important;
  border-radius: 30px !important;
  font-family: var(--font-family) !important;
  font-weight: var(--medium-font) !important;
  font-size: var(--font-size-16) !important;
  color: var(--black-color) !important;
  padding: 12px 20px !important;
  border: 0px !important;
}

.splashlogo {
  position: absolute;
  top: 50%;
  left: 50%;
  margin-right: -50%;
  transform: translate(-50%, -50%);
  width: 225px;
}

.form-logo {
  max-width: 225px;
  margin: 50px auto;
  display: block;
}

.form-logo-footer {
  max-width: 150px;
  margin: 50px auto;
  display: block;
}

.form-back {
  margin: 30px 0;
  filter: brightness(0);
}

.form-box {
  background: linear-gradient(180deg, #6253F33D 0%, #6253F33D 100%);
  border-radius: 10px;
  padding: 30px;
}

.form-box h3 {
  margin-bottom: 1rem;
}

.fp-link {
  text-align: right;
}

.fp-link a {
  font-family: var(--font-family);
  font-weight: var(--regular-font);
  font-size: var(--font-size-16);
  color: #6253F3;
  text-decoration: none;
}

.form-link {
  color: #00000080;
  text-align: center;
}

.form-link a {
  color: var(--white-color);
  text-decoration: none;
  margin-left: 10px;
}

.form-vertical {
  display: flex;
  align-items: center;
  justify-content: space-between;
  height: 100dvh;
  flex-direction: column;
}


.otp-input {
  width: 50px;
  height: 50px;
  border-radius: 50% !important;
  background-color: var(--white-color);
  border: 1px solid #CFCFCF;
}

.cp-link,
.cp-link:hover {
  font-family: var(--font-family);
  font-weight: var(--regular-font);
  font-size: var(--font-size-16);
  background-color: #1B2353;
  color: #FFF;
  text-decoration: none;
  display: block;
  text-align: center;
  border-radius: 30px !important;
  padding: 13px 20px !important;
  margin: 25px 0;
}

.log-link,
.log-link:hover {
  font-family: var(--font-family);
  font-weight: var(--regular-font);
  font-size: var(--font-size-16);
  background-color: #531B31;
  color: #FFF;
  text-decoration: none;
  display: block;
  text-align: center;
  border-radius: 30px !important;
  padding: 13px 20px !important;
  margin: 25px 0;
}

.login .input-group input,
.register .input-group input,
.new-password input {
  border-bottom-right-radius: 0px !important;
  border-top-right-radius: 0px !important;
  border-right: 0px !important;
}

.sticky-link {
  position: fixed;
  bottom: 30px;
  left: 50%;
  transform: translateX(-50%);
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: center;
  max-width: 516px;
  width: 100%;
}


.sticky-link img {
  margin-left: 5px;
}

.sticky-link a:first-child {
  background-color: #6253F33D;
  border-radius: 20px 0px 0px 20px;
  text-align: center;
  text-decoration: none;
  padding: 10px 30px;
  color: #000;
  flex: 1;
  margin-right: 1px;
  font-family: var(--font-family);
  font-weight: var(--regular-font);
  font-size: var(--font-size-16);
}

.sticky-link a:last-child {
  background-color: #6253F33D;
  border-radius: 0px 20px 20px 0px;
  text-align: center;
  text-decoration: none;
  padding: 10px 30px;
  color: #000;
  flex: 1;
  margin-left: 1px;
  font-family: var(--font-family);
  font-weight: var(--regular-font);
  font-size: var(--font-size-16);
}

.settings .sticky-link a:last-child {
  background: linear-gradient(90deg, #6152F2 0%, #1E166B 100%);
  color: #FFFFFF;
}

.book-list .sticky-link a:first-child {
  background: linear-gradient(90deg, #6152F2 0%, #1E166B 100%);
  color: #FFF;
}

.usbox {
  position: absolute;
  top: 50%;
  left: 50%;
  margin-right: -50%;
  transform: translate(-50%, -50%);
}

.usbox img {
  margin: 0 auto;
  display: block;
}

.usbox h3 {
  text-align: center;
}

.top-sticky {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 15px 0px;
  background-color: var(--main-color);
  position: fixed;
  width: 100%;
  max-width: 516px;
  top: 0%;
  left: 50%;
  margin-right: -50%;
  transform: translate(-50%, 0%);
  z-index: 1;
}

.top-sticky a {
  display: block;
}

.top-sticky > a:first-child img{
    filter: brightness(0);
}


.ueh-title {
  color: #9CA3BC;
  font-family: var(--font-family);
  font-weight: var(--regular-font);
  font-size: var(--font-size-14);
}

.ueh-single {
  background-color: #6253F33D;
  border-radius: 10px;
  padding: 15px;
  margin-bottom: 30px;
}

.ueh-single h5 {
  color: var(--white-color);
  font-family: var(--font-family);
  font-weight: var(--regular-font);
  font-size: var(--font-size-16);
}

.ueh-single h6 {
  color: #000;
  font-family: var(--font-family);
  font-weight: var(--regular-font);
  font-size: var(--font-size-14);
  margin-bottom: 0px;
}

.vebox {
  background: linear-gradient(180deg, #0B7E00 89.03%, #6253F3 89.29%);
  border-radius: 10px;
  padding: 10px;
}

.vebox-top {
  display: flex;
  align-items: center;
  justify-content: space-between;
}

.vebox-top p {
  margin-bottom: 0px;
}

.vebox-top span {
  box-shadow: 0px -3px 15px 0px #00000042 inset;
  color: #FFF;
  font-family: var(--font-family);
  font-weight: var(--medium-font);
  font-size: var(--font-size-20);
  padding: 5px 20px;
  border-radius: 20px;
}

.vebox-bottom {
  background-color: #FFF;
  border-radius: 10px;
  padding: 15px 15px 45px 15px;
  margin-top: 20px;
  border-top: 2px solid #10C000;
}

.vecat {
  color: #9CA3BC;
  font-family: var(--font-family);
  font-weight: var(--regular-font);
  font-size: var(--font-size-14);
  margin-bottom: 5px;
}

.veremark {
  margin-bottom: 5px;
}

.vedate {
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: space-between;
}

.vetime {
  color: #9CA3BC;
  font-family: var(--font-family);
  font-weight: var(--regular-font);
  font-size: var(--font-size-14);
  margin-bottom: 0px;
}

.velabel {
  color: #1B2353;
  background-color: #9A8FFF;
  font-family: var(--font-family);
  font-weight: var(--regular-font);
  font-size: var(--font-size-14);
  border-radius: 5px;
  padding: 5px 10px;
}

.ee-link {
  background-color: var(--button-color) !important;
  border-radius: 30px !important;
  font-family: var(--font-family);
  font-weight: var(--medium-font);
  font-size: var(--font-size-16);
  color: #FFF !important;
  padding: 12px 30px !important;
  text-decoration: none;
  margin: -26px auto 30px auto;
  display: table;
}

.ee-link img {
  margin-right: 10px;
}

.edit-entry-box {
  background: #6253F33D;
  border-radius: 10px;
  padding: 30px;
  margin-bottom: 30px;
}

.edit-entry-box h4 {
  font-family: var(--font-family);
  font-weight: var(--medium-font);
  font-size: var(--font-size-18);
  color: var(--white-color) !important;
}

.amt-input span {
  background-color: #E6E6E6;
  color: #000;
}

.amt-input input {
  font-size: 30px !important;
  text-align: center;
  height: 70px !important;
  border-top-right-radius: 0px !important;
  border-bottom-right-radius: 0px !important;
}

.custom-radio .btn-check:checked+label,
.custom-radio .btn-check:active+.btn-outline-primary {
  border: 0px solid #FFFFFF;
  color:#FFFFFF;
  background-color: #6253F3;
  border-radius: 5px !important;
  padding: 12px 30px;
  margin: 0px 15px 15px 0px;
}

.custom-radio .btn-check+label {
  border: 0px solid #CFCFCF66;
  background-color: #6253F33D;
  border-radius: 5px !important;
  padding: 12px 30px;
  margin: 0px 15px 15px 0px !important;
  color: #000000;
}

.custom-radio label:focus,
.custom-radio input:focus,
.custom-radio .btn-check:focus+.btn-outline-primary {
  box-shadow: unset !important;
}

.cat-box {
  /*background: linear-gradient(180deg, rgba(98, 83, 243, 0) 0%, rgba(98, 83, 243, 0.26) 100%);*/
  /*border-radius: 10px;*/
  /*padding: 10px;*/
}

.cat-box select {
  height: 50px;
  font-family: var(--font-family);
  font-weight: var(--regular-font);
  font-size: var(--font-size-16);
  color: #000 !important;
}

.cat-box a {
  background-color: #39308D;
  font-family: var(--font-family);
  font-weight: var(--regular-font);
  font-size: var(--font-size-14);
  color: #FFF !important;
  text-decoration: none;
  padding: 7px 15px;
  display: inline-block;
  border-radius: 20px;
  margin-top: 15px;
}


.sheet {
  position: fixed;
  bottom: 0;
  width: 100%;
  height: 100%;
  pointer-events: none;
  z-index: 9999;
  max-width: 576px;
  top: 50%;
  left: 50%;
  margin-right: -50%;
  transform: translate(-50%, -50%);
}

/* .sheet::before {
  content: "";
  position: absolute;
  inset: 0;
  background: rgba(0,0,0,0.3);
  opacity: 0;
  transition: 0.3s;
  pointer-events: none;
}

.sheet.active::before {
  opacity: 1;
} */

body.no-scroll {
  overflow: hidden;
}

.shbackdrop {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: rgba(0, 0, 0, 0.5);
  opacity: 0;
  visibility: hidden;
  transition: 0.3s;
  z-index: 9998;
}

.shbackdrop.active {
  opacity: 1;
  visibility: visible;
}


.sheet-content {
  position: absolute;
  bottom: 0;
  width: 100%;
  max-height: 80vh;
  background: linear-gradient(153.22deg, #FFFFFF -7.9%, #EBE9FF 53.39%);
  border-radius: 15px 15px 0 0;
  transform: translateY(100%);
  transition: transform 0.3s ease;
  padding: 30px !important;
  pointer-events: all;
  padding-bottom: env(safe-area-inset-bottom);
  overflow-y: auto;
}

.sheet.active .sheet-content {
  transform: translateY(0);
}

.sheet h3 {
  font-family: var(--font-family);
  font-weight: var(--semibold-font);
  font-size: var(--font-size-20);
  color: #000;
  margin-bottom: 20px;
}

.sheet label,
.sheet-label {
  font-family: var(--font-family);
  font-weight: var(--regular-font);
  font-size: var(--font-size-14);
  color: #000;
}

.grey-btn {
  background-color: #D7D6DD !important;
  border-radius: 30px !important;
  font-family: var(--font-family) !important;
  font-weight: var(--medium-font) !important;
  font-size: var(--font-size-16) !important;
  color: #5B6588 !important;
  padding: 12px 20px !important;
  border: 0px !important;
  text-decoration: none;
  display: block;
  text-align: center;
}

.cat-suggest {
  padding-inline-start: 0px;
  list-style: none;

}

.cat-suggest li {
  display: inline-block;
  background-color: var(--white-color);
  color: #5B6588;
  font-family: var(--font-family);
  font-weight: var(--regular-font);
  font-size: var(--font-size-16);
  padding: 5px 15px;
  border-radius: 5px;
  cursor: pointer;
  margin: 0px 5px 5px 0px;
}


.general-gradient-box {
  /*background: linear-gradient(180deg, rgba(98, 83, 243, 0) 0%, rgba(98, 83, 243, 0.26) 100%);*/
  border-radius: 10px;
  padding: 0px;
  margin-bottom: 30px;
}

.home-top {
  position: fixed;
  width: 100%;
  max-width: 576px;
  background-color: var(--main-color);
  top: 0%;
  left: 50%;
  margin-right: -50%;
  transform: translate(-50%, 0%);
  padding-left: 30px;
  padding-top: 30px;
  z-index: 1;
}

.ht-bot {
  display: flex;
  justify-content: space-between;
  align-items: center;
}

.ht-bot span {
  color: var(--white-color);
  font-family: var(--font-family);
  font-weight: var(--regular-font);
  font-size: var(--font-size-16);
}

.ht-bot a {
  padding: 10px 20px;
  border-radius: 20px 0px 0px 20px;
}

.ht-bot a {
  background: linear-gradient(90deg, #6253F3 90.31%, #39308D 106.89%);
  color: #FFF;
  font-family: var(--font-family);
  font-weight: var(--medium-font);
  font-size: var(--font-size-16);
  text-decoration: none;
}

.home-main .container {
  padding-top: 150px;
}

.bl-single {
  display: flex;
  align-items: center;
  justify-content: space-between;
  background: #6253F33D;
  border-radius: 10px;
  margin-bottom: 30px;
}

.bl-single>img {
  padding: 10px 30px;
}

.bl-single>div {
  
  border-radius: 10px;
  flex: 1;
  display: flex;
  align-items: center;
  justify-content: space-between;
}

.bls-info {
  padding: 20px;
  flex: 1;
}

.bls-info-link {
  flex: 1;
  text-decoration: none;
}

.bls-img-link {
  display: flex;
  justify-content: center;
  align-items: center;
  padding: 30px 30px;
}

.bls-info h5 {
  color: var(--white-color);
  font-family: var(--font-family);
  font-weight: var(--medium-font);
  font-size: var(--font-size-18);
}

.bls-info p {
  color: #8A8FA1;
  font-family: var(--font-family);
  font-weight: var(--medium-font);
  font-size: var(--font-size-14);
  margin-bottom: 0px;
}

.bls-count {
  padding: 20px;
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: end;
}

.bls-count h6 {
  color: var(--white-color);
  font-family: var(--font-family);
  font-weight: var(--semibold-font);
  font-size: var(--font-size-14);
  margin-bottom: 0px;
  margin-right: 15px;
}

.bls-drop {
  background-color: transparent !important;
  padding: 0px !important;
}

.bls-drop a {
  color: #5B6588 !important;
  font-family: var(--font-family);
  font-weight: var(--regular-font);
  font-size: var(--font-size-16);
}

.bls-drop .dropdown-item img {
  margin-top: -2px;
  margin-right: 5px;
}

.bls-drop .dropdown-item:focus,
.bls-drop .dropdown-item:hover {
  background-color: transparent !important;
}

.book-modal {
  margin: 0 auto;
  display: block;
}

.home-main .modal-content {
  border-radius: 10px;
}

.del-modal-cont {
  background: linear-gradient(153.22deg, #FFFFFF -7.9%, #EBE9FF 53.39%);
  border-radius: 10px;
  padding: 30px;
}

.del-modal-cont h4 {
  color: #000;
  font-family: var(--font-family);
  font-weight: var(--medium-font);
  font-size: var(--font-size-20);
  text-align: center;
  margin: 30px 0;
}

.del-modal-cont h4 span {
  color: #6253F3;
  font-weight: var(--semibold-font);
  text-align: center;
  margin: 30px 0;
}

.vbname h3 {
  color: #6253F3;
  font-family: var(--font-family);
  font-weight: var(--semibold-font);
  font-size: var(--font-size-18);
  margin-bottom: 5px;
}

.vbname p {
  color: #5B6588;
  font-family: var(--font-family);
  font-weight: var(--regular-font);
  font-size: var(--font-size-14);
  margin-bottom: 0px;
}

.vbbalance h3 {
  color: var(--white-color);
  font-family: var(--font-family);
  font-weight: var(--semibold-font);
  font-size: var(--font-size-18);
  margin-bottom: 0px;
}

.vbbalance p {
  color: var(--white-color);
  font-family: var(--font-family);
  font-weight: var(--regular-font);
  font-size: var(--font-size-14);
  margin-bottom: 5px;
}

.vbvr-link a,
.vbvr-link a:hover {
  font-family: var(--font-family);
  font-weight: var(--regular-font);
  font-size: var(--font-size-16);
  background-color: #6253F3;
  color: #FFFFFF;
  text-decoration: none;
  display: block;
  text-align: center;
  border-radius: 30px !important;
  padding: 13px 20px !important;
}

.vbttxt {
  background: linear-gradient(90deg, #6253F33D 0%, #6253F33D 100%);
  border-radius: 10px 10px 10px 10px;
  padding: 20px;
}

.vbttxt h5 {
  font-family: var(--font-family);
  font-weight: var(--medium-font);
  font-size: var(--font-size-16);
  color: var(--white-color);
}

.vbttxt h5:last-child,
.vbtamt h5:last-child {
  margin-bottom: 0px;
}

.vbin {
  font-family: var(--font-family);
  font-weight: var(--medium-font);
  font-size: var(--font-size-16);
  text-align: center;
  color: #10C000;
}

.vbout {
  font-family: var(--font-family);
  font-weight: var(--medium-font);
  font-size: var(--font-size-16);
  text-align: center;
  color: #FE0101;
}

.vbtamt {
  background-color: #6253F33D;
  border-radius: 10px 10px 10px 10px;
  padding: 20px;
  border-left: 2px solid var(--black-color);
}

.vbbot-wrap {
  display: flex;
  align-items: center;
  justify-content: space-between;
  position: fixed;
  max-width: 576px;
  width: 100%;
  left: 50%;
  margin-right: -50%;
  transform: translate(-50%, 0%);
  bottom: 30px;
}

.incbtn,
.incbtn:hover {
  font-family: var(--font-family);
  font-weight: var(--regular-font);
  font-size: var(--font-size-16);
  background: linear-gradient(270deg, #10C000 89.03%, #14780B 105.36%);
  color: var(--white-color);
  text-decoration: none;
  display: block;
  text-align: center;
  padding: 13px 20px !important;
  flex: 1;
  margin-right: 40px;
  position: relative;
}

.incbtn img {
  position: absolute;
  right: -25px;
  top: -6px;
}

.expbtn,
.expbtn:hover {
  font-family: var(--font-family);
  font-weight: var(--regular-font);
  font-size: var(--font-size-16);
  background: linear-gradient(90deg, #FF0000 90.31%, #760000 106.89%);
  color: var(--white-color);
  text-decoration: none;
  display: block;
  text-align: center;
  padding: 13px 20px !important;
  flex: 1;
  margin-left: 40px;
  position: relative;
}

.expbtn img {
  position: absolute;
  left: -25px;
  top: -10px;
}

.vb-date {
  font-family: var(--font-family);
  font-weight: var(--regular-font);
  font-size: var(--font-size-14);
  color: var(--white-color);
  margin-bottom: 10px;
  margin-top: 20px;
}

.vb-gen-link {
  margin-bottom: 20px;
  display: block;
}

.vb-income {
  background: #6253F33D;
  border-radius: 10px;
  padding: 15px;
  border-left: 2px solid #10C000;
  display: flex;
  align-items: center;
  justify-content: space-between;
}

.vb-income h5 {
  font-family: var(--font-family);
  font-weight: var(--regular-font);
  font-size: var(--font-size-14);
  color: #000;
}

.vb-income h6 {
  font-family: var(--font-family);
  font-weight: var(--regular-font);
  font-size: var(--font-size-12);
  color: var(--white-color);
}

.vb-income p {
  color: var(--white-color);
  font-family: var(--font-family);
  font-weight: var(--regular-font);
  font-size: var(--font-size-14);
  text-align: right;
  margin-bottom: 0px;
}

.vbi-amt {
  color: var(--white-color);
  font-family: var(--font-family);
  font-weight: var(--medium-font);
  font-size: var(--font-size-16);
  background-color: #10C000;
  border-radius: 20px;
  padding: 7px 15px 5px 15px;
}

.vbi-exp {
  color: var(--white-color);
  font-family: var(--font-family);
  font-weight: var(--medium-font);
  font-size: var(--font-size-16);
  background-color: #FE0101;
  border-radius: 20px;
  padding: 7px 15px 5px 15px;
}

.vb-expence {
  background: #6253F33D;
  border-radius: 10px;
  padding: 15px;
  border-left: 2px solid #FE0101;
  display: flex;
  align-items: center;
  justify-content: space-between;
}

.vb-expence h5 {
  font-family: var(--font-family);
  font-weight: var(--regular-font);
  font-size: var(--font-size-14);
  color: #000;
}

.vb-expence h6 {
  font-family: var(--font-family);
  font-weight: var(--regular-font);
  font-size: var(--font-size-12);
  color: var(--white-color);
}

.vb-expence p {
  color: var(--white-color);
  font-family: var(--font-family);
  font-weight: var(--regular-font);
  font-size: var(--font-size-14);
  text-align: right;
  margin-bottom: 0px;
}

.view-book .container {
  padding-bottom: 80px;
}

.search-group {
  background-color: #FFFFFF;
  border: 2px solid #5B646B;
  border-radius: 5px !important;
}

.filter-btn {
  background-color: #6253F3 !important;
  border: 2px solid #6253F3 !important;
  border-radius: 5px !important;
}

.search-group input {
  background-color: transparent !important;
  height: 50px !important;
  border: 0px !important;
  color: var(--white-color) !important;
  font-family: var(--font-family);
  font-weight: var(--regular-font);
  font-size: var(--font-size-14);
}

.search-group span {
  background-color: transparent !important;
  border: 0px !important;
}

.vb-filter-tab {
  border-bottom: 0px !important;
}

.vb-filter-tab li {
  flex: 1;
}

.vb-filter-tab button {
  width: 100%;
}

.vb-filter-tab .nav-link {
  background-color: #E6E6E6 !important;
  font-family: var(--font-family) !important;
  font-weight: var(--regular-font) !important;
  font-size: var(--font-size-16) !important;
  color: #5B6588 !important;
  border-radius: 0px !important;
}

.vb-filter-tab li:first-child .nav-link {
  border-radius: 5px 0px 0px 5px !important;
}

.vb-filter-tab li:last-child .nav-link {
  border-radius: 0px 5px 5px 0px !important;
}

.vb-filter-tab .nav-link.active {
  background-color: #6253F3 !important;
  color: #FFF !important;
}

.vb-filter-tab-content {
  padding-top: 15px;
}

.vbf-label {
  font-family: var(--font-family) !important;
  font-weight: var(--regular-font) !important;
  font-size: var(--font-size-14) !important;
  color: #000;
}

.date-radio .btn-check:checked+label,
.date-radio .btn-check:active+.btn-outline-primary {
  border: 2px solid #6253F3;
  background-color: var(--black-color);
  border-radius: 5px !important;
  padding: 5px 15px;
  margin: 0px 5px 15px 0px !important;
  color: #5B6588;
}

.date-radio .btn-check+label {
  border: 2px solid var(--black-color);
  background-color: #FFF;
  border-radius: 5px !important;
  padding: 5px 15px;
  margin: 0px 5px 15px 0px !important;
  color: #000;
}

.date-radio label:focus,
.date-radio input:focus,
.date-radio .btn-check:focus+.btn-outline-primary {
  box-shadow: unset !important;
}

.search-group-white input {
  background-color: #FFFFFF !important;
  height: 50px !important;
  border: 0px !important;
  color: var(--black-color) !important;
  font-family: var(--font-family);
  font-weight: var(--regular-font);
  font-size: var(--font-size-14);
}

.search-group-white span {
  background-color: #FFF !important;
  border: 0px !important;
}



.radio-card {
  border-radius: 5px;
  padding: 12px 16px;
  background-color: var(--black-color);
  border: 2px solid transparent;
  cursor: pointer;
  transition: 0.2s ease;
}

.radio-card:hover {
  background-color: var(--black-color);
}

.radio-card input {
  display: none;
}

.radio-card .circle {
  width: 18px;
  height: 18px;
  border: 2px solid #00000080;
  border-radius: 50%;
  position: relative;
}

.radio-card input:checked+.circle {
  border-color: #6253F3;
}

.radio-card input:checked+.circle::after {
  content: "";
  width: 10px;
  height: 10px;
  background-color: #6253F3;
  border-radius: 50%;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
}

.radio-card.active {
  border-color: transparent;
  background-color: #fff;
}

.radio-card span {
  color: #5B6588 !important;
  font-family: var(--font-family);
  font-weight: var(--regular-font);
  font-size: var(--font-size-16);
}

#resend_timer{
    color:#000 !important;    
}

.vebox-top p{
    color:#FFF;
}

.gr-main{
    padding-top:0px !important;    
}



.forgot-password .form-vertical{
    flex-direction: unset;   
}