/* Scoped phone corrections; retain each tool's controls and information order. */
/* Short mobile drawers scroll as one surface. A pinned account footer otherwise
   consumes nearly all of the available navigation height in landscape. */
@media (max-width: 1050px) and (max-height: 600px) {
    #sidebar {
        top: var(--agn-mobile-header-h, 56px);
        height: calc(100dvh - var(--agn-mobile-header-h, 56px)) !important;
        overflow-x: hidden;
        overflow-y: auto;
        overscroll-behavior-y: contain;
        touch-action: pan-y;
        scrollbar-gutter: stable;
    }
    #sidebar .sidebar-top {
        flex: 0 0 auto;
        padding-top: 0;
        overflow: visible;
        scrollbar-gutter: auto;
    }
    #sidebar .sidebar-bottom {
        flex: 0 0 auto;
        position: static;
    }
    #sidebar #sidebarToggleBtn {
        position: static;
    }
}

/* Tool introductions should not consume the workspace on tablets or short screens. */
@media (max-width: 1050px), (max-height: 600px) {
    #contentWindow .agn-page-root > .agn-page-header {
        display: flex; flex-direction: row; flex-wrap: wrap; align-items: center;
        gap: 4px 12px; padding: 4px 8px !important; margin: 0 0 3px !important;
    }
    #contentWindow .agn-page-root > .agn-page-header :is(.agn-page-eyebrow, .agn-page-summary, .agn-data-hint) { display: none; }
    #contentWindow .agn-page-root > .agn-page-header .agn-page-title { font-size: 1rem; line-height: 1.2; white-space: normal; }
    #contentWindow .agn-page-root > .agn-page-header .agn-page-actions { width: auto; margin-left: auto; }
    #contentWindow :is(#ironAdvancedDataRoot, #driverAdvancedDataRoot) .agn-data-view-switch { width: auto; gap: 4px; }
    #contentWindow :is(#ironAdvancedDataRoot, #driverAdvancedDataRoot) .agn-data-view-btn { min-height: 36px; padding: 4px 10px; }
    #contentWindow :is(#ironAdvancedDataRoot, #driverAdvancedDataRoot) .agn-data-filter-help { display: none; }
}

/* On wider phones/tablets, share the data-page title row with Menu.
   Demo notices retain their own space rather than sitting under navigation. */
@media (min-width: 721px) and (max-width: 1050px) {
    body:has(#ironAdvancedDataRoot, #driverAdvancedDataRoot):not(:has([data-agn-demo])) .mobile-shell-header {
        position: absolute; left: 0; top: 0; width: 110px;
        background: transparent; border: 0;
    }
    body:not(:has([data-agn-demo])) #contentWindow :is(#ironAdvancedDataRoot, #driverAdvancedDataRoot) > .agn-page-header {
        min-height: var(--agn-mobile-header-h, 56px);
        padding-left: 114px !important;
        padding-top: calc(4px + env(safe-area-inset-top, 0px)) !important;
    }
}

