/* override jGrowl css 樣式 */

.jGrowl {
    font-size: 1rem;
}

.jGrowl-notification {
    opacity: 1;
    padding-right: 30px;
}

    .jGrowl-notification .jGrowl-close {
        position: absolute;
        top: 1px;
        right: 1px;
        font-size: 2rem;
        cursor: pointer;
    }

.jGrowl-closer {
    opacity: 1;
}

/*
    自定義的theme
    取自bootstrap 5.3.8 css 此份檔案需於bootstrap.css後引入
*/
.jGrowl-notification.alert {
    /* bootstrap .alert */
    --bs-alert-bg: transparent;
    --bs-alert-padding-x: 1rem;
    --bs-alert-padding-y: 1rem;
    --bs-alert-margin-bottom: 1rem;
    --bs-alert-color: inherit;
    --bs-alert-border-color: transparent;
    --bs-alert-border: var(--bs-border-width) solid var(--bs-alert-border-color);
    --bs-alert-border-radius: var(--bs-border-radius);
    --bs-alert-link-color: inherit;
    position: relative;
    padding: var(--bs-alert-padding-y) var(--bs-alert-padding-x);
    margin-bottom: var(--bs-alert-margin-bottom);
    color: var(--bs-alert-color);
    background-color: var(--bs-alert-bg);
    border: var(--bs-alert-border);
    border-radius: var(--bs-alert-border-radius);
}

.jGrowl-notification.jg-success {
    /* bootstrap .alert-success */
    --bs-alert-color: var(--bs-success-text-emphasis);
    --bs-alert-bg: var(--bs-success-bg-subtle);
    --bs-alert-border-color: var(--bs-success-border-subtle);
    --bs-alert-link-color: var(--bs-success-text-emphasis);
}

.jGrowl-notification.jg-danger {
    /* bootstrap .alert-danger */
    --bs-alert-color: var(--bs-danger-text-emphasis);
    --bs-alert-bg: var(--bs-danger-bg-subtle);
    --bs-alert-border-color: var(--bs-danger-border-subtle);
    --bs-alert-link-color: var(--bs-danger-text-emphasis);
}

.jGrowl-notification.jg-warning {
    /* bootstrap .alert-warning */
    --bs-alert-color: var(--bs-warning-text-emphasis);
    --bs-alert-bg: var(--bs-warning-bg-subtle);
    --bs-alert-border-color: var(--bs-warning-border-subtle);
    --bs-alert-link-color: var(--bs-warning-text-emphasis);
}

.jGrowl-notification.jg-info {
    /* bootstrap .alert-info */
    --bs-alert-color: var(--bs-info-text-emphasis);
    --bs-alert-bg: var(--bs-info-bg-subtle);
    --bs-alert-border-color: var(--bs-info-border-subtle);
    --bs-alert-link-color: var(--bs-info-text-emphasis);
}
/* End 自定義的theme */