@import "~office-ui-fabric-react/dist/sass/Fabric.Common";

.todoListItem {
    border: 1px $ms-color-neutralTertiaryAlt solid;

    .itemTaskRow {
      padding: 16px 20px 8px 20px;

      @media (max-width: 600px) {
        padding: 8px 20px 8px 4px;
      }

      .deleteButton {
        &:hover, &:focus {
          color: $ms-color-themePrimary;
        }
      }

      .checkbox {
        :global .ms-Label {
          color: $ms-color-neutralPrimary;
          font-size: 18px;
          padding: 0 0 0 36px;
        }
      }

      &.isCompleted {
        background-color: $ms-color-neutralLighter;
      }
    }
  }