/* Mobile top-bar search, notification, badge, and back controls. */

.app-mobile-search-link svg,
.app-mobile-notification-link svg {
    width: 18px;
    height: 18px;
    fill: none;
    stroke: currentColor;
    stroke-width: 2;
    stroke-linecap: round;
    stroke-linejoin: round;
}

@media (max-width: 991.98px) {
    .app-mobile-search-link,
    .app-mobile-notification-link {
        position: absolute;
        top: 50%;
        z-index: 2;
        transform: translateY(-50%);
        width: 32px;
        height: 32px;
        display: inline-flex;
        align-items: center;
        justify-content: center;
        border-radius: 999px;
        color: #f6eee9;
    }

    .app-mobile-search-link {
        right: 12px;
    }

    .app-mobile-notification-link {
        left: 12px;
    }

    .app-mobile-notification-badge {
        position: absolute;
        top: 1px;
        right: 1px;
        min-width: 14px;
        height: 14px;
        padding: 0 3px;
        display: inline-flex;
        align-items: center;
        justify-content: center;
        border-radius: 999px;
        background: #f25a00;
        color: #ffffff;
        font-size: 8px;
        font-weight: 900;
        line-height: 1;
        box-shadow: 0 0 0 2px #120905;
        white-space: nowrap;
    }

    .app-mobile-search-link:hover,
    .app-mobile-search-link:focus,
    .app-mobile-notification-link:hover,
    .app-mobile-notification-link:focus {
        color: #ffffff;
        background: rgba(255, 255, 255, 0.08);
    }

    .app-navbar a.app-navbar-back-link {
        position: absolute;
        top: 50%;
        right: 12px;
        z-index: 2;
        transform: translateY(-50%);
    }

    .app-navbar-links {
        display: none;
    }
}