/* Tune each text role separately. The approved material panel keeps its own sizes. */

/* Navigation and page chrome: keep the brand, main headings and nav icons. */
.workspace small,.nav-label,.nav-count,.user small,#current-user-role,
.brand-en,.connection,.page-footer{font-size:calc(11px * var(--font-scale,1))}
.sidebar-tip strong,.sidebar-tip p,.sidebar-tip a,.user,#current-user-info,
.breadcrumb,.breadcrumb strong,.global-search{font-size:calc(12px * var(--font-scale,1))}
.sidebar-tip p{line-height:1.85}
.nav-count{min-width:24px;padding:0 4px}
.heading-eyebrow{font-size:calc(11px * var(--font-scale,1))}
.page-heading p{font-size:calc(12px * var(--font-scale,1));line-height:1.8}
kbd{font-size:calc(11px * var(--font-scale,1))}
.global-search .icon{width:16px;height:16px}
.page-footer{flex-wrap:wrap;gap:6px 18px;line-height:1.7}

/* Controls: the material table's buttons, badges and pagination are excluded. */
.button:not(:where(.material-list-panel *)),
.page-heading .heading-actions .button,.tab,.search-input input,
.material-type-filter .qw-dropdown-trigger{font-size:calc(12px * var(--font-scale,1))}
.button.small:not(:where(.material-list-panel *)),
.button.text:not(:where(.material-list-panel *)){font-size:calc(11.5px * var(--font-scale,1))}
.tab span,.badge:not(:where(.material-list-panel *)){font-size:calc(10.5px * var(--font-scale,1))}
.button .icon:not(:where(.material-list-panel *)),
.page-heading .heading-actions .button .icon{width:16px;height:16px}
.badge .icon:not(:where(.material-list-panel *)){width:12px;height:12px}
.icon-button .icon:not(:where(.material-list-panel *)){width:16px;height:16px}
.search-input>.icon{width:16px;height:16px}
.link:not(:where(.material-list-panel *)){font-size:calc(12px * var(--font-scale,1))}
.link .icon:not(:where(.material-list-panel *)){width:14px;height:14px}
.materials-stat{font-size:calc(12px * var(--font-scale,1))}
.materials-stat strong{font-size:calc(13px * var(--font-scale,1))}

/* Workbench: clearer summaries and quieter headline/number proportions. */
.hero h2{font-size:calc(24px * var(--font-scale,1))}
.hero-label{font-size:calc(10px * var(--font-scale,1))}
.hero p,.stat-top{font-size:calc(12px * var(--font-scale,1))}
.hero-chips{font-size:calc(11px * var(--font-scale,1));flex-wrap:wrap;gap:8px 16px}
.hero-chips .icon{width:14px;height:14px}
.stat-value{font-size:calc(28px * var(--font-scale,1))}
.stat-value small,.stat-bottom{font-size:calc(11px * var(--font-scale,1))}
.stat-bottom{line-height:1.7;flex-wrap:wrap}
.stat-bottom .icon{width:13px;height:13px}
.section-title h2{font-size:calc(16px * var(--font-scale,1))}
.section-title p,.section-title .count,.panel-caption{font-size:calc(11px * var(--font-scale,1))}
.section-title .icon{width:16px;height:16px}
.panel-heading h2{font-size:calc(14px * var(--font-scale,1))}
.low-item strong,.quick-link,.activity-info strong{font-size:calc(12px * var(--font-scale,1))}
.low-item small,.low-item-bottom,.alert-note,.activity-info small,.activity-time{font-size:calc(11px * var(--font-scale,1))}
.quick-link>span .icon,.activity-icon .icon{width:16px;height:16px}
.quick-link>.icon{width:14px;height:14px}
.activity-time{flex-shrink:0}
.activity-info{flex:1}

/* Product cards: distinguish the name from category, status and capacity. */
.product-card h3{font-size:calc(14px * var(--font-scale,1));line-height:1.6}
.product-sku{font-size:calc(10px * var(--font-scale,1))}
.product-category,.product-meta,.product-card-footer{font-size:calc(11px * var(--font-scale,1))}
.product-category{color:var(--muted)}
.product-meta{flex-wrap:wrap;gap:6px 8px}
.product-card-footer{flex-wrap:wrap;gap:8px;line-height:1.7}
.product-card-footer strong,.product-card-footer .button{font-size:calc(12px * var(--font-scale,1))}
.product-card-footer .icon{width:14px;height:14px}

