@import '_mixins';
@import '_vars';

:host(.ng-invalid) {
    &.ng-dirty {
        .form-control {
            & {
                border-color: $color-theme-error;
            }

            &:hover,
            &:focus {
                border-color: $color-theme-error-dark;
            }
        }
    }
}

.form-group {
    position: relative;
}

.input-group {
    .form-control {
        &:last-child {
            padding-right: 2rem;
            position: relative;
        }
    }

    .form-date {
        width: 7rem;
    }

    .form-date-only {
        width: 8.5rem;
    }

    .form-time {
        width: 7rem;
    }
}

.btn-clear {
    & {
        @include absolute(auto, 4px, 3px, auto);
    }

    &:focus {
        box-shadow: none;
    }
}