.project-values-row {
    @include table-flex(stretch, center, flex, row, wrap, center);
    border-bottom: 1px solid $whitish;
    &:hover {
        @include transition (background .2s ease-in);
        background: lighten($green-taiga, 60%);
        cursor: move;
        .icon {
            @include transition (opacity .2s ease-in);
            opacity: 1;
        }
    }

    .icon {
        @extend %large;
        color: $gray-light;
        opacity: 0;
        &:hover {
            @include transition (all .2s ease-in);
            color: $grayer;
        }
    }
}

.project-values-header {
    @extend %bold;
    border-bottom: 2px solid $gray-light;
}

.project-values-name,
.project-values-isclosed,
.project-values-settings {
    padding: 1rem;
}

.project-values-name {
    @include table-flex-child(3, 0, 0);
}

.project-values-isclosed,
.project-values-settings {
    @include table-flex-child(1, 0, 0);
    text-align: right;
}

.project-values-settings {
    a {
        @extend %large;
        color: $gray;
        margin-right: .5rem;
        &:hover {
            @include transition(color .3s linear);
            color: $green-taiga;
            &.icon-delete {
                color: $red;
            }
        }
    }
}
