.app-notification-center{position:relative;flex:0 0 auto;z-index:1200}
.app-notification-trigger{position:relative;isolation:isolate;width:44px;height:44px;flex:0 0 44px;display:grid;place-items:center;overflow:visible;border:0;border-radius:13px;background:rgba(255,255,255,.14);color:#fff;font-size:20px}
.app-notification-trigger:hover,.app-notification-trigger[aria-expanded=true]{background:rgba(255,255,255,.24)}
.app-notification-trigger>i{line-height:1}
.app-notification-copy{display:none}
.app-notification-trigger>[data-notification-badge]{position:absolute;inset-block-start:-6px;inset-inline-start:-6px;z-index:2;min-width:21px;height:21px;padding-inline:5px;display:inline-flex;align-items:center;justify-content:center;border:2px solid #0b4f94;border-radius:999px;background:#e9362b;color:#fff;box-shadow:0 2px 7px rgba(86,15,11,.28);font-size:10px;font-weight:900;line-height:1;white-space:nowrap}
.app-notification-trigger>[data-notification-badge][hidden]{display:none}
.app-notification-panel{position:absolute;inset-block-start:calc(100% + 12px);inset-inline-start:0;width:min(410px,calc(100vw - 28px));overflow:hidden;border:1px solid #cbd8e8;border-radius:20px;background:#fff;color:#17233a;box-shadow:0 25px 70px rgba(6,26,60,.28);direction:rtl;text-align:right}
.app-notification-panel[hidden]{display:none}
.app-notification-panel>header{display:flex;align-items:center;justify-content:space-between;gap:18px;padding:18px 20px;background:linear-gradient(120deg,#07346f,#0d64d7);color:#fff}
.app-notification-panel>header div{display:grid}
.app-notification-panel>header strong{color:#fff!important;font-size:13px;font-weight:900}
.app-notification-panel>header small{margin-top:4px;color:#d8e8ff!important;font-size:10px}
.app-notification-panel>header button{flex:0 0 auto;min-height:34px;padding:0 12px;border:1px solid rgba(255,255,255,.42);border-radius:9px;background:rgba(255,255,255,.12);color:#fff;font-size:10px;font-weight:850}
.app-notification-panel>header button:hover{background:#fff;color:#0b4f9c}
.app-notification-list{max-height:430px;overflow-y:auto;background:#fff}
.app-notification-item{display:grid;grid-template-columns:42px minmax(0,1fr);gap:12px;padding:15px 17px;border-bottom:1px solid #dfe6ef;background:#fff;color:#17233a!important;text-decoration:none}
.app-notification-item:hover{background:#f4f7fb}
.app-notification-item.unread{border-inline-start:4px solid #1768d8;background:#eaf3ff}
.app-notification-item>i{width:40px;height:40px;display:grid;place-items:center;border-radius:12px;background:#dceaff;color:#0759c7;font-size:16px}
.app-notification-item strong,.app-notification-item small,.app-notification-item time{display:block}
.app-notification-item strong{color:#0d1f38!important;font-size:12px;font-weight:900}
.app-notification-item small{margin-top:5px;color:#42536b!important;font-size:10px;line-height:1.75}
.app-notification-item time{margin-top:6px;color:#687991!important;font-size:9px;font-weight:650}
.app-notification-empty{padding:55px 20px;background:#fff;color:#52647b;text-align:center}
.app-notification-panel>footer{padding:11px 16px;border-top:1px solid #dfe6ef;background:#f4f7fb;color:#52647b!important;font-size:9px}
.app-notification-panel>footer i{color:#087a55}
body.dark-mode .app-notification-panel{border-color:#334155;background:#111c2e;color:#e8eef8}
body.dark-mode .app-notification-list,body.dark-mode .app-notification-item,body.dark-mode .app-notification-empty{background:#111c2e}
body.dark-mode .app-notification-item{border-color:#2b3a50;color:#e8eef8!important}
body.dark-mode .app-notification-item:hover{background:#17263b}
body.dark-mode .app-notification-item.unread{background:#142d4e}
body.dark-mode .app-notification-item strong{color:#f8fafc!important}
body.dark-mode .app-notification-item small,body.dark-mode .app-notification-item time,body.dark-mode .app-notification-panel>footer{color:#c5d1e2!important}
body.dark-mode .app-notification-panel>footer{border-color:#2b3a50;background:#0d1727}
@media(max-width:1199.98px){.app-notification-panel{position:fixed;inset-block-start:calc(var(--topbar-height,64px) + 8px);inset-inline:12px;width:auto;max-width:410px;margin-inline-start:auto}}
@media(max-width:767.98px){.app-notification-trigger{width:40px;height:40px;flex-basis:40px;border-radius:11px;font-size:18px}.app-notification-trigger>[data-notification-badge]{inset-block-start:-5px;inset-inline-start:-4px;min-width:19px;height:19px;padding-inline:4px;font-size:9px}.app-notification-panel{inset-block-start:calc(var(--topbar-height,58px) + 8px);inset-inline:8px;max-width:none;margin:0;border-radius:16px}.app-notification-panel>header{padding:15px 16px}.app-notification-list{max-height:calc(100dvh - var(--topbar-height,58px) - 150px)}}
@media(max-width:420px){.app-notification-panel>header small{display:none}.app-notification-panel>header button{padding-inline:9px}.app-notification-item{grid-template-columns:38px minmax(0,1fr);gap:10px;padding:13px}.app-notification-item>i{width:36px;height:36px}}