input[type='radio']:after {
  width:14px;
  height:14px;
  border-radius: 15px;
  top: -1.5px;
  left: -0.5px;
  position: relative;
  background-color: var(--c-background-input);
  content: '';
  display: inline-block;
  visibility: visible;
  border: 2px solid var(--kommunfarg);
  cursor: pointer;
}

input[type='radio']:checked:after {
  width:14px;
  height:14px;
  border-radius: 15px;
  top: -1.5px;
  left: -0.5px;
  position: relative;
  background-color: var(--kommunfarg);
  content: '';
  display: inline-block;
  visibility: visible;
  border: 2px solid var(--kommunfarg);
  outline: 2px solid var(--c-background-input); /* Outer border */
  outline-offset: -4px;
}

input[type='checkbox'] {
  z-index: 2;
  width:16px;
  height:16px;
}

input[type='checkbox']:after {
  width:14px;
  height:14px;
  border-radius: 3px;
  top: -1.5px;
  left: -0.5px;
  position: relative;
  background-color: var(--c-background-input);
  content: '';
  display: inline-block;
  visibility: visible;
  border: 2px solid var(--kommunfarg);
}
input[type='checkbox']:checked:after {
  width:14px;
  height:14px;
  border-radius: 3px;
  top: -1.5px;
  left: -0.5px;
  position: relative;
  background-color: var(--kommunfarg);
  content: '';
  display: inline-block;
  visibility: visible;
  border: 2px solid var(--kommunfarg);
  background-image: url("../img/checkmark.svg");
  background-repeat: no-repeat;
  background-position: center;
}

input[type="number"] {
  background: white;
  border: none;
  font-family: var(--kommunfont);
  padding-inline-start: 4px;
  letter-spacing: 0.25px;
  max-width: 50px;
}

button:disabled {
  opacity: 0.75;
}
button:disabled:hover {
  opacity: 0.75;
  cursor: default;
}