.notifications{

    padding: 10px 15px;
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: column;
    gap: 8px;

    .notification-item{

        background-color: var(--color-white);
        padding: 24px 8px 8px 8px;
        border-radius: 8px;

        position: relative;

        .notification-link{

            display: flex;
            justify-content: center;
            align-items: center;
            gap: 12px;

            .notification-icon{
                font-size: 50px;
            }
    
            .notification-content{

                .notification-content__message{
                    font-size: var(--font-size-sm); /* 1.4rem */
                    font-weight: var(--font-weight-bold);
                    line-height: 1.4;
                    color: var(--color-grey-dark);
                }

                .notification-content__time{
                    font-size: var(--font-size-sm); /* 1.4rem */
                    font-weight: var(--font-weight-light);
                    line-height: 1.2;
                    color: var(--color-grey-light);

                }
    
            }
    
            .notification-actions{
    
            }
        }

        .notification__new_indicatior{
            position: absolute;
            top: 5px;
            right: 10px;
            font-size: 10px;
            padding: 2px 4px;
            border-radius: 5px;
            color: var(--danger);
            background-color: #e57a7740;
            font-weight: 600;
        }
    }
}