@media (max-width: 720px) {
    #contentWindow .terms-grid { grid-template-columns: minmax(0, 1fr); }
    #contentWindow .term-card { min-width: 0; overflow-wrap: anywhere; }
    #contentWindow #termSearch { min-height: 44px; font-size: 16px; }

    #contentWindow .account-page .location-search-row,
    #contentWindow .account-page .location-row,
    #contentWindow .account-page .location-result { grid-template-columns: minmax(0, 1fr); }
    #contentWindow .account-page .location-actions { justify-content: flex-start; }
    #contentWindow .account-page .account-hero-meta { white-space: normal; overflow-wrap: anywhere; }
    #contentWindow .account-page .account-data dd { min-width: 0; overflow-wrap: anywhere; }
    #contentWindow .account-page :is(.account-input, .account-tab, .btn),
    #contentWindow .registration-form :is(.form-control, .btn),
    #loginModal :is(.form-control, .btn, .agn-forgot-link) { min-height: 44px; }
    #contentWindow .account-page :is(input:not([type=checkbox]):not([type=radio]), select),
    #contentWindow .registration-form .form-control,
    #loginModal .form-control { font-size: 16px; }
    #loginModal .modal-dialog { margin: 8px; min-height: calc(100dvh - 16px); }
    #loginModal .modal-content { max-height: calc(100dvh - 16px); }
    #loginModal .modal-body { overflow-y: auto; }
    #loginModal .modal-header { align-items: flex-start; }
    #loginModal .btn-close { flex-shrink: 0; min-width: 32px; min-height: 32px; margin: 0; padding: 0; }

    #contentWindow #ironPickerPageRoot :is(.slider-value-input, .left-sheet-tab, .left-toolbar-btn, .save-btn, .agn-howto-btn, .toolbar-altitude-select),
    #contentWindow #ironPickerPageRoot #rightColumn select { min-height: 44px; height: auto; }
    #contentWindow #ironPickerPageRoot :is(.slider-value-input, .toolbar-altitude-select),
    #contentWindow #ironPickerPageRoot #rightColumn select { font-size: 16px; }
    #driverFitPageRoot :is(.btn, .save-btn, .agn-howto-btn) { min-height: 44px; white-space: normal; }

    #skillAndCoachingPageRoot .skill-coaching-grid { grid-template-columns: minmax(0, 1fr); }
    #skillAndCoachingPageRoot .skill-coaching-grid > * { min-width: 0; }
    #skillAndCoachingPageRoot .inputs-grid { grid-template-columns: minmax(0, 1.4fr) repeat(2, minmax(0, 1fr)); gap: 6px; }
    #skillAndCoachingPageRoot .inputs-grid .lbl { white-space: normal; overflow-wrap: anywhere; }
    #skillAndCoachingPageRoot .inputs-grid :is(input, select) { min-width: 0; width: 100%; }
    #skillAndCoachingPageRoot :is(input[type=number], select.form-select, input.form-control) { min-height: 44px; height: auto !important; font-size: 16px !important; }
    #skillAndCoachingPageRoot :is(.btn, .skill-coaching-mode-tab) { min-height: 44px; height: auto !important; white-space: normal; }
    #skillAndCoachingPageRoot .btn-row { flex-wrap: wrap; }

    #flightWindowPage :is(.fw-input-top, .fw-input-bottom) { gap: 8px; }
    #flightWindowPage .fw-field { min-width: 0; }
    #flightWindowPage .fw-field label { font-size: .8rem; line-height: 1.3; }
    #flightWindowPage .fw-field :is(input, select) { min-height: 44px; font-size: 16px; min-width: 0; }
    #flightWindowPage :is(.fw-action, .fw-save-action, .fw-howto-button, .fw-chart-tab, .fw-ball-picker-btn, .fw-goal) { min-height: 44px; white-space: normal; }
    #flightWindowPage .fw-chart-tab { min-width: 44px; }
    #flightWindowPage .fw-input-bottom .fw-action { grid-column: 1 / -1; }
    #flightWindowPage .fw-goal-row { flex-wrap: wrap; }
    #flightWindowPage .fw-goal-row .fw-goals { flex-basis: 100%; }
    #flightWindowPage .fw-chart-head { flex-wrap: wrap; }
    #flightWindowPage .fw-chart-controls { flex-basis: 100%; margin-left: 0; min-width: 0; }
    #flightWindowPage .fw-chart-adjust { flex-basis: 100%; min-width: 0; }
    #flightWindowPage .fw-save-wrap { flex-wrap: wrap; }
    #flightWindowPage .fw-ball-modal { padding: 8px; }
    #flightWindowPage .fw-ball-dialog { margin-top: 0; max-height: calc(100dvh - 16px); overflow-y: auto; }
    #flightWindowPage .fw-ball-modal-filters :is(input, select) { min-height: 44px; font-size: 16px; }
}

@media (max-width: 400px) {
    #driverFitPageRoot .row-2col-tight { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    #driverFitPageRoot .row-2col-tight > select { grid-column: 1 / -1; }
    #contentWindow .account-page .club-filter-grid { grid-template-columns: minmax(0, 1fr); }
}