/* Shared inbox, account badge and admin composer. */
.notification-bell { position:relative; display:inline-flex; align-items:center; justify-content:center; flex:none; width:44px; height:44px; border:1px solid var(--line2); border-radius:50%; background:var(--surface); color:var(--text2); }
.notification-bell:hover { color:var(--accent); background:var(--accent-dim); }
.notification-count { position:absolute; top:-4px; right:-5px; min-width:18px; height:18px; padding:0 4px; display:grid; place-items:center; border:2px solid var(--bg); border-radius:999px; background:var(--accent); color:var(--bg); font-size:10px; font-weight:700; line-height:1; }
.notification-count[hidden],.notification-preview[hidden],#notification-preview-action[hidden] { display:none; }
.notification-bell--menu { width:auto; border:0; border-radius:8px; justify-content:flex-start; gap:10px; background:transparent; }
.notification-bell--menu .notification-count { position:static; margin-left:auto; }
.inbox-page { max-width:860px; margin-inline:auto; }
.notification-page-head { display:flex; justify-content:space-between; align-items:center; flex-wrap:wrap; gap:16px; margin-bottom:24px; }
.notification-tabs { display:flex; gap:6px; margin-bottom:24px; border-bottom:1px solid var(--line2); }
.notification-tabs a { padding:12px 18px; min-height:44px; color:var(--text2); border-bottom:2px solid transparent; }
.notification-tabs a[aria-current] { border-color:var(--accent); color:var(--accent); }
.notification-tabs span { font-size:12px; margin-left:6px; }
.notification-card { border:1px solid var(--line2); background:var(--surface); border-radius:12px; padding:24px; margin-bottom:14px; min-width:0; }
.notification-card.is-unread { border-left:3px solid var(--accent); }
.notification-card-meta { display:flex; gap:8px 16px; align-items:center; flex-wrap:wrap; color:var(--text2); font-size:12px; margin-bottom:12px; }
.notification-new { border-radius:99px; background:var(--accent-dim); color:var(--accent); padding:2px 8px; }
.notification-message { white-space:pre-wrap; overflow-wrap:anywhere; margin:12px 0 20px; line-height:1.75; }
.notification-card-actions { display:flex; align-items:center; flex-wrap:wrap; gap:12px; }
.notification-text-button { background:none; color:var(--accent); border:0; min-height:44px; padding:8px 4px; cursor:pointer; font-size:13px; }
.notification-text-button:hover { text-decoration:underline; text-underline-offset:3px; }
.notification-feedback { margin:12px 0; color:var(--text2); overflow-wrap:anywhere; }
.notification-feedback:empty { display:none; }
.notification-stats { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:16px; margin-bottom:24px; }
.notification-stats .panel { margin:0; padding:20px; }
.notification-stats strong { display:block; font-size:28px; font-weight:650; margin-top:6px; font-variant-numeric:tabular-nums; }
.notification-admin-grid { display:grid; grid-template-columns:minmax(0,1fr); align-items:start; gap:24px; }
.notification-admin-grid > .panel { margin-top:0; }
.notification-admin-grid:has(.notification-preview:not([hidden])) { grid-template-columns:minmax(0,1.3fr) minmax(0,1fr); }
.notification-form { display:grid; gap:20px; }
.notification-form fieldset { min-width:0; }
.notification-audience { border:1px solid var(--line2); padding:18px; border-radius:10px; }
.notification-audience legend { padding-inline:8px; font-weight:600; }
.notification-selected { border:0; margin:12px 0; padding:0; }
.notification-selected legend { position:absolute; width:1px; height:1px; overflow:hidden; clip-path:inset(50%); }
.notification-selected:disabled { opacity:.45; }
.notification-chips { display:flex; flex-wrap:wrap; gap:8px; margin:8px 0; }
.notification-check { display:inline-flex; align-items:center; gap:7px; border:1px solid var(--line2); padding:8px 11px; border-radius:999px; min-height:40px; font-size:12px; cursor:pointer; margin:0; }
.notification-check:has(input:checked) { background:var(--accent-dim); color:var(--accent); border-color:var(--accent); }
.notification-check input { accent-color:var(--accent); }
.notification-user-chip { display:inline-flex; gap:8px; align-items:center; background:var(--accent-dim); border:1px solid var(--line2); border-radius:99px; color:var(--accent); font-size:13px; min-height:40px; padding:6px 12px; cursor:pointer; overflow-wrap:anywhere; max-width:100%; }
.notification-field-label { display:block; font-size:13px; margin-top:16px; }
.notification-search-results { display:grid; gap:4px; max-height:220px; overflow:auto; margin-top:6px; }
.notification-search-results button { text-align:left; border:1px solid var(--line2); background:var(--surface2); color:var(--text); padding:10px 12px; border-radius:6px; min-height:44px; cursor:pointer; overflow-wrap:anywhere; }
.notification-search-results button:disabled { opacity:.6; cursor:default; }
.notification-search-results p { font-size:13px; color:var(--text2); }
.notification-action-fields { display:grid; grid-template-columns:1fr 1fr; gap:16px; }
.notification-preview { min-width:0; }
.notification-preview > p { margin:12px 0; overflow-wrap:anywhere; }
.notification-preview .notification-card { padding:18px; background:var(--bg2); }
.notification-preview h3 { overflow-wrap:anywhere; }
.notification-history { margin-top:28px; }
.notification-table-wrap { overflow-x:auto; margin-top:16px; }
.notification-table-wrap table { width:100%; border-collapse:collapse; font-size:13px; }
.notification-table-wrap th,.notification-table-wrap td { text-align:left; padding:12px; border-bottom:1px solid var(--line2); }
.notification-table-wrap td:first-child { min-width:180px; max-width:340px; overflow-wrap:anywhere; }
.notification-pagination { display:flex; gap:16px; align-items:center; justify-content:center; flex-wrap:wrap; margin-top:24px; }
.notification-form button:disabled,.notification-card-actions button:disabled,#notification-send:disabled { opacity:.55; cursor:wait; }
@media (min-width:761px) and (max-width:1050px) {
 .topbar .avatar-name { display:none; }
 .topbar-inner { gap:8px; }
}
@media (max-width:900px) {
 .notification-admin-grid:has(.notification-preview:not([hidden])) { grid-template-columns:1fr; }
}
@media (max-width:760px) {
 .topbar-user-full .notification-bell { display:none; }
 .notification-stats { grid-template-columns:repeat(2,minmax(0,1fr)); gap:12px; }
 .notification-stats .panel { padding:16px; }
 .notification-card { padding:18px; }
 .notification-action-fields { grid-template-columns:1fr; }
 .notification-audience { padding:12px; }
 .notification-page-head { align-items:flex-start; }
 .notification-form .notification-card-actions > button { width:100%; }
}