/* Other data tables and pagination; inventory keeps its approved 1.1x scale. */
table:not(:where(.material-list-panel *)){font-size:calc(12px * var(--font-scale,1))}
th:not(:where(.material-list-panel *)){font-size:calc(11px * var(--font-scale,1))}
.stock-number:not(:where(.material-list-panel *)){font-size:calc(14px * var(--font-scale,1))}
.stock-unit:not(:where(.material-list-panel *)),
.material-cell small:not(:where(.material-list-panel *)),.material-reference{font-size:calc(11px * var(--font-scale,1))}
.material-cell strong:not(:where(.material-list-panel *)),
.material-name:not(:where(.material-list-panel *)){font-size:calc(12px * var(--font-scale,1))}
.material-cell .icon:not(:where(.material-list-panel *)){width:17px;height:17px}
.table-footer:not(:where(.material-list-panel *)),.list-pagination:not(:where(.material-list-panel *)),
.page-size-control .qw-dropdown-trigger:not(:where(.material-list-panel *)),
.page-button:not(:where(.material-list-panel *)){font-size:calc(12px * var(--font-scale,1))}
.pagination-summary>span:not(:where(.material-list-panel *)),
.pagination-position:not(:where(.material-list-panel *)){font-size:calc(11px * var(--font-scale,1))}

/* Form fields and dialogs: readable labels, helpful notes and roomy controls. */
.form-label,.bom-heading strong{font-size:calc(12px * var(--font-scale,1))}
.field input,.field select,.field textarea,.login-card .field input{font-size:calc(13px * var(--font-scale,1))}
.field input,.field select{padding-block:8px;min-height:calc(36px * var(--font-scale,1))}
.field small,.bom-heading small,.bom-note,.modal-header p,.confirm-hint,
.material-detail-grid>div>span:first-child{font-size:calc(11px * var(--font-scale,1));color:var(--muted);line-height:1.75}
.bom-row input,.bom-row select,.bom-row .qw-dropdown-trigger{font-size:calc(12px * var(--font-scale,1))}
.bom-row input,.bom-row select,.bom-row .qw-dropdown-trigger{min-height:calc(34px * var(--font-scale,1))}
.modal-header h2{font-size:calc(18px * var(--font-scale,1))}
.form-error{font-size:calc(12px * var(--font-scale,1));line-height:1.75}
.detail-description,.detail-capacity,.detail-hero p,.plan-product,
.planner-info,.plan-footer p,.production-note,.info-note{font-size:calc(12px * var(--font-scale,1))}
.detail-description{line-height:1.9}
.plan-product strong{font-size:calc(13px * var(--font-scale,1))}
.result-header p{font-size:calc(12px * var(--font-scale,1))}
.planner-info .icon,.production-note .icon,.info-note>.icon{width:15px;height:15px}
.empty p{font-size:calc(12px * var(--font-scale,1));line-height:1.8}
.empty-inline:not(:where(.material-list-panel *)),.results-count{font-size:calc(11px * var(--font-scale,1))}
.help-content{font-size:calc(13px * var(--font-scale,1))}
.help-content h3{font-size:calc(14px * var(--font-scale,1))}
.search-result{font-size:calc(13px * var(--font-scale,1))}
.search-result small,.search-result>span:last-child{font-size:calc(11px * var(--font-scale,1))}

/* Picker menus in forms/filters; the material page-size popup stays unchanged. */
.qw-dropdown-trigger:not(:where(.material-list-panel *)){font-size:calc(13px * var(--font-scale,1))}
.material-type-filter .qw-dropdown-trigger,.bom-row .qw-dropdown-trigger{font-size:calc(12px * var(--font-scale,1))}
.qw-dropdown-option:not(:where(.material-list-dropdown *)),
.qw-dropdown-search input:not(:where(.material-list-dropdown *)){font-size:calc(12px * var(--font-scale,1))}
.qw-dropdown-empty:not(:where(.material-list-dropdown *)),
.qw-dropdown-error:not(:where(.material-list-panel *)){font-size:calc(11px * var(--font-scale,1))}
.page-size-control .qw-dropdown-trigger:not(:where(.material-list-panel *)){font-size:calc(12px * var(--font-scale,1))}

