.important-info {
    align-items: center;
    background-color: var(--rocket-color-red-200);
    color: var(--rocket-color-white-base);
    display: flex;
    min-height: 45px;
    padding-block: 5px;
    position: relative;
    z-index: 3;

    &__wrapper {
        @extend .container;
        @extend .container--xxl;

        align-items: center;
        display: flex;
        justify-content: center;
        text-align: center;
    }

    &__text {
        align-items: center;
        column-gap: 14px;
        display: flex;
        font-size: 0.875rem;
        line-height: 1.2;
        justify-content: center;

        @include breakpoint(xl) {
            column-gap: 20px;
            font-size: 1.125rem;
        }
    }

    &__text-icon {
        display: block;
        flex-shrink: 0;
        width: 20px;

        @include breakpoint(xl) {
            @include size(28px, auto);
        }

        svg {
            @include size(100%, auto);

            display: block;
        }
    }
}