/* Narrow-screen layout overrides kept separate from the legacy app.css encoding. */
@media (max-width: 600px) {
    /* SmartCheck owns the center of the app bar on mobile. The language toggle
       remains available on other pages, where it does not compete for space. */
    .appbar .appbar-actions-smartcheck > .mud-button-root {
        display: none !important;
    }

    .appbar .mobile-smartcheck-segment-wrap .mud-menu {
        max-width: calc(100vw - 120px);
    }

    .robots-page,
    .systems-page {
        padding: 16px !important;
    }

    .robots-toolbar,
    .systems-toolbar,
    .invite-page-toolbar,
    .invite-filters,
    .robots-system-summary,
    .systems-launcher-card {
        flex-wrap: wrap !important;
        align-items: flex-start !important;
    }

    .robots-toolbar > div:first-child,
    .systems-toolbar > div:first-child {
        flex: 0 0 100%;
        min-width: 0;
    }

    .robots-toolbar > .mud-spacer,
    .systems-toolbar > .mud-spacer,
    .robots-system-summary > .mud-spacer,
    .systems-launcher-card > .mud-spacer {
        display: none;
    }

    .robots-toolbar > .mud-button-root {
        flex: 0 1 auto;
        min-width: 0;
        padding-left: 7px;
        padding-right: 7px;
        font-size: 0.82rem;
        white-space: nowrap;
    }

    .robots-toolbar > .robots-add-button {
        flex: 1 1 auto;
        min-width: 104px;
    }

    .systems-toolbar > .mud-button-root {
        margin-left: auto;
    }

    .robots-system-summary .mud-input-control,
    .robots-system-summary > .mud-typography,
    .robots-system-summary .mud-checkbox {
        flex: 0 0 100%;
        min-width: 0;
    }

    .robots-system-summary .mud-checkbox {
        margin-top: 4px;
    }

    .robots-table .mud-table-cell {
        align-items: flex-start !important;
    }

    .robots-table .mud-table-cell:first-child {
        display: block !important;
        padding-bottom: 12px !important;
    }

    .robots-table .mud-table-cell:first-child::before {
        display: none !important;
    }

    .robot-identity-meta {
        overflow-wrap: anywhere;
    }

    .systems-launcher-card {
        flex-wrap: nowrap !important;
        align-items: center !important;
    }

    .systems-launcher-card .mud-avatar {
        flex: 0 0 auto;
        align-self: center;
    }

    .systems-launcher-copy {
        flex: 1 1 auto;
        width: calc(100% - 56px);
        min-width: 0;
    }

    .invite-page-toolbar > .mud-typography,
    .invite-filters > .mud-typography {
        flex: 0 0 100%;
    }

    .invite-filters .mud-switch {
        flex: 1 1 calc(50% - 8px);
        min-width: 0;
    }

    .invite-filters .mud-input-control {
        flex: 0 0 100%;
        min-width: 0;
    }
}