/* Import review: rows are primary information; filenames and diffs are secondary. */
.import-upload p,.import-preview-summary,.import-selection-bar label,
.import-file-status,.import-format strong{font-size:calc(12px * var(--font-scale,1))}
.import-format,.import-source-file,.import-selection-bar>span,.import-preview-note,
.import-info-changes,.import-row-caption,.import-row-error{font-size:calc(11px * var(--font-scale,1));line-height:1.8}
.import-preview-scroll table{font-size:calc(12px * var(--font-scale,1))}
.import-preview-scroll th{font-size:calc(11px * var(--font-scale,1))}
.import-quantity{font-size:calc(13px * var(--font-scale,1))}
.import-preview-note,.import-row-caption{color:var(--muted)}
.import-modal .modal-footer .button{font-size:calc(12px * var(--font-scale,1))}
.package-selection-bar,.package-product-description,.package-product-details,
.package-missing-notice{font-size:calc(12px * var(--font-scale,1))}
.package-caption,.package-note,.package-product-heading small,.package-product-metadata,
.package-match,.package-missing,.package-unit-warnings,.package-attachment-names>span{font-size:calc(11px * var(--font-scale,1))}
.package-product-heading strong{font-size:calc(14px * var(--font-scale,1))}
.package-attachment-names .icon{width:15px;height:15px}
.attachment-name{font-size:calc(13px * var(--font-scale,1))}
.attachment-info small,.attachment-count,.optional-label{font-size:calc(11px * var(--font-scale,1))}
.attachments-empty,.attachment-save-status{font-size:calc(12px * var(--font-scale,1))}

/* Settings, accounts and login: preserve heading hierarchy, improve small copy. */
.settings-section>p,.theme-option strong,.settings-preview-card p{font-size:calc(12px * var(--font-scale,1))}
.settings-toggle strong{font-size:calc(13px * var(--font-scale,1))}
.settings-toggle small,.settings-preview>p,.settings-local-note{font-size:calc(11px * var(--font-scale,1));color:var(--muted);line-height:1.8}
.settings-eyebrow,.login-eyebrow{font-size:calc(10px * var(--font-scale,1))}
.settings-local-note .icon{width:16px;height:16px}
.login-intro h1{font-size:calc(32px * var(--font-scale,1));line-height:1.6}
.login-intro p{font-size:calc(13px * var(--font-scale,1))}
.login-intro small,.login-note{font-size:calc(11px * var(--font-scale,1))}
.login-card>p,.account-summary p,.permission-chips>span{font-size:calc(12px * var(--font-scale,1))}
.login-submit{font-size:calc(13px * var(--font-scale,1))}
.login-note .icon,.permission-chips .icon{width:14px;height:14px}
.account-hint,.level-tag,.root-label,.role-card p,.role-card strong span{font-size:calc(11px * var(--font-scale,1));line-height:1.8}
.role-card strong{font-size:calc(13px * var(--font-scale,1))}

/* Keep the hierarchy on small screens without shrinking metadata to tiny text. */
@media(max-width:760px){
  .hero h2{font-size:calc(20px * var(--font-scale,1))}
  .hero-chips{gap:8px 12px}
  .product-card h3{font-size:calc(13px * var(--font-scale,1))}
  .login-intro h1{font-size:calc(25px * var(--font-scale,1))}
  .global-search{width:38px}
  .theme-options{gap:10px}
}
@media(max-width:440px){
  .hero h2{font-size:calc(18px * var(--font-scale,1))}
  .hero-content{max-width:100%}
  .hero-art{opacity:.2}
  .login-intro h1{font-size:calc(23px * var(--font-scale,1))}
  .page-heading{flex-wrap:wrap;gap:12px}
  .page-heading .heading-actions{max-width:100%}
  .activity-item{gap:8px;flex-wrap:wrap}
  .activity-info{flex-basis:calc(100% - 40px)}
  .activity-time{margin-left:40px}
}