@use '../abstracts' as *;

/**
 * Notice Component
 * Info/warning/error notices
 */

.presszone-comments-notice {
    display: flex;
    align-items: center;
    gap: $presszone-comments-spacing-md;
    padding: $presszone-comments-spacing-lg;
    border-radius: $presszone-comments-radius-md;
    margin-bottom: $presszone-comments-spacing-xl;
    font-size: $presszone-comments-font-size-sm;
    line-height: 1.5;

    svg {
        flex-shrink: 0;
        opacity: 0.8;
    }

    &--info {
        background-color: $presszone-comments-notice-info-bg;
        border: $presszone-comments-border-width solid $presszone-comments-notice-info-border;
        color: $presszone-comments-accent;
    }

    &--warning {
        background-color: $presszone-comments-notice-warning-bg;
        border: $presszone-comments-border-width solid $presszone-comments-notice-warning-border;
        color: $presszone-comments-warning;
    }

    &--error {
        background-color: $presszone-comments-notice-error-bg;
        border: $presszone-comments-border-width solid $presszone-comments-notice-error-border;
        color: $presszone-comments-error;
    }
}