@import '../../app.vars';

.controls {
    margin-bottom: $med-v-pad;
    padding-top: $med-v-pad;
    overflow: auto;

    &.bordered {
        border-bottom: 1px solid $bdr-color-med;
    }

    .control-group {
        display: flex;
        justify-content: space-between;
        overflow: hidden;
        padding-bottom: $med-v-pad;

        &:last-child {
            border-bottom: 0;
            margin-bottom: 0;
        }

        .control {
            padding: 0;
        }

        .control-left {
            margin-left: $med-h-pad;

            .label {
                padding-left: $small-h-pad;
            }
        }

        .control-right {
            margin-right: $med-h-pad;

            .label {
                padding-right: $small-h-pad;
            }
        }
    }
}

// > sm

@media screen and (min-width: $breakpoint-xs) {

    .controls {
        margin-bottom: $big-v-pad;
        margin-top: 0;

        .control-group .control {
            margin: 0;
            padding: 0 $small-h-pad;

            &:nth-child(3n) {
                clear: both;
            }

            .label {
                display: none;
            }
        }
    }
}

@import '../../app.vars';

.controls {
    margin-bottom: $med-v-pad;
    overflow: auto;
    padding-top: $med-v-pad;

    &.bordered {
        border-bottom: 1px solid $bdr-color-med;
    }

    .control-group {
        display: flex;
        justify-content: space-between;
        overflow: hidden;
        padding-bottom: $med-v-pad;

        &:last-child {
            border-bottom: 0;
            margin-bottom: 0;
        }

        .control {
            padding: 0;
        }

        .control-left {
            margin-left: $med-h-pad;

            .label {
                padding-left: $small-h-pad;
            }
        }

        .control-right {
            margin-right: $med-h-pad;

            .label {
                padding-right: $small-h-pad;
            }
        }
    }
}

// > sm

@media screen and (min-width: $breakpoint-xs) {

    .controls {
        margin-bottom: $big-v-pad;
        margin-top: 0;

        .control-group .control {
            margin: 0;
            padding: 0 $small-h-pad;

            &:nth-child(3n) {
                clear: both;
            }

            .label {
                display: none;
            }
        }
    }
}

Clean styles acording to linting.
Clean styles acording to linting.
