/* Shared notification surfaces use the LinkPOS theme tokens. */
.account-dropdown { display: inline-block; }
.account-toggle { border: 0; padding: 0; background: transparent; }
.account-toggle:focus-visible { outline: 3px solid var(--color-primary, #0085ff); outline-offset: 4px; }
.account-initial { display: flex; align-items: center; justify-content: center; width: 36px; height: 36px; border-radius: 50%; background: var(--color-primary, #0085ff); color: #fff; font-weight: 700; font-size: 15px; }
.account-dropdown .account-menu { width: 292px; max-width: calc(100vw - 24px); padding: 6px; margin-top: 12px; border: 1px solid var(--color-border, #e5e7eb); border-radius: 16px; background: var(--color-bg-card, #fff); box-shadow: 0 16px 48px rgba(15, 23, 42, .16); overflow: hidden; }
.account-summary { display: flex; align-items: center; gap: 12px; padding: 16px 12px 20px; margin-bottom: 6px; border-bottom: 1px solid var(--color-border, #e5e7eb); }
.account-summary-avatar { flex: 0 0 44px; height: 44px; display: flex; align-items: center; justify-content: center; border-radius: 13px; background: rgba(0, 133, 255, .1); color: var(--color-primary, #0085ff); font-size: 20px; font-weight: 700; }
.account-details { min-width: 0; }
.account-eyebrow { display: block; margin-bottom: 3px; font-size: 9px; font-weight: 700; letter-spacing: 1.2px; color: var(--text-muted, #6b7280); }
.account-details strong { display: block; color: var(--text-dark, #111827); font-size: 14px; font-weight: 700; overflow-wrap: anywhere; }
.account-email { display: block; margin-top: 3px; font-size: 11px; color: var(--text-muted, #6b7280); overflow-wrap: anywhere; }
.account-dropdown .account-menu > li > a.account-link { display: flex; align-items: center; gap: 11px; padding: 10px; margin: 2px 0; border-radius: 9px; color: var(--text-body, #4b5563); font-size: 12px; font-weight: 500; line-height: 1.5; white-space: normal; transition: background .15s, color .15s; }
.account-menu-icon { display: flex; align-items: center; justify-content: center; flex: 0 0 30px; height: 30px; border: 1px solid var(--color-border, #e5e7eb); border-radius: 8px; color: var(--text-muted, #6b7280); }
.account-menu-icon svg { width: 16px; height: 16px; fill: none; stroke: currentColor; stroke-width: 1.7; stroke-linecap: round; stroke-linejoin: round; }
.account-chevron { margin-left: auto; color: var(--text-muted, #6b7280); font-size: 20px; font-weight: 400; }
.account-dropdown .account-menu > li > a.account-link:hover, .account-dropdown .account-menu > li > a.account-link:focus { background: rgba(0, 133, 255, .07); color: var(--color-primary, #0085ff); }
.account-link:hover .account-menu-icon, .account-link:focus .account-menu-icon { color: var(--color-primary, #0085ff); }
.account-menu-footer { margin-top: 6px; padding-top: 6px; border-top: 1px solid var(--color-border, #e5e7eb); }
.account-dropdown .account-menu > li > a.account-logout, .account-logout .account-menu-icon { color: #ef4444; }
.account-dropdown .account-menu > li > a.account-logout:hover, .account-dropdown .account-menu > li > a.account-logout:focus { color: #ef4444; background: rgba(239, 68, 68, .07); }
.notification-center { display: inline-block; }
.notification-center .notification-count[hidden] { display: none !important; }
.notification-center .notification-panel {
    width: 370px; max-width: calc(100vw - 24px); padding: 0;
    margin-top: 12px; overflow: hidden; border-radius: 12px;
    background: var(--color-bg-card, #fff); color: var(--text-body, #4b5563);
    border: 1px solid var(--color-border, #e5e7eb);
    box-shadow: 0 16px 48px rgba(15, 23, 42, .16);
    font-family: var(--font-sans, inherit);
}
.notification-heading { display: flex; align-items: center; justify-content: space-between; padding: 17px 18px; border-bottom: 1px solid var(--color-border, #e5e7eb); }
.notification-heading strong { color: var(--text-dark, #111827); font-size: 14px; }
.notification-clear { padding: 4px; border: 0; background: transparent; color: var(--color-primary, #0085ff); font-size: 12px; cursor: pointer; }
.notification-clear:disabled { opacity: .4; cursor: default; }
.notification-list { max-height: min(430px, 65vh); overflow-y: auto; overscroll-behavior: contain; }
.notification-item { --notice-color: #0085ff; display: flex; gap: 12px; padding: 16px 18px; border-bottom: 1px solid var(--color-border, #e5e7eb); }
.notification-item:last-child { border-bottom: 0; }
.notification-item.is-unread { background: rgba(0, 133, 255, .05); }
.notification-success { --notice-color: #00a88f; }
.notification-error { --notice-color: #ef4444; }
.notification-warning { --notice-color: #d99014; }
.notification-symbol { display: flex; align-items: center; justify-content: center; flex: 0 0 30px; height: 30px; border-radius: 9px; color: var(--notice-color); background: color-mix(in srgb, var(--notice-color) 12%, transparent); font-size: 16px; font-weight: 700; }
.notification-content { min-width: 0; }
.notification-content strong { color: var(--text-dark, #111827); font-size: 12px; }
.notification-content p { margin: 4px 0 6px; font-size: 12px; line-height: 1.6; overflow-wrap: anywhere; white-space: pre-line; }
.notification-content time { color: var(--text-muted, #6b7280); font-size: 10px; }
.notification-empty { padding: 34px 20px; text-align: center; }
.notification-empty i { display: block; margin-bottom: 12px; font-size: 25px; color: var(--color-primary, #0085ff); }
.notification-empty strong { display: block; color: var(--text-dark, #111827); font-size: 13px; }
.notification-empty span { display: block; margin-top: 6px; color: var(--text-muted, #6b7280); font-size: 12px; }
#toast-container.toast-top-right { top: 76px; right: 20px; }
#toast-container > .toast {
    --notice-color: #0085ff;
    width: 350px; max-width: calc(100vw - 32px); margin-bottom: 12px;
    padding: 17px 38px 17px 20px; border-radius: 12px;
    border: 1px solid var(--color-border, #e5e7eb); border-left: 4px solid var(--notice-color);
    background: var(--color-bg-card, #fff) !important;
    color: var(--text-body, #4b5563); opacity: 1;
    box-shadow: 0 8px 28px rgba(15, 23, 42, .13);
    font-family: var(--font-sans, inherit); font-size: 13px; line-height: 1.6;
}
#toast-container > .toast-success { --notice-color: #00a88f; }
#toast-container > .toast-error { --notice-color: #ef4444; }
#toast-container > .toast-warning { --notice-color: #d99014; }
#toast-container .toast-title { color: var(--text-dark, #111827); margin-bottom: 3px; }
#toast-container .toast-message { overflow-wrap: anywhere; }
#toast-container .toast-message p:last-child { margin-bottom: 0; }
#toast-container .toast-close-button { position: absolute; right: 12px; top: 10px; color: var(--text-muted, #6b7280); opacity: .8; text-shadow: none; font-weight: 400; }
#toast-container .toast-progress { background: var(--notice-color); height: 3px; opacity: .65; }
@media (max-width: 480px) {
    #toast-container.toast-top-right { right: 16px; }
    .notification-center .notification-panel { position: fixed; top: 60px; right: 12px; margin-top: 6px; }
}
