/* Desktop History workspace: readable two-column flow with page-level scrolling. */
@media (min-width: 1000px) {
    body.fh-workspace-v2:not(.fh-phone) #historyPage.page-section.active {
        --history-sidebar-width: 300px;
        --history-chart-row-height: 160px;
        --history-footer-height: 46px;
        display: grid !important;
        grid-template-columns: 300px minmax(0, 1fr) !important;
        grid-template-rows: max-content max-content minmax(360px, max-content) max-content max-content !important;
        grid-auto-rows: auto;
        align-content: start;
        height: 100% !important;
        min-height: 0;
        max-height: 100% !important;
        overflow-x: hidden !important;
        overflow-y: auto !important;
        padding: 12px;
        gap: 12px;
    }

    body.fh-workspace-v2:not(.fh-phone) #historyPage .history-workspace,
    body.fh-workspace-v2:not(.fh-phone) #historyPage .history-sidebar {
        display: contents !important;
    }

    body.fh-workspace-v2:not(.fh-phone) #historyPage .history-source-panel {
        display: block !important;
        grid-column: 1;
        grid-row: 1;
        min-width: 0;
        min-height: 0 !important;
        height: auto !important;
        flex: initial !important;
    }

    body.fh-workspace-v2:not(.fh-phone) #historyPage .history-period-panel {
        display: block !important;
        grid-column: 2;
        grid-row: 1;
        min-width: 0;
        min-height: 0 !important;
        height: auto !important;
        flex: initial !important;
    }

    body.fh-workspace-v2:not(.fh-phone) #historyPage .history-period-panel .history-controls-grid {
        display: grid !important;
        grid-template-columns: repeat(3, minmax(0, 1fr));
        gap: 10px;
    }

    body.fh-workspace-v2:not(.fh-phone) #historyPage .history-source-panel .history-controls-grid {
        grid-template-columns: minmax(0, 1.2fr) minmax(0, 1fr);
        gap: 10px;
    }

    body.fh-workspace-v2:not(.fh-phone) #historyPage .history-source-panel .control-row:first-child {
        display: contents;
    }

    body.fh-workspace-v2:not(.fh-phone) #historyPage .history-source-panel .control-row:first-child > label {
        grid-column: 1;
        grid-row: 1;
    }

    body.fh-workspace-v2:not(.fh-phone) #historyPage .history-vehicle-select-shell {
        grid-column: 1;
        grid-row: 2;
    }

    body.fh-workspace-v2:not(.fh-phone) #historyPage .history-source-panel .control-row:nth-child(2) {
        grid-column: 2;
        grid-row: 1 / 3;
        align-self: start;
    }

    body.fh-workspace-v2:not(.fh-phone) #historyPage #historyAvailability {
        grid-column: 1 / -1;
        font-size: 12px;
        line-height: 1.4;
    }

    body.fh-workspace-v2:not(.fh-phone) #historyPage .history-ignition-select-shell {
        grid-template-columns: minmax(0, 1fr) 8px;
        gap: 6px;
    }

    body.fh-workspace-v2:not(.fh-phone) #historyPage .history-ignition-indicator {
        width: 8px;
        height: 8px;
        border: 0;
        background: transparent;
    }

    body.fh-workspace-v2:not(.fh-phone) #historyPage .history-period-panel .history-controls-grid .control-row {
        min-width: 0;
    }

    body.fh-workspace-v2:not(.fh-phone) #historyPage .history-actions-panel {
        display: block !important;
        grid-column: 1 / -1;
        grid-row: 2;
        min-width: 0;
        min-height: 0 !important;
        height: auto !important;
        flex: initial !important;
    }

    body.fh-workspace-v2:not(.fh-phone) #historyPage .history-actions-panel .history-control-body {
        display: grid !important;
        grid-template-columns: auto minmax(0, 1fr);
        align-items: center;
        gap: 14px !important;
        padding: 10px 14px !important;
    }

    body.fh-workspace-v2:not(.fh-phone) #historyPage .history-actions-panel .history-controls-actions {
        display: flex !important;
        flex-wrap: wrap;
        grid-template-columns: none !important;
        grid-template-rows: none !important;
        gap: 8px !important;
        height: auto !important;
        margin: 0;
    }

    body.fh-workspace-v2:not(.fh-phone) #historyPage .history-actions-panel .history-controls-actions::before {
        content: none !important;
    }

    body.fh-workspace-v2:not(.fh-phone) #historyPage .history-actions-panel .history-controls-actions button,
    body.fh-workspace-v2:not(.fh-phone) #historyPage #loadHistoryBtn {
        width: auto !important;
        min-height: 34px;
        height: 34px;
        grid-column: auto !important;
        padding-inline: 12px;
        font-size: 12px;
    }

    body.fh-workspace-v2:not(.fh-phone) #historyPage .history-status-bar {
        display: flex !important;
        flex-direction: row !important;
        flex-wrap: wrap;
        justify-content: flex-end;
        gap: 4px 14px;
        min-width: 0;
        min-height: 0 !important;
        height: auto !important;
        padding: 0 !important;
        font-size: 12px;
    }

    body.fh-workspace-v2:not(.fh-phone) #historyPage .history-status-bar .status-line {
        min-width: 0;
        font-size: 12px;
        line-height: 1.4;
    }

    body.fh-workspace-v2:not(.fh-phone) #historyPage .history-routes-panel {
        grid-column: 1;
        grid-row: 3 / 5;
        min-width: 0;
        min-height: 360px !important;
        height: auto !important;
        max-height: 600px !important;
        flex: initial !important;
        overflow: hidden;
    }

    body.fh-workspace-v2:not(.fh-phone) #historyPage .history-routes-body {
        min-height: 0;
        overflow: auto !important;
        padding: 8px 14px 14px !important;
    }

    body.fh-workspace-v2:not(.fh-phone) #historyPage .history-routes-body .route-table-wrap {
        min-height: 87px;
        max-height: 470px;
        overflow: auto;
    }

    body.fh-workspace-v2:not(.fh-phone) #historyPage .history-map-stack {
        grid-column: 2;
        grid-row: 3 !important;
        display: grid !important;
        grid-template-rows: auto minmax(360px, 1fr) !important;
        align-self: stretch;
        min-width: 0;
        min-height: 360px;
        height: auto !important;
        max-height: none !important;
        overflow: visible;
    }

    body.fh-workspace-v2:not(.fh-phone) #historyPage .history-summary-panel {
        grid-row: 1;
        min-width: 0;
        min-height: 78px;
        height: auto !important;
        max-height: none !important;
        overflow: visible;
    }

    /* Reserve both the loaded summary and map, not only the map's minimum. */
    body.fh-workspace-v2:not(.fh-phone) #historyPage.page-section.active:not(.history-is-empty) {
        grid-template-rows: max-content max-content minmax(448px, max-content) max-content max-content !important;
    }

    body.fh-workspace-v2:not(.fh-phone) #historyPage:not(.history-is-empty) .history-map-stack {
        min-height: 448px !important;
    }

    body.fh-workspace-v2:not(.fh-phone) #historyPage #historySummary .metric-value {
        font-size: 14px !important;
        line-height: 1.3;
        white-space: normal;
        overflow: visible;
        text-overflow: clip;
    }

    body.fh-workspace-v2:not(.fh-phone) #historyPage .history-map-panel:not(:fullscreen):not(.history-map-fallback-fullscreen) {
        grid-row: 2;
        min-width: 0;
        min-height: 360px;
        height: auto !important;
        max-height: none !important;
    }

    body.fh-workspace-v2:not(.fh-phone) #historyPage .history-map-panel:not(:fullscreen):not(.history-map-fallback-fullscreen) .map-wrap,
    body.fh-workspace-v2:not(.fh-phone) #historyPage .history-map-panel:not(:fullscreen):not(.history-map-fallback-fullscreen) .map-frame,
    body.fh-workspace-v2:not(.fh-phone) #historyPage .history-map-panel:not(:fullscreen):not(.history-map-fallback-fullscreen) #historyMap {
        min-height: 320px;
        height: 100%;
    }

    body.fh-workspace-v2:not(.fh-phone) #historyPage .history-graphs-panel:not(:fullscreen):not(.history-graphs-fallback-fullscreen-v144) {
        display: block !important;
        overflow: visible !important;
        grid-column: 2;
        grid-row: 4 !important;
        min-width: 0;
        min-height: 0;
        height: auto !important;
        max-height: none !important;
        flex: initial !important;
    }

    body.fh-workspace-v2:not(.fh-phone) #historyPage .history-graphs-panel .panel-body {
        height: auto !important;
        min-height: 0;
        overflow: visible;
    }

    body.fh-workspace-v2:not(.fh-phone) #historyPage .history-graphs-panel:not(:fullscreen):not(.history-graphs-fallback-fullscreen-v144) .history-chart-stack {
        grid-template-rows: none !important;
        grid-auto-rows: minmax(160px, auto);
        align-content: start;
    }

    body.fh-workspace-v2:not(.fh-phone) #historyPage .history-graphs-panel:not(:fullscreen):not(.history-graphs-fallback-fullscreen-v144) .history-chart-frame {
        min-height: 160px;
        height: 160px;
    }

    body.fh-workspace-v2:not(.fh-phone) #historyPage .graph-selector-stack {
        overflow: visible;
        height: auto;
        align-self: start;
        padding: 12px;
        gap: 16px;
        font-size: 12px;
    }

    body.fh-workspace-v2:not(.fh-phone) #historyPage .history-graph-controls-block {
        grid-template-rows: none;
        gap: 8px;
    }

    body.fh-workspace-v2:not(.fh-phone) #historyPage .graph-selector-stack select {
        height: 32px;
        font-size: 12px;
    }

    body.fh-workspace-v2:not(.fh-phone) #historyPage .history-graph-controls-title {
        font-size: 11px;
    }

    body.fh-workspace-v2:not(.fh-phone) #historyPage .history-footer {
        grid-column: 1 / -1;
        grid-row: 5 !important;
        width: auto;
        min-width: 0;
        height: auto !important;
        min-height: 46px;
        margin: 0;
    }

    body.fh-workspace-v2:not(.fh-phone) #historyPage :is(.history-source-panel, .history-period-panel, .history-actions-panel, .history-routes-panel, .history-summary-panel, .history-map-panel, .history-graphs-panel) .panel-title,
    body.fh-workspace-v2:not(.fh-phone) #historyPage .history-controls-grid label,
    body.fh-workspace-v2:not(.fh-phone) #historyPage .history-routes-body label {
        font-size: 12px !important;
    }

    body.fh-workspace-v2:not(.fh-phone) #historyPage .history-controls-grid select,
    body.fh-workspace-v2:not(.fh-phone) #historyPage .history-period-picker,
    body.fh-workspace-v2:not(.fh-phone) #historyPage .history-routes-body select {
        min-height: 34px !important;
        height: 34px !important;
        font-size: 12px !important;
    }

    body.fh-workspace-v2:not(.fh-phone) #historyPage .history-period-preset-row {
        display: flex !important;
        flex-direction: column;
        align-items: stretch !important;
    }

    body.fh-workspace-v2:not(.fh-phone) #historyPage .history-control-body {
        height: auto !important;
    }
}
