@import '_mixins.scss';
@import '_vars.scss';

.form-hint {
    font-size: 0.8rem;
}

.form-error {
    @include border-radius(3px);
    @include truncate();
    color: white;
    margin-top: 4px;
    margin-bottom: 10px;
    padding: 6px;
    background: $accent-error;
}

.ng-invalid.ng-dirty {
    border-color: $accent-error;
}

.ng-invalid.ng-dirty :focus, .ng-invalid.ng-dirty :hover {
    border-color: $accent-error-dark;
}

.errors {
    &-box {
        position: relative;
    }

    &:after {
        @include absolute(2rem, auto, auto, 0.6rem);
        content: '';
        height: 0;
        border-style: solid;
        border-width: 0.4rem;
        border-color: $accent-error transparent transparent transparent;
        width: 0;
    }

    & {
        @include absolute(-2.4rem, 0px, auto, 0px);
        @include border-radius(2px);
        color: white;
        cursor: none;
        font-size: 0.9rem;
        font-weight: normal;
        line-height: 2rem;
        padding: 0 0.4rem;
        background: $accent-error;
    }
}

.modal-content, .dropdown-menu {
    @include box-shadow(0px, 6px, 16px, 0.2px);
}

.modal-content, .modal-header {
    border: 0;
}

.dropdown-menu {
    border: 0;
}