/* Mobile and app-install foundation. Desktop behavior is intentionally unchanged. */

:root {
    --mobile-safe-top: env(safe-area-inset-top, 0px);
    --mobile-safe-right: env(safe-area-inset-right, 0px);
    --mobile-safe-bottom: env(safe-area-inset-bottom, 0px);
    --mobile-safe-left: env(safe-area-inset-left, 0px);
}

html {
    -webkit-text-size-adjust: 100%;
    text-size-adjust: 100%;
}

@media (max-width: 900px) {
    .main-container,
    .app-layout.no-sidebar .main-container {
        padding-left: max(0.85rem, var(--mobile-safe-left));
        padding-right: max(0.85rem, var(--mobile-safe-right));
    }

    .app-page-head-row,
    .app-toolbar-head,
    .app-flex-end-wrap,
    .app-filter-form {
        align-items: stretch;
    }

    .app-filter-form,
    .app-inline-actions,
    .app-form-actions,
    .app-form-actions-spacious {
        row-gap: 0.45rem;
    }

    .coa-workspace,
    .dimension-workspace,
    .tb-workspace,
    .journal-query-workspace,
    .fs-report-workspace,
    .fs-query-builder-shell {
        grid-template-columns: minmax(0, 1fr) !important;
    }

    .coa-pane-resizer,
    .dimension-pane-resizer,
    .tb-pane-resizer,
    .journal-pane-resizer,
    .fs-query-pane-resizer {
        display: none !important;
    }

    .coa-detail-column,
    .dimension-detail-column,
    .tb-right,
    .journal-detail-col,
    .fs-report-main,
    .fs-query-builder-panel {
        min-width: 0;
        max-width: 100%;
    }
}

@media (max-width: 760px) {
    body {
        overscroll-behavior-y: none;
    }

    .navbar {
        padding-top: calc(0.52rem + var(--mobile-safe-top));
        padding-left: max(0.55rem, var(--mobile-safe-left));
        padding-right: max(0.55rem, var(--mobile-safe-right));
    }

    .navbar-icon-trigger,
    .navbar-user-trigger,
    .app-tab-icon-button {
        min-width: 2.25rem;
        min-height: 2.25rem;
    }

    .navbar-user-menu {
        max-width: min(180px, 38vw);
    }

    .navbar-user-menu-content,
    .navbar-icon-menu-content {
        position: fixed;
        top: calc(var(--navbar-offset) + 0.4rem);
        right: max(0.55rem, var(--mobile-safe-right));
        left: max(0.55rem, var(--mobile-safe-left));
        width: auto;
        min-width: 0;
        max-width: none;
        max-height: calc(100dvh - var(--navbar-offset) - 1rem - var(--mobile-safe-bottom));
        overflow: auto;
        -webkit-overflow-scrolling: touch;
        overscroll-behavior: contain;
    }

    .navbar-settings-menu,
    .navbar-help-menu,
    .navbar-refresh-menu {
        width: auto;
    }

    .app-tab-strip {
        padding-left: max(0.35rem, var(--mobile-safe-left));
        padding-right: max(0.35rem, var(--mobile-safe-right));
        overflow-x: auto;
        -webkit-overflow-scrolling: touch;
        scrollbar-gutter: stable;
    }

    .app-tab-list {
        min-width: 0;
        overflow-x: auto;
        -webkit-overflow-scrolling: touch;
    }

    .app-tab-link {
        max-width: 8.5rem;
    }

    .app-page-head-row,
    .app-toolbar-head,
    .app-flex-end-wrap {
        flex-direction: column;
    }

    .app-inline-actions,
    .app-form-actions,
    .app-form-actions-spacious,
    .app-filter-form {
        width: 100%;
    }

    .app-form-actions > *,
    .app-form-actions-spacious > *,
    .app-filter-form > *,
    .app-inline-actions > * {
        max-width: 100%;
    }

    .app-select-inline,
    .app-select-wide {
        width: 100%;
        min-width: 0;
    }

    .history-table-wrap,
    .grid-wrap,
    .app-windowed-table-scroll,
    .app-window-table-wrap,
    .fs-window-table-wrap,
    .tb-window-table-wrap,
    .coa-grid-scroll,
    .company-grid-scroll,
    .dimension-grid-scroll,
    .tb-grid-scroll,
    .journal-grid-scroll,
    .fs-map-grid-wrap,
    .fx-grid-wrap {
        max-width: 100%;
        overflow: auto;
        -webkit-overflow-scrolling: touch;
        overscroll-behavior: contain;
    }

    .history-table,
    .coa-grid,
    .company-grid,
    .dimension-grid,
    .tb-grid,
    .journal-grid,
    .fx-grid {
        font-size: 0.82rem;
    }
}

@media (max-width: 560px) {
    .main-container,
    .app-layout.no-sidebar .main-container {
        padding-left: max(0.65rem, var(--mobile-safe-left));
        padding-right: max(0.65rem, var(--mobile-safe-right));
        padding-bottom: calc(1rem + var(--mobile-safe-bottom));
    }

    .navbar {
        gap: 0.18rem;
    }

    .navbar a {
        padding-left: 0.25rem;
        padding-right: 0.25rem;
    }

    .navbar-right-tools {
        gap: 0.16rem;
    }

    .navbar-user-menu {
        max-width: min(140px, 34vw);
    }

    .navbar-user-trigger-label {
        max-width: 100%;
    }

    .navbar .navbar-signup-pill {
        padding-left: 0.55rem;
        padding-right: 0.55rem;
    }

    .page-title,
    .saas-home-header h1 {
        font-size: 1.65rem;
        line-height: 1.15;
    }

    .auth-card,
    .app-auth-panel {
        width: 100%;
        max-width: none;
        box-sizing: border-box;
    }
}

@media (hover: none) and (pointer: coarse) {
    a,
    button,
    summary,
    select,
    input,
    textarea {
        touch-action: manipulation;
    }

    .main-container button,
    .main-container .button,
    .main-container input[type="submit"],
    .main-container input[type="button"],
    .main-container select {
        min-height: 2.5rem;
    }
}
