/* analytics - responsive fixes for this module only. Loaded after css/shared/responsive.css
   on every page in the area. See DOCS/Showcase-Mobile.md. */

@media (max-width: 1023.98px) {

    /* Field Scorecard: the card clips its own table (overflow: hidden). Let the
       tree table scroll sideways inside the card instead. */
    .scorecard-card {
        overflow-x: auto;
    }

    .scorecard-table {
        min-width: 720px;
    }

    /* Quoting Analytics: the filter panel rows do not wrap; the inline
       "flex: 2" on the entity picker needs the hammer. */
    .filter-panel .filter-row {
        flex-wrap: wrap;
    }

    .filter-panel .filter-row .filter-group {
        flex: 1 1 calc(50% - 16px) !important;
        min-width: 0;
    }

    /* Performance pages (Parts, Labor, Expense, Equipment, Subcontractor):
       Bootstrap tables inside a plain padded div, and a sub-tab strip that
       clips. Scroll both sideways. */
    .performance-sub-tabs {
        overflow-x: auto;
        scrollbar-width: thin;
    }

    .section-card > div[style*="padding: 0 20px 20px"] {
        overflow-x: auto;
    }

    .section-card table.table {
        min-width: 760px;
    }

    /* Quoting Snapshot: same clipping card as the scorecard, and a filter bar
       whose dropdown row does not wrap. */
    .snapshot-filter-bar,
    .snapshot-filter-dropdowns {
        flex-wrap: wrap;
    }

    .snapshot-filter-dropdowns .filter-group {
        flex: 1 1 calc(50% - 16px);
        min-width: 0;
    }

    .snapshot-card {
        overflow-x: auto;
    }

    .snapshot-table {
        min-width: 900px;
    }
}

@media (max-width: 639.98px) {

    .filter-panel .filter-row .filter-group,
    .snapshot-filter-dropdowns .filter-group {
        flex: 1 1 100% !important;
    }

    /* Tech Dashboard: the page's own 900px rule leaves eight tiles two-up,
       which overflows a phone. One column under 640px. */
    .td-tiles {
        grid-template-columns: 1fr !important;
    }
}
