.NotificationPanelMainDiv{transition:all .5s;position:relative}.BodyNotification{z-index:-10;width:100%;height:0%;transition:all .3s;transition-delay:height .3s;background-color:#00000081;position:fixed;top:60px;left:0}.BodyNotification.show{height:100%}.dot{aspect-ratio:1;color:#fff;background-color:red;border-radius:50%;place-content:center;min-height:15px;padding:4px;font-size:13px;transition:all .1s;display:grid;position:absolute;bottom:12px;left:15px;transform:scale(0)}.dot.show{transform:scale(1)}.NotificationPanel{z-index:1;opacity:0;background-color:#fff;border:1px solid #ddd8ff;border-radius:20px;width:100%;max-width:360px;height:auto;padding:10px 15px;transition:all .3s;position:fixed;top:80px;right:-120%;box-shadow:1px 1px 4px 1px #2d2d2d19}.NotificationPanel.show{opacity:1;right:20px}.notifivationBtn{aspect-ratio:1;width:24px;height:24px}.NotificationPanel .notifyDatas{opacity:0;max-height:0;transition:max-height .5s;overflow-y:auto}.NotificationPanel.show .notifyDatas{opacity:1;max-height:70vh}.NotificationPanel .notifyMain-title{justify-content:space-between;display:flex}.NotificationPanel .notifyDatas .notificationDivs{border-bottom:1px solid #c5c4c4;border-radius:10px;gap:5px;margin-top:10px;padding:10px 5px;display:grid}.NotificationPanel .notifyDatas .notificationDivs:hover{background-color:#3636360a}.notifyDatas .notificationDivs .n-title,.n-created{font-weight:550}.notifyDatas .notificationDivs .n-desc,.n-created{color:gray;font-size:13px}.notifyDatas .notificationDivs .n-links-array{justify-content:end;align-items:center;margin-top:10px;display:flex}.notifyDatas .notificationDivs .n-links{background-color:var(--primaryBtn);color:var(--primaryBtnColor);border-radius:10px;padding:4px 10px;font-size:13px}@media (max-width:476px){.NotificationPanel{max-width:unset;box-shadow:unset;border:unset;border-radius:0 0 10px 10px;top:55px}.notifivationBtn{aspect-ratio:1;stroke-width:2.3px}.NotificationPanel .notifyDatas{height:100%;max-height:80vh}.NotificationPanel.show{opacity:1;right:0}}