.notification-bell {
    position:relative;
}

.notification-badge {
    position:absolute;
    top:-.35rem;
    right:-.4rem;
    min-width:1.25rem;
    height:1.25rem;
    padding:0 .3rem;
    border-radius:999px;
    display:inline-flex;
    align-items:center;
    justify-content:center;
    font-size:.68rem;
}

.notification-grid > [class*="col-"] {
    min-width:0;
}

.notification-item {
    border-left:4px solid transparent;
    transition:box-shadow .16s ease, transform .16s ease;
}

.notification-item.notification-unread {
    background:#f5f7ff;
    border-left-color:#4f46e5;
}

.notification-item:focus-within {
    box-shadow:0 0 0 .2rem rgba(79,70,229,.14);
}

.notification-card-layout {
    display:grid;
    grid-template-columns:auto minmax(0,1fr) auto;
    gap:.8rem;
    align-items:start;
    height:100%;
}

.notification-card-copy {
    min-width:0;
}

.notification-body {
    overflow-wrap:anywhere;
}

.notification-card-actions {
    display:flex;
    flex-direction:column;
    align-items:stretch;
    gap:.5rem;
    margin-left:.25rem;
    min-width:max-content;
}

.notification-card-actions .btn {
    white-space:nowrap;
}

.notification-dot {
    width:.65rem;
    height:.65rem;
    border-radius:50%;
    background:#cbd5e1;
    flex:0 0 auto;
}

.notification-unread .notification-dot {
    background:#4f46e5;
    box-shadow:0 0 0 4px #e0e7ff;
}

@media(max-width:767.98px) {
    .notification-page-actions {
        width:100%;
    }
    .notification-page-actions .btn {
        flex:1 1 auto;
    }
    .notification-card-layout {
        grid-template-columns:auto minmax(0,1fr);
    }
    .notification-card-actions {
        grid-column:2;
        flex-direction:row;
        flex-wrap:wrap;
        margin-left:0;
        min-width:0;
    }
}

@media(max-width:575.98px) {
    .notification-item .card-body {
        padding:1rem!important;
    }
    .notification-card-layout {
        gap:.65rem;
    }
    .notification-card-actions {
        width:100%;
    }
    .notification-card-actions .btn {
        min-height:40px;
    }
}

/* PUBLIC-LESSON-1B FIX02-R1: one shared bell preview + compact notification center. */
.notification-bell-wrap{position:relative;display:inline-flex}
.notification-preview{position:absolute;z-index:1080;top:calc(100% + .5rem);right:0;width:min(360px,calc(100vw - 24px));border:1px solid var(--bs-border-color);border-radius:.9rem;background:var(--bs-body-bg);overflow:hidden;text-align:left}
.notification-preview[hidden]{display:none!important}
.notification-preview__head{display:flex;align-items:center;justify-content:space-between;gap:.75rem;padding:.7rem .8rem;border-bottom:1px solid var(--bs-border-color-translucent)}
.notification-preview__list{max-height:min(330px,calc(100vh - 10rem));overflow-y:auto;overflow-x:hidden;overscroll-behavior:contain;scrollbar-gutter:stable}
.notification-preview__item{display:grid;grid-template-columns:auto minmax(0,1fr);gap:.65rem;align-items:start;padding:.68rem .8rem;border-bottom:1px solid var(--bs-border-color-translucent);color:inherit;text-decoration:none;background:var(--bs-body-bg)}
.notification-preview__item:hover{background:var(--bs-tertiary-bg)}
a.notification-preview__item:focus-visible{background:var(--bs-tertiary-bg);outline:2px solid var(--bs-primary);outline-offset:-2px}
.notification-preview__item.is-unread{background:rgba(79,70,229,.045)}
.notification-preview__dot{width:.5rem;height:.5rem;margin-top:.38rem;border-radius:50%;background:#cbd5e1}
.notification-preview__item.is-unread .notification-preview__dot{background:#4f46e5;box-shadow:0 0 0 3px #e0e7ff}
.notification-preview__copy{min-width:0;display:grid;gap:.16rem}
.notification-preview__line{font-size:.84rem;line-height:1.3;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.notification-preview__time{font-size:.72rem;color:var(--bs-secondary-color)}
.notification-preview__empty{padding:1rem .8rem;text-align:center;color:var(--bs-secondary-color);font-size:.84rem}
.notification-preview__all{display:flex;align-items:center;justify-content:center;gap:.35rem;padding:.68rem .8rem;font-size:.82rem;font-weight:700;text-decoration:none;background:var(--bs-tertiary-bg)}
.notification-page-toolbar{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:.75rem;margin-bottom:.9rem}
.notification-filter-group{display:flex;align-items:center;gap:.45rem;flex-wrap:wrap}
.notification-filter-label{font-size:.78rem;font-weight:700;color:var(--bs-secondary-color);margin-right:.15rem}
.notification-filter-group .btn{padding:.35rem .68rem;font-size:.82rem}
.notification-page-size{display:flex;align-items:center;gap:.4rem;font-size:.78rem;color:var(--bs-secondary-color)}
.notification-page-size .form-select{width:auto;min-width:72px;padding-top:.3rem;padding-bottom:.3rem;font-size:.82rem}
.notification-page-actions .btn{padding:.38rem .65rem;font-size:.82rem}
.notification-item .card-body{padding:.9rem 1rem!important}
.notification-card-layout{gap:.65rem}
.notification-card-actions{gap:.35rem}
.notification-card-actions .btn{padding:.35rem .65rem;font-size:.82rem}
.notification-page-summary{font-size:.8rem;color:var(--bs-secondary-color)}

@media(max-width:575.98px){
  .notification-preview{display:none!important}
  .notification-page-toolbar{align-items:stretch}
  .notification-filter-group{width:100%}
  .notification-page-size{width:100%;justify-content:space-between}
}

/* PUBLIC-LESSON-1B FIX04: exact owned notification fallback focus. */
.notification-focus-card{border-color:rgba(79,70,229,.35);box-shadow:0 0 0 3px rgba(79,70,229,.07)}
.notification-focus-card .notification-body{max-width:72ch}