.green-700 {
  color: #00AF9A;
}

.gray-600 {
  color: #838C9E;
}

.gray-200 {
  color: #E0E2E7;
}

.neutral-200 {
  color: #E9E9EB;
}

.blue-700-b {
  color: #230871;
}

.blue-700 {
  color: #230871;
}

.blue-600 {
  color: #442D86;
}

.gray-900 {
  color: #404B61;
}

.blue-50 {
  color: #F4F3F8;
}

.gray-700 {
  color: #758393;
}

.gray-800 {
  color: #636D80;
}

.gray-bg-700 {
  background-color: #758393;
}

.gray-400 {
  color: #B6BCC7;
}

.gray-bg-400 {
  background-color: #B6BCC7;
}

.green-bg-700 {
  background-color: #00AF9A;
}

.gray-bg-600 {
  background-color: #838C9E;
}

.gray-bg-200 {
  background-color: #E0E2E7;
}

.neutral-bg-200 {
  background-color: #E9E9EB;
}

.blue-bg-700-b {
  background-color: #230871;
}

.blue-bg-700 {
  background-color: #230871;
}

.blue-bg- {
  background-color: #442D86;
}

.gray-bg-900 {
  background-color: #404B61;
}

.blue-bg-50 {
  background-color: #F4F3F8;
}

.neutral-bg-100 {
  background: #F5F4F5;
}

.blue-bg-50 {
  background-color: #F4F3F8;
}

.blue-bg-100 {
  background-color: #E9E6F1 !important;
}

input[type=checkbox] {
  accent-color: #230871 !important;
}

input[type=radio] {
  accent-color: #230871 !important;
}

/*
 input[type=checkbox]:before {
     content: "";
     display: block;
     width: 24px;
     height: 24px;
     border-radius: 4px;
}
 input[type=checkbox]:checked:before {
     content:"";
     display: block;
     width:24x;
     height:24px;
     border-radius:4px;
     background-color:#230871;
}
 input[type=checkbox]:checked:after {
     content:"";
     display:block;
     width:7px;
     height:14px;
     border:solid white;
     border-width:0 3px 3px 0;
     transform:rotate(45deg);
     bottom:21px;
     left:8px;
     position:relative;
}

$color1: #442D86;
$color2: #f4f4f4;



.radio {
  margin: 0.5rem;
  input[type="radio"] {
    position: absolute;
    opacity: 0;
    + .radio-label {
      &:before {
        content: '';
        background: $color2;
        border-radius: 100%;
        border: 1px solid darken($color2, 25%);
        display: inline-block;
        width: 1.4em;
        height: 1.4em;
        position: relative;
        top: -0.2em;
        margin-right: 1em; 
        vertical-align: top;
        cursor: pointer;
        text-align: center;
        transition: all 250ms ease;
      }
    }
    &:checked {
      + .radio-label {
        &:before {
          background-color: $color2;
          box-shadow: inset 0 0 0 7px $color1;
        }
      }
    }
    &:focus {
      + .radio-label {
        &:before {
          outline: none;
          border-color: $color2;
        }
      }
    }
    &:disabled {
      + .radio-label {
        &:before {
          box-shadow: inset 0 0 0 4px $color1;
          border-color: darken($color1, 25%);
          background: darken($color1, 25%);
        }
      }
    }
    + .radio-label {
      &:empty {
        &:before {
          margin-right: 0;
        }
      }
    }
  }
}*/