/* VARIO typography system */
:root {
    --vario-font-ui: Inter, "Segoe UI", Arial, sans-serif;
    --vario-font-display: "Plus Jakarta Sans", Inter, "Segoe UI", Arial, sans-serif;
}

html,
body,
.vario-win-shell {
    font-family: var(--vario-font-ui) !important;
}

.vario-win-shell .nav-link,
.vario-win-shell .nav-text,
.vario-win-shell .nav-section {
    font-family: var(--vario-font-ui) !important;
    font-weight: 500 !important;
}

.vario-login-display,
.vario-topbar-search input {
    font-family: var(--vario-font-ui) !important;
    font-size: 15px !important;
    font-weight: 500 !important;
}

.vario-win-shell .nav-link,
.vario-win-shell .nav-text {
    font-size: 13px !important;
}

.vario-win-shell .nav-section {
    font-size: 10px !important;
    font-weight: 600 !important;
}

.vario-win-shell .nav-code {
    font-family: var(--vario-font-ui) !important;
    font-size: 10px !important;
    font-weight: 600 !important;
}

.vario-order-action-header h1,
.vario-dashboard-header h1,
.vario-page-title h1,
.vario-hero h1 {
    font-family: var(--vario-font-display) !important;
    font-size: 32px !important;
    font-weight: 700 !important;
    line-height: 1.12 !important;
}

.vario-items-preview-title h2,
.vario-item-visual-name strong,
.vario-document-list strong,
.vario-warehouse-document-card strong {
    font-family: var(--vario-font-display) !important;
    font-size: 24px !important;
    font-weight: 600 !important;
    line-height: 1.16 !important;
}

.vario-document-list strong,
.vario-warehouse-document-card strong {
    font-size: 15px !important;
}

.vario-dashboard-card h2,
.vario-quick-actions-card h2,
.vario-erp-section-header h2,
.vario-panel h2,
.vario-profile-subtitle,
.vario-items-preview-section h3,
.vario-item-section-title {
    font-family: var(--vario-font-ui) !important;
    font-size: 18px !important;
    font-weight: 600 !important;
    line-height: 1.25 !important;
}

.vario-dashboard-card.span-2 h2,
.vario-win-details-title {
    font-size: 20px !important;
}

.vario-win-details-row,
.vario-items-preview-fields dt,
.vario-items-preview-fields dd,
.vario-erp-empty,
.vario-link-list,
.vario-alert-list,
.vario-task-list {
    font-family: var(--vario-font-ui) !important;
    font-size: 14px !important;
    font-weight: 400 !important;
}

/*
 * Form controls keep the global typography fallback, but their effective
 * metrics may now be supplied by a shared form contract.  This avoids the
 * former unconditional 14px/400 rule winning over compact document forms.
 */
.form-label,
.form-control,
.form-select {
    font-family: var(--vario-font-ui) !important;
    font-size: var(--vario-form-control-font-size, 14px);
    font-weight: var(--vario-form-control-font-weight, 400);
    line-height: var(--vario-form-control-line-height, normal);
}

.vario-moden-table,
.vario-moden-table th,
.vario-moden-table td,
.vario-admin-table {
    font-family: var(--vario-font-ui) !important;
    font-size: 13px !important;
    font-weight: 400 !important;
}

.vario-moden-table th {
    font-weight: 600 !important;
}

.vario-data-grid {
    margin-bottom: 0;
    table-layout: fixed;
    color: #263244;
    background: #10141b;
    font-family: var(--vario-font-ui) !important;
    font-size: 13px !important;
    font-weight: 400 !important;
}

.vario-data-grid th {
    height: 22px;
    max-height: 22px;
    padding: 0.22rem 0.36rem;
    overflow: hidden;
    border-color: #293241;
    border-right: 1px solid color-mix(in srgb, var(--vario-border-soft) 76%, var(--vario-border-strong) 24%);
    font-family: var(--vario-font-ui) !important;
    font-size: 13px !important;
    font-weight: 600 !important;
    text-overflow: ellipsis;
    vertical-align: middle;
    white-space: nowrap;
}

.vario-data-grid td {
    height: 22px;
    max-height: 22px;
    padding: 0.22rem 0.36rem;
    overflow: hidden;
    border-color: #edf1f6 !important;
    border-right: 1px solid color-mix(in srgb, var(--vario-border-soft) 76%, var(--vario-border-strong) 24%);
    font-family: var(--vario-font-ui) !important;
    font-size: 13px !important;
    font-weight: 400 !important;
    text-overflow: ellipsis;
    vertical-align: middle;
    white-space: nowrap;
}

.vario-admin-table {
    margin-bottom: 0;
}

.vario-admin-table th {
    padding: 0.38rem 0.48rem;
    border-bottom: 1px solid var(--vario-border-soft);
    background: #f8fafc;
    color: var(--vario-muted);
    font-family: var(--vario-font-ui) !important;
    font-size: 13px !important;
    font-weight: 600 !important;
    text-transform: uppercase;
    vertical-align: middle;
}

.vario-admin-table td {
    padding: 0.38rem 0.48rem;
    font-family: var(--vario-font-ui) !important;
    font-size: 13px !important;
    font-weight: 400 !important;
    vertical-align: middle;
}

.vario-kpi-card strong,
.vario-summary-number,
.vario-items-preview-fields dd:has(+ *),
.vario-item-visual-price strong,
.vario-document-list b,
.vario-product-bars b,
.vario-order-action-header .vario-order-status+strong {
    font-family: var(--vario-font-ui) !important;
    font-size: 24px !important;
    font-weight: 600 !important;
    line-height: 1.12 !important;
}

.vario-kpi-card strong {
    font-size: 28px !important;
}

.vario-order-actions .btn,
.vario-quick-actions-card a,
.vario-card-tabs button,
.vario-status-pill,
.vario-pill {
    font-family: var(--vario-font-ui) !important;
    font-size: 14px !important;
    font-weight: 500 !important;
}