/* Student quick navigation: deliberately hidden outside phone widths. */
.ch-mobile-nav { display: none; }

@media (max-width: 767.98px) {
    .ch-mobile-nav {
        box-sizing: border-box;
        position: fixed;
        z-index: 1032;
        inset: auto 12px calc(14px + env(safe-area-inset-bottom));
        width: min(280px, calc(100% - 92px));
        height: 50px;
        margin-inline: auto;
        padding: 1px;
        display: grid;
        grid-template-columns: repeat(5, minmax(0, 1fr));
        align-items: stretch;
        background: #fff;
        border: 1px solid var(--ch-hard-ink);
        border-radius: 999px;
        box-shadow: 0 6px 20px rgba(20, 43, 69, .16);
    }

    .ch-mobile-nav__item {
        min-width: 0;
        display: flex;
        align-items: center;
        justify-content: center;
        border-radius: 999px;
        color: var(--ch-hard-ink);
        text-align: center;
        text-decoration: none;
        -webkit-tap-highlight-color: transparent;
    }

    .ch-mobile-nav__item > i,
    .ch-mobile-nav__icon { font-size: 1.2rem; line-height: 1; }
    .ch-mobile-nav__icon { position: relative; display: inline-flex; }
    .ch-mobile-nav__item > span:last-child:not(:first-child) { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; }
    .ch-mobile-nav__item.is-active { background: var(--ch-blue-soft); color: var(--ch-blue); }
    .ch-mobile-nav__item:focus-visible { outline: 3px solid var(--ch-orange); outline-offset: -3px; }
    .ch-mobile-nav__item:not(.is-active):hover { background: var(--ch-blue-soft); color: var(--ch-blue); }
    .ch-mobile-nav__avatar { width: 23px; height: 23px; border: 2px solid currentColor; border-radius: 50%; object-fit: cover; }
    .ch-mobile-nav__initials { display: grid; place-items: center; background: var(--ch-blue-soft); color: var(--ch-blue); font-size: .58rem; }
    .ch-mobile-nav__item.is-active .ch-mobile-nav__initials { background: #fff; }
    .ch-mobile-nav__badge { position: absolute; top: -1px; right: -7px; min-width: 13px; height: 13px; padding: 0 2px; border: 2px solid #fff; border-radius: 999px; background: var(--ch-orange); color: #fff; font-size: .52rem; font-weight: 900; line-height: 9px; }
    .ch-mobile-nav__badge[hidden] { display: none; }

    /* The search destination lives in the bottom bar, freeing the top bar for notifications and creation. */
    .ch-top:has(+ .ch-mobile-nav) .ch-search { display: none; }
    .ch-top:has(+ .ch-mobile-nav) .ch-actions { margin-left: auto; }
    .ch-body.ch-nav-open .ch-mobile-nav { visibility: hidden; }
    .ch-body:has(.ch-top .dropdown-menu.show) .ch-mobile-nav { visibility: hidden; }
    .ch-mobile-nav ~ .ch-main > .main-page-container { padding-bottom: calc(78px + env(safe-area-inset-bottom)); }
    .ch-mobile-nav ~ .ch-main .ch-foot { padding-bottom: calc(80px + env(safe-area-inset-bottom)); }
    .ch-body:has(.ch-mobile-nav) .campus-msg-dock { display: none !important; }
}

@media (prefers-reduced-motion: reduce) {
    .ch-mobile-nav__item { transition: none; }
}