.checkbox {
  display: inline-flex;
}

.checkbox-mark {
  background-color: transparent;
  border-radius: 3px;
  border: 1px solid var(--gray-300);
  cursor: pointer;
  flex-shrink: 0;
  height: 14px;
  margin-left: 6px;
  position: relative;
  top: 3px;
  transition: background-color 0.2s;
  width: 14px;
}

.checkbox-mark::before {
  background-image: url("data:image/svg+xml,%3Csvg width='9' height='8' viewBox='0 0 9 8' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M8.34936 1.07545C8.30196 0.990716 8.23828 0.916176 8.16198 0.856114C8.00898 0.735457 7.81443 0.680273 7.62086 0.702622C7.42729 0.724972 7.25044 0.823037 7.12895 0.975386L3.48181 5.57571C3.44174 5.62674 3.38322 5.65998 3.31888 5.66827C3.25453 5.67657 3.1895 5.65926 3.1378 5.62007L1.74794 4.54663C1.59265 4.42689 1.39616 4.37375 1.20169 4.39889C1.00722 4.42403 0.830703 4.5254 0.710969 4.68069C0.591235 4.83597 0.538093 5.03247 0.563234 5.22694C0.588374 5.42141 0.689738 5.59792 0.845026 5.71766L2.6065 7.07696C2.74041 7.18446 2.89533 7.26277 3.06131 7.30684C3.22729 7.35091 3.40065 7.35976 3.57025 7.33284C3.73986 7.30592 3.90195 7.24382 4.04612 7.15052C4.1903 7.05722 4.31336 6.93479 4.4074 6.7911L8.28323 1.89407C8.34362 1.81804 8.38841 1.73083 8.41501 1.63745C8.44161 1.54407 8.44951 1.44635 8.43824 1.3499C8.42698 1.25346 8.39677 1.16019 8.34936 1.07545Z' fill='white'/%3E%3C/svg%3E%0A");
  content: none;
  height: 8px;
  left: 50%;
  position: absolute;
  top: 50%;
  transform: translate(-50%, -50%);
  width: 9px;
}

.checkbox input {
  display: none;
}

.checkbox input:checked ~ span::before {
  content: "";
}

.checkbox input:checked ~ .checkbox-mark {
  background-color: var(--primary);
  border-color: var(--primary);
}


/*  */
/* Custom Styles - Danny */
/*  */


.checkbox [class^=checkbox-] {
  width: 14px !important;
  height: 14px !important;
}