@keyframes fadeInToast {
    0% { opacity: 0; }
    100% { opacity: 1; }
  }

.dbq-toast {
    animation: fadeInToast 1s;
    position: absolute;
    z-index: 1039; // This is 1 above the DbqPopup z-index
    padding: $global-padding;
    display: flex;
    flex-wrap: wrap;
    gap: $margin-default;
    align-items: center;
    justify-content: center;
    text-align: center;
    border-radius: $global-border-radius;   
    background: $color-layer-0;  
    max-width: 512px;
    box-shadow: $global-box-shadow;

    .dbq-toast-close-button {
        background: transparent;
        display: inline-block;
        color: $text-color-default;
        border: 2px solid $text-color-default;
        border-radius: 15px;   
        padding: 0 10px;

        &:hover {
            color: $color-primary;
            border-color: $color-primary;
        }
    }
}