/* The intern portal's shell: the pinned nav controls (bell, Help, account),
   the notification rows shared by the bell and /notifications, and the
   skip-link target. Loaded by base.html on every non-admin page, after
   portal-intern.css. Colours via df-tokens.css so dark mode follows. */

/* ── Pinned controls (templates/_intern_nav.html) ─────────────────── */
.navbar-logo-theme .df-nav-pinned .nav-link { padding-left: .5rem; padding-right: .5rem; }
/* A long name must not crowd the bar: shown from xl up, cut with an
   ellipsis, and in full inside the menu. */
.navbar-logo-theme .df-nav-name { max-width: 11rem; vertical-align: bottom; }
.df-nav-menu-name { max-width: 16rem; }

/* Below the expand breakpoint the pinned list sits in the header row beside
   the hamburger. Bootstrap renders navbar dropdowns `position: static` there
   (they would push the row open), so they are lifted out and anchored to the
   bar's own right edge - anchoring to the bell itself put a 350px menu off
   the left of a 390px screen. */
@media (max-width: 991.98px) {
    .navbar-logo-theme > .container-fluid { position: relative; }
    .navbar-logo-theme .df-nav-pinned,
    .navbar-logo-theme .df-nav-pinned .dropdown { position: static; }
    .navbar-logo-theme .df-nav-pinned .dropdown-menu {
        position: absolute;
        top: 100%;
        right: .5rem;
        left: auto;
        z-index: 1050;
    }
}

/* ── Notification rows (bell and /notifications) ──────────────────── */
.df-notif-menu { width: min(350px, calc(100vw - 1rem)); max-height: 75vh; overflow: hidden; }
.df-notif-list { max-height: min(320px, 55vh); overflow-y: auto; }
.df-notif-item {
    display: block;
    width: 100%;
    text-align: left;
    border: 0;
    border-bottom: 1px solid var(--df-line);
    padding: .6rem .9rem;
    background: transparent;
    color: inherit;
    text-decoration: none;
    white-space: normal;
}
.df-notif-item:last-child { border-bottom: 0; }
.df-notif-item:focus-visible { outline: 2px solid var(--df-accent); outline-offset: -2px; }
.df-notif-unread { background: var(--df-paper); }
.df-notif-dot { display: inline-block; width: 8px; height: 8px; margin-top: 6px; }
.df-notif-page .df-notif-item { border-bottom: 1px solid var(--df-line); }

/* ── Skip link target (templates/_intern_nav.html) ────────────────── */
.df-skip-target { display: block; height: 0; outline: none; }
.df-skip-target:focus { outline: none; }