.header-notification-actions{display:flex;align-items:center;gap:18px}.notification-bell{position:relative;display:grid;place-items:center;width:38px;height:38px;border:1px solid #e0e7f0;border-radius:11px;background:#fff;text-decoration:none;font-size:17px}.notification-bell b{position:absolute;right:-7px;top:-7px;min-width:19px;height:19px;padding:0 4px;border-radius:20px;background:#d94152;color:#fff;font-size:9px;line-height:19px;text-align:center}
.notification-hero{display:flex;justify-content:space-between;align-items:center;gap:18px;background:linear-gradient(125deg,#172744,#295786 65%,#168176);color:#fff}.notification-hero>div>span{font-size:9px;letter-spacing:.11em}.notification-hero h2{margin:7px 0;color:#fff}.notification-hero p{margin:0;color:#e6effa}.notification-hero>strong{display:grid;place-items:center;padding:12px 18px;border-radius:10px;background:#ffffff1c;font-size:29px}.notification-hero>strong small{font-size:10px;font-weight:500}
.notification-toolbar{display:flex;flex-wrap:wrap;gap:10px;margin:18px 0}.notification-toolbar form{margin:0}.notification-list{padding:0;overflow:hidden}.notification-item{display:grid;grid-template-columns:128px minmax(0,1fr) auto;gap:17px;align-items:center;padding:16px 19px;border-bottom:1px solid #e9edf4}.notification-item:last-child{border-bottom:0}.notification-item.is-unread{background:#f5f9ff}.notification-item.is-read{opacity:.78}.notification-category{justify-self:start;padding:5px 8px;border-radius:20px;background:#eaf0ff;color:#315fb3;font-size:9px;font-weight:650}.notification-category.payment,.notification-category.balance{background:#fff2dc;color:#945a0b}.notification-category.site{background:#e3f6ee;color:#187450}.notification-category.campaign{background:#efe8fc;color:#7046aa}.notification-content h3{margin:0 0 5px;font-size:13px}.notification-content p{margin:0 0 6px;color:#425169;font-size:11px;line-height:1.55}.notification-content small{color:#748094;font-size:9px}.notification-actions{display:flex;gap:7px;align-items:center}.notification-actions form{margin:0}.notification-empty{padding:38px;text-align:center;color:#778294}.notification-settings{max-width:780px;margin-top:18px}.notification-settings form{display:grid;gap:10px}.notification-settings p{color:#687589;font-size:11px;line-height:1.55}.notification-preference-card{margin-top:15px}
@media(max-width:800px){.notification-item{grid-template-columns:1fr;gap:9px}.notification-actions{justify-content:flex-start}.notification-hero{align-items:flex-start;flex-direction:column}.header-notification-actions{gap:9px}}