.notification-control{position:relative;flex:0 0 auto}.notification-button{position:relative;display:grid;place-items:center;width:46px;height:46px;padding:0;border:1px solid #ded6eb;border-radius:14px;background:#fff;color:#5c4990;box-shadow:0 8px 22px #3d2f6d12;cursor:pointer;transition:transform .18s,background .18s}.notification-button:hover,.notification-button[aria-expanded=true]{transform:translateY(-2px);background:#f3effd}.notification-button svg{width:21px;height:21px}.notification-count{position:absolute;right:-5px;top:-6px;display:grid;place-items:center;min-width:20px;height:20px;padding:0 5px;border:2px solid #fff;border-radius:20px;background:#e34876;color:#fff;font-size:10px;font-weight:800}.notification-panel{position:absolute;right:-70px;top:56px;z-index:170;width:min(390px,calc(100vw - 24px));border:1px solid #e3dced;border-radius:20px;background:#fff;box-shadow:0 24px 70px #29203e35;overflow:hidden}.notification-panel>header{display:flex;align-items:center;justify-content:space-between;padding:18px 19px 14px;border-bottom:1px solid #eee8f3;background:linear-gradient(125deg,#f5f1ff,#fff5ee)}.notification-panel h2{margin:2px 0 0;font-size:21px}.notification-panel header small{font-size:9px;font-weight:800;letter-spacing:1.2px;color:#8a75ad}.notification-panel header button{border:0;background:transparent;color:#6d617c;font-size:25px;cursor:pointer}.notification-latest{max-height:430px;overflow:auto;padding:7px}.notification-latest.is-loading{opacity:.55}.notification-item{display:grid;grid-template-columns:12px minmax(0,1fr) auto;gap:10px;align-items:start;padding:13px 11px;border-radius:12px}.notification-item:hover{background:#faf8fd}.notification-item>i{width:9px;height:9px;margin-top:5px;border-radius:50%;background:#c7bdcf}.notification-item.is-unread>i{background:#7253c4;box-shadow:0 0 0 4px #eee8fc}.notification-item strong{display:block;color:#3d3152;font-size:13px}.notification-item p{margin:3px 0;color:#706779;font-size:12px;line-height:1.4}.notification-item small{color:#a092ab;font-size:10px}.notification-open-item{align-self:center;padding:6px 8px;border:0;border-radius:8px;background:#eee9fa;color:#654ba9;font-size:10px;font-weight:800;cursor:pointer}.notification-panel>footer{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:13px 17px;border-top:1px solid #eee8f3;background:#fcfbfd}.notification-panel>footer a,.notification-panel>footer button{font-size:11px;font-weight:750;color:#6147a7}.notification-empty{padding:25px;text-align:center;color:#8d8299}.notifications-page{width:min(1100px,calc(100% - 36px));margin:0 auto;padding:38px 0 75px}.dashboard-page .notifications-page{width:auto;max-width:1200px;padding:35px 38px}.notifications-heading{display:flex;align-items:end;justify-content:space-between;gap:20px;margin-bottom:25px}.notifications-heading span,.notification-page-item span{font-size:10px;font-weight:800;letter-spacing:1px;color:#8d7aa7}.notifications-heading h1{margin:5px 0;font-size:36px}.notifications-heading p{margin:0;color:#7b7286}.notification-page-list{display:grid;gap:11px}.notification-page-item{display:grid;grid-template-columns:46px minmax(0,1fr) auto;gap:16px;align-items:center;padding:18px;border:1px solid #e7e0ef;border-radius:16px;background:#fff;transition:transform .16s,box-shadow .16s}.notification-page-item:hover{transform:translateY(-2px);box-shadow:0 12px 30px #41325e14}.notification-page-item.is-unread{border-left:4px solid #7253c4;background:linear-gradient(100deg,#f8f5ff,#fff 30%)}.notification-page-item>i{display:grid;place-items:center;width:44px;height:44px;border-radius:13px;background:#eee9fa;color:#684db0;font-style:normal}.notification-page-item h2{margin:3px 0;font-size:17px}.notification-page-item p{margin:0;color:#756b80;font-size:13px}.notification-page-item form{margin:0}@media(max-width:760px){.notification-button{width:42px;height:42px;border-radius:12px}.notification-panel{position:fixed;left:12px;right:12px;top:78px;width:auto}.notification-latest{max-height:60vh}.notifications-page,.dashboard-page .notifications-page{width:auto;padding:25px 18px 80px}.notifications-heading{align-items:start;flex-direction:column}.notifications-heading h1{font-size:30px}.notification-page-item{grid-template-columns:40px minmax(0,1fr);padding:15px}.notification-page-item>i{width:38px;height:38px}.notification-page-item form{grid-column:2}.dashboard-topbar .notification-panel{top:75px}}
