@import url('https://fonts.googleapis.com/css2?family=IBM+Plex+Sans+Thai:wght@300;400;500;600;700&display=swap');

:root {
    --app-font-family: 'IBM Plex Sans Thai', Tahoma, Arial, sans-serif;
}

html,
body,
button,
input,
select,
textarea,
optgroup,
table,
h1, h2, h3, h4, h5, h6,
.font-sans,
.custom-dropdown,
.price-tag,
.brand strong,
.product-photo strong,
.price,
.sample-xl,
.sample-en {
    font-family: var(--app-font-family) !important;
}

/* Screen scale uses rem so the storefront's A-/A/A+ controls still work. */
@media screen {
    body {
        font-size: 1rem;
        line-height: 1.65;
    }

    h1 { font-size: clamp(1.5rem, 1.15rem + 1vw, 2rem) !important; }
    h2 { font-size: clamp(1.25rem, 1.1rem + .5vw, 1.5rem) !important; }
    h3 { font-size: clamp(1.125rem, 1rem + .4vw, 1.25rem) !important; }
    h1, h2, h3 { line-height: 1.4 !important; }
    h4, h5, h6 { font-size: 1rem; line-height: 1.5; }

    label, button, .button, table, td {
        font-size: .875rem;
        line-height: 1.6;
    }
    input, select, textarea { font-size: 1rem !important; line-height: 1.5; }
    th { font-size: .8125rem; line-height: 1.5; }
    small { font-size: .75rem; line-height: 1.5; }

    /* Dense dashboard labels previously fell as low as 9–11px. */
    .workspace .sidebar-bottom,
    .sidebar .nav-label,
    .sidebar .sidebar-bottom,
    .workspace .eyebrow,
    .workspace .metric-foot,
    .workspace .comparison,
    .workspace .pill,
    .workspace td small,
    .workspace .date-cell,
    .workspace footer {
        font-size: .75rem;
        line-height: 1.6;
    }
    .workspace .topbar,
    .workspace .page-heading p,
    .workspace .section-heading p,
    .workspace .metric-label,
    .workspace .filter-form label,
    .workspace .quick-filters,
    .workspace .result-heading,
    .workspace .pagination,
    .workspace .chart-table,
    .workspace .reset {
        font-size: .8125rem;
        line-height: 1.6;
    }
    .sidebar nav a,
    .workspace .button,
    .workspace table,
    .workspace td,
    .workspace td strong {
        font-size: .875rem;
    }
    .workspace th { font-size: .8125rem; }
    .workspace .metric-value {
        font-size: clamp(1.5rem, 1rem + 1.3vw, 2rem);
        line-height: 1.35;
    }
    .workspace .metric-value small { font-size: .8125rem; }

    @media (max-width: 520px) {
        .workspace .filter-form input:not([type=hidden]),
        .workspace .filter-form select { min-height: 44px; }
        .workspace .actions { flex-wrap: wrap; }
        .workspace .metric-label { flex-wrap: wrap; }
    }
}