.notification-backdrop{z-index:1;position:fixed;inset:0}.notifications-container{border:1px solid var(--color-secondary-400);filter:drop-shadow(0 0 4px #0000000a)drop-shadow(-8px 8px 16px #00000014);background-color:var(--color-secondary-200);z-index:2;width:min(500px,100vw - 40px);max-height:min(550px,100vh - 8rem);color:var(--color-neutral-100);border-radius:10px;flex-direction:column;align-items:flex-start;display:flex;position:relative;overflow:hidden}.notifications-container .notifications-header{border-bottom:1px solid var(--color-secondary-400);flex-direction:row;justify-content:space-between;align-items:center;width:100%;min-height:60px;padding:0 20px;display:flex}.notifications-container .notifications-heading{flex-direction:row;align-items:center;gap:10px;display:flex}.notifications-container .notifications-heading h6{font-size:16px;font-weight:600}.notifications-container .notifications-buttons{flex-direction:row;align-items:center;display:flex}.notifications-container .notifications-buttons .close-icon{cursor:pointer;align-items:center;margin-left:10px;display:flex}.notifications-container .notifications-list{background-color:var(--color-secondary-200);flex-direction:column;flex:auto;align-items:flex-start;width:100%;display:flex;overflow-y:auto}.notifications-container .notification{cursor:pointer;flex-direction:row;align-items:center;gap:10px;width:100%;padding:20px;display:flex}.notifications-container .notification:hover{background-color:var(--color-secondary-300)}.notifications-container .notification-content{flex-direction:column;flex:1;align-items:flex-start;min-width:0;display:flex}.notifications-container .notification-head-container{flex-direction:row;justify-content:space-between;align-items:flex-start;width:100%;display:flex}.notifications-container .notification-heading{overflow-wrap:anywhere;min-width:0;font-size:14px;font-weight:600}.notifications-container .notification-body{color:var(--color-neutral-300);overflow-wrap:anywhere;font-size:14px}.notifications-container .notification-time-ago{color:var(--color-neutral-300);white-space:nowrap;flex-shrink:0;align-self:flex-start;padding-left:8px;font-size:12px;font-weight:500}.notifications-container .notification-empty{place-items:center;width:100%;height:200px;display:grid}.notifications-container .notification-empty p{color:var(--color-neutral-300)}@media screen and (max-width:768px){.notifications-container{width:100%;max-width:350px;margin-left:auto}.notifications-container .notification-empty{height:140px}.notifications-container .notification{gap:0;padding:10px}.notifications-container .notification-heading,.notifications-container .notification-body{font-size:12px}.notifications-container .notification-time-ago{font-size:10px}}
