.option {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 5px 10px;
  width: 100%;
  cursor: default;

  &:hover {
    background-color: var(--inputHoverBackgroundColor);
  }
}

.optionCheck {
  composes: container from '~./CheckInput.css';

  flex: 0 0 0;
}

.optionCheckInput {
  composes: input from '~./CheckInput.css';

  margin-top: 0;
}

.isSelected {
  background-color: var(--inputSelectedBackgroundColor);

  &:hover {
    background-color: var(--inputSelectedBackgroundColor);
  }

  &.isMobile {
    background-color: inherit;

    .iconContainer {
      color: var(--primaryColor);
    }
  }
}

.isDisabled {
  background-color: #aaa;
}

.isHidden {
  display: none;
}

.isMobile {
  height: 50px;
  border-bottom: 1px solid var(--borderColor);

  &:last-child {
    border: none;
  }

  &:hover {
    background-color: unset;
  }
}