/* Placement only; colors, controls, focus and surfaces reuse ScriptTonic primitives. */
.st-notification-center-bell .st-notification-row {
    display: block !important;
    min-width: 0;
    white-space: normal;
    text-align: start;
    overflow-wrap: anywhere;
    background: transparent;
    border: 0;
    padding: 12px 16px;
    line-height: 1.45;
}

.st-notification-center-bell .st-notification-row-title,
.st-notification-center-bell .st-notification-row-summary {
    display: block;
}

.st-notification-center-bell .st-notification-row-title {
    color: var(--st-text);
    font-weight: 600;
}

.st-notification-center-bell .st-notification-row-summary {
    margin-block: 4px 8px;
    color: var(--st-text-muted);
    font-size: 0.8125rem;
}

.st-notification-center-bell .st-notification-row-meta {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 4px 10px;
    color: var(--st-text-muted);
    font-size: 0.75rem;
}

.st-notification-center-bell .st-notification-unread {
    display: inline-block;
    color: var(--st-brand-hover);
    border: 1px solid var(--st-border);
    border-radius: 4px;
    padding: 1px 6px;
}

@media (max-width: 575.98px) {
    .st-notification-center-bell > .st-dropdown-menu {
        position: fixed;
        inset-inline: 12px;
        inset-block-start: 64px;
        width: auto !important;
        max-height: calc(100dvh - 88px) !important;
    }
}

/* The Admin shell uses a separate legacy markup contract; keep its image and unread dot aligned. */
.vironeer-page-header .vironeer-notifications-menu {
    max-width: calc(100vw - 24px);
}

.vironeer-page-header .vironeer-notification {
    display: flex;
    align-items: flex-start;
    gap: 12px;
}

.vironeer-page-header .vironeer-notification-image {
    flex: 0 0 40px;
}

.vironeer-page-header .vironeer-notification-info {
    flex: 1;
    min-width: 0;
}

.vironeer-page-header .vironeer-notification-title {
    display: flex;
    align-items: flex-start;
    gap: 8px;
    white-space: normal;
    overflow-wrap: anywhere;
}

.vironeer-page-header .vironeer-notification-title > .unread {
    flex: 0 0 auto;
}

/* Override the legacy Admin light-theme text colors only inside its dark menu. */
.vironeer-page-header .vironeer-notifications-menu .vironeer-notification-title,
.vironeer-page-header .vironeer-notifications-menu .vironeer-notifications-header-title {
    color: var(--st-text) !important;
}

.vironeer-page-header .vironeer-notifications-menu .vironeer-notification-text,
.vironeer-page-header .vironeer-notifications-menu .vironeer-notifications-footer,
.vironeer-page-header .vironeer-notifications-menu .vironeer-notifications-read-button {
    color: var(--st-text-muted) !important;
}

.vironeer-page-header .vironeer-notifications-menu .vironeer-notification.unread .vironeer-notification-title {
    font-weight: 700;
}

.vironeer-page-header .vironeer-notifications-menu .vironeer-notification-title > .unread {
    color: var(--st-brand-hover) !important;
}

.vironeer-page-header .vironeer-notifications-menu .vironeer-notification:hover,
.vironeer-page-header .vironeer-notifications-menu .vironeer-notifications-footer:hover {
    background-color: var(--st-surface-overlay) !important;
}