@import "commons";

.m-typeahead {
    @include m-input-inline-spacing();

    &__label-popup {
        margin: 0;
        padding: $m-space-xs $m-space;
        @include m-font-size('sm');
        font-weight: $m-font-weight-semi-bold;
        color: $m-color-white;
        background: $m-color-interactive;
    }

    &__research-popup {
        display: flex;
        align-items: center;
        width: 100%;
        background: $m-color-grey-lightest;
    }

    &__research-input-popup {
        width: 100%;
        @include m-font-size();
        font-weight: $m-font-weight-light;
        border: none;
        outline: none;
        background: none;
        padding: $m-space 0 $m-space $m-space;
    }

    &__research-button-popup {
        stroke-width: 2px;
    }

    &__mobile-spinner {
        display: flex;
        align-items: center;
        justify-content: center;
        padding: $m-space-xl $m-space;
    }

    &__validation-message {
        transition: margin-top $m-transition-duration ease;

        &.m--has-validation-message {
            margin-top: $m-space-2xs;
        }
    }
}