#ui-webalerts.default{
    position: fixed;
    top: 0;
    right: 0;
    z-index: 1000;
    width: 100%;
    height: 100%;

    display: flex;
    align-items: center;
    justify-content: flex-start;
    flex-direction: column;

    pointer-events: none;

    gap: 1rem;

    padding: 2rem 5%;
}

    /* Default theme for alerts */
    #ui-webalerts.default .alert{
        padding: 0.5rem 1rem;
        background-color: gray;
        min-width: 300px;
        width: 30%;
        border-left: 5px solid #000;
        font-weight: 500;   
        display: flex;
        align-items: center;
        gap: 0.5rem;
        font-size: 1.1rem;
        box-shadow: 0.25rem 0.25rem 1rem rgba(0, 0, 0, 0.3);
        user-select: none;
        backdrop-filter: blur(2px);
        position: relative;
        pointer-events: all;

        pointer-events: auto;
        
    }

        #ui-webalerts.default .alert.alert-success{
            background: #d8edbe;
            border-color: #75964b;
        }

        #ui-webalerts.default .alert.alert-info{
            background: #c7dff0;
            border-color: #6d9ced;
        }

        #ui-webalerts.default .alert.alert-warning{
            background: #ede4c7;
            border-color: #f5be40;
        }

        #ui-webalerts.default .alert.alert-error{
            background: #f2cece;
            border-color: #cc4343;
        }

            #ui-webalerts.default .alert .icon{
                height: 2rem;
                width: 2rem;
            }

            #ui-webalerts.default .alert p{
                flex: 7;
            }

            #ui-webalerts.default .alert .close{
                position: absolute;
                top: 50%;
                right: 0.5rem;
                cursor: pointer;
                transform: translateY(-50%);
                opacity: 0.6;
            }