/*
 * Readable typography for operational screens.
 *
 * Dense operational views used several app-specific 8-11px declarations.
 * On desktop and tablet those values made important stock and dispatch data
 * unnecessarily difficult to read despite ample available space.  This layer
 * deliberately runs after app styles, only outside print and mobile layouts.
 */

@media screen and (min-width: 768px) {
    :root {
        --font-size-xs: 13px;
        --font-size-sm: 14px;
        --font-size-md: 15px;
        --font-size-lg: 17px;
        --font-size-xl: 20px;
        --font-size-2xl: 26px;
        --font-size-3xl: 30px;
    }
}

@media screen and (min-width: 900px) {
    .page-heading,
    .page-title {
        font-size: clamp(26px, 1.9vw, 32px);
    }

    .page-desc,
    .page-subtitle,
    .section-subtitle,
    .section-description,
    .page-card-subtitle,
    .glass-card-subtitle {
        font-size: 14px;
        line-height: 1.5;
    }

    /* Dashboard */
    .od-period-form label span,
    .od-period-presets button,
    .od-live,
    .od-updated,
    .od-kpi__body small,
    .od-kpi__body p,
    .od-panel__note,
    .od-pipeline__step small,
    .od-pipeline__number,
    .od-chart-legend {
        font-size: 11px;
    }

    .od-period-form input,
    .od-filter-button {
        font-size: 12px;
    }

    .od-kpi__body > span {
        font-size: 13px;
    }

    .od-panel h2 {
        font-size: 18px;
    }

    .od-pipeline__step div span {
        font-size: 12px;
    }

    /* Tổng kho / inventory workspace */
    .itm-kicker,
    .itm-kpis article span:not(.itm-kpi-icon),
    .itm-kpis article small,
    .itm-warehouse-strip span,
    .itm-warehouse-strip small,
    .itm-panel-header p,
    .itm-only-alerts {
        font-size: 11px;
    }

    .itm-health-main small,
    .itm-health-meta,
    .itm-search input {
        font-size: 12px;
    }

    .itm-health-main strong,
    .itm-panel-header h2 {
        font-size: 18px;
    }

    .itm-kpis article strong {
        font-size: 26px;
    }

    .itm-warehouse-strip strong {
        font-size: 22px;
    }

    .itm-excel-table {
        font-size: 12px;
    }

    .itm-excel-table thead th {
        font-size: 11px;
    }

    /* Trung tâm điều phối */
    .dc-kpi-card span {
        font-size: 13px;
    }

    .dc-kpi-card small,
    .dc-kpi-card em,
    .dc-customer-row span,
    .dc-customer-row b,
    .dc-order-info-cell span,
    .dc-column-labels small,
    .dc-product-cell small {
        font-size: 11px;
    }

    .dc-search input,
    .dc-toolbar select,
    .dc-toolbar-btn,
    .dc-table,
    .dc-type-row span,
    .dc-product-cell strong,
    .dc-num,
    .dc-action-btn,
    .dc-row-status,
    .dc-purchase-summary-table,
    .dc-summary-product strong,
    .dc-purchase-summary-footer span {
        font-size: 12px;
    }

    .dc-column-groups th,
    .dc-customer-row strong,
    .dc-order-info-cell strong {
        font-size: 13px;
    }

    .dc-column-labels th,
    .dc-purchase-summary-stats span,
    .dc-purchase-summary-head p,
    .dc-create-bulk-purchase-btn,
    .dc-purchase-summary-table th,
    .dc-summary-type,
    .dc-related-orders summary,
    .dc-related-orders span,
    .dc-summary-quantity small {
        font-size: 11px;
    }

    .dc-purchase-summary-head h2 {
        font-size: 18px;
    }

    .dc-purchase-summary-stats strong,
    .dc-purchase-summary-footer strong {
        font-size: 19px;
    }
}

@media print {
    /* Print forms keep their own calibrated typography. */
    .page-heading,
    .page-title {
        font-size: inherit;
    }
}