.message {
    --rocket-ui-message-background-color: var(--rocket-color-info-100);

    $rte-message-before-icon-color: #0354A6;

    position: relative;
    margin: 1.5rem 0;
    padding: .75rem 1.25rem;
    background: var(--rocket-ui-message-background-color);
    border-radius: .25rem;

    @include layout-stack;

    &::before {
        @include size(1.5rem);

        position: absolute;
        left: 1.25rem;
        display: block;
    }

    > *:first-child {
        color: var(--rocket-color-grey-700);
        font-weight: 600;
        font-size: 1rem;
        line-height: 1.5;
    }

    a {
        color: inherit;
    }

    &--icon {
        padding: .75rem 1.25rem .75rem 3.5rem;

        &::before {
            background-image: inline-svg('<svg xmlns="http://www.w3.org/2000/svg" height="24" viewBox="0 96 960 960" width="24"><path d="M453 776h60V536h-60v240Zm26.982-314q14.018 0 23.518-9.2T513 430q0-14.45-9.482-24.225-9.483-9.775-23.5-9.775-14.018 0-23.518 9.775T447 430q0 13.6 9.482 22.8 9.483 9.2 23.5 9.2Zm.284 514q-82.734 0-155.5-31.5t-127.266-86q-54.5-54.5-86-127.341Q80 658.319 80 575.5q0-82.819 31.5-155.659Q143 347 197.5 293t127.341-85.5Q397.681 176 480.5 176q82.819 0 155.659 31.5Q709 239 763 293t85.5 127Q880 493 880 575.734q0 82.734-31.5 155.5T763 858.316q-54 54.316-127 86Q563 976 480.266 976Zm.234-60Q622 916 721 816.5t99-241Q820 434 721.188 335 622.375 236 480 236q-141 0-240.5 98.812Q140 433.625 140 576q0 141 99.5 240.5t241 99.5Zm-.5-340Z" fill="#{$rte-message-before-icon-color}"/></svg>');
            content: '';
        }
    }

    &--notice {
        --rocket-ui-message-background-color: var(--rocket-color-grey-200);
    }

    &--notice-icon {
        $rte-message-before-icon-color: #667085;

        @extend .message--notice;
        @extend .message--icon;

        &::before {
            background-image: inline-svg('<svg xmlns="http://www.w3.org/2000/svg" height="24" viewBox="0 96 960 960" width="24"><path d="M480 976q-27 0-47.5-13T406 927h-14q-24 0-42-18t-18-42V724q-66-43-104-110t-38-148q0-121 84.5-205.5T480 176q121 0 205.5 84.5T770 466q0 81-38 148T628 724v143q0 24-18 42t-42 18h-14q-6 23-26.5 36T480 976Zm-88-109h176v-44H392v44Zm0-84h176v-40H392v40Zm-9-100h74V546l-77-77q-6-6-6-15t7-16q7-7 15.727-7 8.728 0 15.273 7l68 69 69-69q6-6 15-6t16 7q7 7 7 15t-7 15l-77 77v137h74q60-28 96.5-87T710 466q0-97-66.5-163.5T480 236q-97 0-163.5 66.5T250 466q0 71 36.5 130t96.5 87Zm97-176Zm0-48Z" fill="#{$rte-message-before-icon-color}"/></svg>');
        }
    }

    &--error {
        --rocket-ui-message-background-color: var(--rocket-color-error-100);
    }

    &--error-icon {
        $rte-message-before-icon-color: #912018;

        @extend .message--error;
        @extend .message--icon;

        &::before {
            background-image: inline-svg('<svg xmlns="http://www.w3.org/2000/svg" height="24" viewBox="0 96 960 960" width="24"><path d="m330 768 150-150 150 150 42-42-150-150 150-150-42-42-150 150-150-150-42 42 150 150-150 150 42 42Zm150 208q-82 0-155-31.5t-127.5-86Q143 804 111.5 731T80 576q0-83 31.5-156t86-127Q252 239 325 207.5T480 176q83 0 156 31.5T763 293q54 54 85.5 127T880 576q0 82-31.5 155T763 858.5q-54 54.5-127 86T480 976Zm0-60q142 0 241-99.5T820 576q0-142-99-241t-241-99q-141 0-240.5 99T140 576q0 141 99.5 240.5T480 916Zm0-340Z" fill="#{$rte-message-before-icon-color}"/></svg>');
        }
    }

    &--success {
        --rocket-ui-message-background-color: var(--rocket-color-success-100);
    }

    &--success-icon {
        $rte-message-before-icon-color: #039855;

        @extend .message--success;
        @extend .message--icon;

        &::before {
            background-image: inline-svg('<svg xmlns="http://www.w3.org/2000/svg" height="24" viewBox="0 96 960 960" width="24"><path d="m421 758 283-283-46-45-237 237-120-120-45 45 165 166Zm59 218q-82 0-155-31.5t-127.5-86Q143 804 111.5 731T80 576q0-83 31.5-156t86-127Q252 239 325 207.5T480 176q83 0 156 31.5T763 293q54 54 85.5 127T880 576q0 82-31.5 155T763 858.5q-54 54.5-127 86T480 976Zm0-60q142 0 241-99.5T820 576q0-142-99-241t-241-99q-141 0-240.5 99T140 576q0 141 99.5 240.5T480 916Zm0-340Z" fill="#{$rte-message-before-icon-color}"/></svg>');
        }
    }

    &--warning {
        --rocket-ui-message-background-color: var(--rocket-color-warning-100);
    }

    &--warning-icon {
        $rte-message-before-icon-color: #DC6803;

        @extend .message--warning;
        @extend .message--icon;

        &::before {
            background-image: inline-svg('<svg xmlns="http://www.w3.org/2000/svg" height="24" viewBox="0 96 960 960" width="24"><path d="m40 936 440-760 440 760H40Zm104-60h672L480 296 144 876Zm340.175-57q12.825 0 21.325-8.675 8.5-8.676 8.5-21.5 0-12.825-8.675-21.325-8.676-8.5-21.5-8.5-12.825 0-21.325 8.675-8.5 8.676-8.5 21.5 0 12.825 8.675 21.325 8.676 8.5 21.5 8.5ZM454 708h60V484h-60v224Zm26-122Z" fill="#{$rte-message-before-icon-color}"/></svg>');
        }
    }
}