~boxes: "../../shared/constants.js";
~colors: "../../shared/constants.js";

:root {
  --border-checked: ~boxes.border.checked;
  --border-unchecked: ~boxes.border.unchecked;
  --border-radius: remcalc(~boxes.borderRadius);
  --bottom-shaddow: ~boxes.bottomShaddow;
}

.group {
  & .item {
    background: #FFFFFF;
    cursor: pointer;
    margin-bottom: remcalc(15);
    padding: remcalc(25);

    @add-mixin create-base-box-properties;

    &:last-child {
      margin-bottom: initial;
    }

    &.checked {
      border: var(--border-checked);
      box-shadow: var(--bottom-shaddow);
    }

    &.disabled {
      cursor: default;
    }
  }
}