.NotificationButton .rzi {
    color: var(--gray) !important;
    font-size: 1.8rem;
}

.NotificationButton .rz-badge {
    border: none !important;
    color: var(--white) !important;
    box-shadow: none !important; 
}

.OnlineNotificationPopup {
    width: min(390px,100vw) !important;
}

.OnlineNotificationPopup .rz-dialog-content {
    background: #FFFFFF; 
    border-radius: 8px 0px 8px 8px;
    overflow-x: hidden;
}

.OnlineNotificationPopup .card {
    border-radius: 4px;
    border: 1px solid var(--gray-light);
    box-shadow: none;
}

.OnlineNotificationPopup .card-body-text--advanced {
    max-height: 220px;
    overflow-wrap: anywhere;
    text-overflow: ellipsis;
    white-space: pre-wrap;
    overflow: hidden;
    display: -webkit-box;
    -webkit-line-clamp: 5;
    -webkit-box-orient: vertical;
}

.OnlineNotificationPopup .card-body { 
    font-size: 14px;;
}

.OnlineNotificationPopup .card-subtitle--h15em {
    height: 1.5em;
}

.OnlineNotificationPopup .unread {
    border-top-color: var(--red-light);
    border-top-width: 8px;
}