.notification-holder{z-index:200;flex-direction:column;align-items:flex-end;gap:10px;width:fit-content;transition:all .4s;display:flex;position:fixed;top:50px;right:12px}body.ar .notification-holder{right:unset;left:12px}.notification{opacity:0;border-radius:10px;align-items:center;gap:14px;width:fit-content;padding:18px;transition:all .7s cubic-bezier(.68,-.55,.27,1.55);display:flex;overflow:hidden;transform:translate(100%)scale(.8)}.notification span.before{background-color:var(--title-color);border-radius:6px;width:8px;height:0;position:absolute;bottom:0;right:0}body.ar .notification span.before{right:unset;left:0}.notification.active span.before{animation:10s forwards whenNotficationIsAction}@keyframes whenNotficationIsAction{0%{height:0%}to{height:100%}}.notification.closing span.before{animation:10s forwards whenNotficationIsHide}@keyframes whenNotficationIsHide{0%{height:100%}to{height:0%}}.notification.closing{opacity:0;transform:translate(100%)scale(.8)}.notification.active{opacity:1;transform:translate(0%)scale(1)}.notification .icon-holder{min-width:43px;height:43px;display:flex;position:relative;scale:1.25}.notification .icon-holder .backSvg{color:#c81912;width:100%;height:100%;transform:translateY(3px)}.notification .icon-holder svg:not(.backSvg){color:#fff;width:60%;height:60%;position:absolute;top:46%;left:50%;transform:translate(-50%,-50%)}.notification .content{flex-direction:column;gap:4px;display:flex}.notification .content h4{color:#fff;font-size:20px;font-weight:500}.notification p{color:#fff;max-width:354px;font-size:15px}.notification .close{color:#fff;background:0 0;align-self:flex-start;width:25px;height:25px;padding:3px}.notification .close:hover{color:#fff}@media (max-width:786px){.notification-holder{gap:5px;top:20px}.notification{gap:8px;padding:15px 12px;top:60px;right:5px}.notification .icon-holder{min-width:37px;max-width:38px;min-height:37px;max-height:38px;scale:unset}.notification .text h4{font-size:19px}.notification p{font-size:14px}}