/**
 * HYDRA admin typography — enterprise scale (body.use-new-ui only).
 * Unlayered; load after layout.css. Visual only.
 */

body.use-new-ui {
  font-size: var(--fs-md);
  line-height: var(--lh-normal);
}

/* Dashboard — slightly larger hero KPI only */
body.use-new-ui.route-dashboard {
  --type-section-title: 22px;
  --type-kpi-value: 24px;
  --type-kpi-value-sm: var(--type-admin-value);
  --hydra-kpi-value: var(--type-kpi-value);
}

/* —— Section titles —— */
body.use-new-ui .section-title,
body.use-new-ui.route-dashboard .dashboard-layout .daily-review-head h2,
body.use-new-ui.route-dashboard .app-layout .dashboard-layout .panel h3,
body.use-new-ui.route-dashboard .app-layout #hydraDashTopProducts > .panel h3,
body.use-new-ui.route-dashboard .app-layout #hydraDashProfitPanels > .panel h3,
body.use-new-ui.route-dashboard .dashboard-layout .compact-list-head h3,
body.use-new-ui .owner-section-head .section-title {
  font-size: var(--type-section-title);
  font-weight: 700;
  letter-spacing: -0.02em;
  line-height: var(--lh-tight);
  color: var(--text-primary, #0f172a);
}

body.use-new-ui .page-title-text {
  font-size: var(--type-topbar-title, var(--fs-2xl));
  font-weight: 700;
  letter-spacing: -0.02em;
  line-height: var(--lh-tight);
}

body.use-new-ui.route-dashboard .page-title-text {
  font-size: var(--type-topbar-title, var(--fs-2xl));
}

body.use-new-ui .topbar-search,
body.use-new-ui .topbar-search.input-md,
body.use-new-ui #topQuickSearch {
  font-size: var(--type-topbar-search, var(--fs-sm));
  line-height: var(--lh-tight);
}

/* —— KPI labels —— */
body.use-new-ui #hydraDashKpi .premium-kpi-head .card-title,
body.use-new-ui .dashboard-layout .premium-kpi-head .card-title,
body.use-new-ui .dashboard-layout .compact-list-head .card-title,
body.use-new-ui .dashboard-layout .panel .card-title {
  font-size: var(--type-kpi-label);
  font-weight: 700;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: var(--text-secondary, #5f6b7c);
  line-height: var(--lh-tight);
}

/* —— KPI numbers —— */
body.use-new-ui #hydraDashKpi .premium-kpi-card:not(.premium-kpi-card--secondary) .card-value,
body.use-new-ui .dashboard-layout .premium-kpi-card:not(.premium-kpi-card--secondary) .card-value {
  font-size: var(--type-kpi-value);
  font-weight: 800;
  line-height: 1.05;
  letter-spacing: -0.03em;
  color: var(--text-primary, #0f172a);
  font-variant-numeric: tabular-nums;
  font-feature-settings: "tnum";
}

body.use-new-ui #hydraDashKpi .premium-kpi-card--secondary .card-value,
body.use-new-ui .dashboard-layout .premium-kpi-card--secondary .card-value {
  font-size: var(--type-kpi-value-sm);
  font-weight: 800;
  line-height: 1.05;
  letter-spacing: -0.03em;
  color: var(--text-primary, #0f172a);
  font-variant-numeric: tabular-nums;
  font-feature-settings: "tnum";
}

/* —— Secondary stats (trend, footnotes) —— */
body.use-new-ui.route-dashboard .app-layout #hydraDashKpi .premium-kpi-foot .kpi-trend,
body.use-new-ui #hydraDashKpi .premium-kpi-foot .kpi-trend,
body.use-new-ui .dashboard-layout .kpi-trend,
body.use-new-ui .dashboard-layout .daily-review-sub,
body.use-new-ui .dashboard-layout .daily-review-metric .sub,
body.use-new-ui .dashboard-layout .daily-review-compare,
body.use-new-ui .dashboard-layout .daily-review-trend-row {
  font-size: var(--type-kpi-meta);
  font-weight: 500;
  color: var(--text-secondary, #5f6b7c);
  line-height: var(--lh-normal);
}

body.use-new-ui .dashboard-layout .daily-review-metric .lbl {
  font-size: var(--type-kpi-label);
  font-weight: 700;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: var(--text-secondary, #5f6b7c);
}

body.use-new-ui .dashboard-layout .daily-review-metric .val {
  font-size: var(--type-kpi-value-sm);
  font-weight: 800;
  line-height: 1.05;
  letter-spacing: -0.03em;
  color: var(--text-primary, #0f172a);
}

/* —— Tables —— */
body.use-new-ui .route-page thead th,
body.use-new-ui #modal thead th,
body.use-new-ui .data-table thead th {
  font-size: var(--type-table-head);
  font-weight: 700;
  letter-spacing: 0.05em;
  text-transform: uppercase;
}

body.use-new-ui .route-page tbody td,
body.use-new-ui #modal tbody td,
body.use-new-ui .data-table tbody td {
  font-size: var(--type-table-cell);
  font-weight: 500;
  line-height: var(--lh-table-dense, 1.35);
}

body.use-new-ui .route-page .money-col,
body.use-new-ui #modal .money-col {
  font-size: var(--type-table-cell);
  font-weight: 600;
  font-variant-numeric: tabular-nums;
  font-feature-settings: "tnum";
}

/* —— Filter / segment chips —— */
body.use-new-ui .orders-page .orders-desk-chip,
body.use-new-ui .segment-btn,
body.use-new-ui .dashboard-layout .segment-btn,
body.use-new-ui .chart-toggle-group .btn {
  font-size: var(--type-chip);
  font-weight: 600;
  line-height: var(--lh-tight);
}

/* —— Sidebar menu (typography only) —— */
body.use-new-ui .sidebar #menu .menu-item,
body.use-new-ui .sidebar .menu-item {
  font-size: var(--type-sidebar-menu);
  font-weight: 600;
  line-height: var(--lh-tight);
}

body.use-new-ui .sidebar-command-clock .sidebar-clock-time,
body.use-new-ui #sidebarClockHcm,
body.use-new-ui #sidebarClockTokyo {
  font-size: var(--type-sidebar-clock);
  font-weight: 700;
  line-height: var(--lh-tight);
  letter-spacing: -0.02em;
}

body.use-new-ui .sidebar-command-kicker,
body.use-new-ui .sidebar-command-foot,
body.use-new-ui .sidebar-command-foot-label,
body.use-new-ui .sidebar-command-foot-time,
body.use-new-ui .sidebar-mini-stat span {
  font-size: var(--type-sidebar-meta);
  line-height: var(--lh-normal);
}

body.use-new-ui .sidebar-mini-stat strong {
  font-size: var(--fs-sm);
  font-weight: 700;
}

/* —— Modal —— */
body.use-new-ui #modalForm .form-label,
body.use-new-ui .form-label,
body.use-new-ui #modal label:not(.notification-mute-label) {
  font-size: var(--type-modal-label);
  font-weight: 600;
  line-height: var(--lh-tight);
  color: var(--text-secondary, #5f6b7c);
}

body.use-new-ui #modal .panel h3,
body.use-new-ui #modal .modal-card h3,
body.use-new-ui #modal h4 {
  font-size: var(--type-modal-section);
  font-weight: 700;
  line-height: var(--lh-tight);
  letter-spacing: -0.01em;
  color: var(--text-primary, #0f172a);
}

body.use-new-ui #modalForm input,
body.use-new-ui #modalForm select,
body.use-new-ui #modalForm textarea {
  font-size: var(--type-modal-input, var(--fs-md));
  line-height: var(--lh-normal);
}

body.use-new-ui .dashboard-layout .owner-activity-main strong,
body.use-new-ui .dashboard-layout .activity-text strong {
  font-size: var(--fs-lg);
  font-weight: 650;
  line-height: 1.3;
  color: var(--text-primary, #0f172a);
}

body.use-new-ui .dashboard-layout .owner-activity-sub,
body.use-new-ui .dashboard-layout .activity-text small {
  font-size: var(--fs-md);
  color: var(--text-secondary, #5f6b7c);
}

body.use-new-ui .dashboard-layout .owner-activity-time {
  font-size: var(--fs-sm);
  color: var(--text-muted, #7b8797);
}

body.use-new-ui .dashboard-layout .owner-activity-empty {
  font-size: var(--fs-md);
}

body.use-new-ui .dashboard-layout .quick-chip span {
  font-size: var(--type-kpi-label);
}

body.use-new-ui .dashboard-layout .quick-chip strong {
  font-size: var(--fs-lg);
  font-weight: 800;
}

body.use-new-ui.route-dashboard .daily-review-head h2 {
  font-size: var(--type-section-title);
}

body.use-new-ui.route-dashboard .daily-review-metric .lbl {
  font-size: var(--type-kpi-label);
}

body.use-new-ui.route-dashboard .daily-review-metric .val {
  font-size: var(--type-kpi-value-sm);
}

body.use-new-ui.route-dashboard .daily-review-metric .sub,
body.use-new-ui.route-dashboard .daily-review-compare,
body.use-new-ui.route-dashboard .daily-review-trend-row,
body.use-new-ui.route-dashboard .daily-review-insights {
  font-size: var(--type-kpi-meta);
}

body.use-new-ui.route-dashboard .daily-review-badge {
  font-size: var(--fs-sm);
}

/* Dashboard KPI + tables — win vs table-safety / unified-visual-grammar / style.css */
@media (min-width: 769px) {
  body.use-new-ui.route-dashboard #hydraDashKpi .premium-kpi-head .card-title {
    font-size: var(--type-kpi-label) !important;
  }

  body.use-new-ui.route-dashboard #hydraDashKpi .premium-kpi-card:not(.premium-kpi-card--secondary) .card-value,
  body.use-new-ui.route-dashboard #hydraDashKpi .premium-kpi-card:not(.premium-kpi-card--secondary) .card-value .kpi-anim-inner {
    font-size: var(--type-kpi-value) !important;
    line-height: 1.05 !important;
    font-weight: 800 !important;
  }

  body.use-new-ui.route-dashboard #hydraDashKpi .premium-kpi-card--secondary .card-value,
  body.use-new-ui.route-dashboard #hydraDashKpi .premium-kpi-card--secondary .card-value .kpi-anim-inner {
    font-size: var(--type-kpi-value-sm) !important;
    line-height: 1.05 !important;
    font-weight: 800 !important;
  }

  body.use-new-ui.route-dashboard #hydraDashKpi .premium-kpi-foot,
  body.use-new-ui.route-dashboard #hydraDashKpi .premium-kpi-foot .kpi-trend {
    font-size: var(--type-kpi-meta) !important;
  }

  body.use-new-ui.route-dashboard .dashboard-layout .panel h3,
  body.use-new-ui.route-dashboard #hydraDashTopProducts > .panel h3,
  body.use-new-ui.route-dashboard #hydraDashProfitPanels > .panel h3 {
    font-size: var(--type-section-title) !important;
  }
}

/* =============================================================================
   Global admin typography — unified scale (một size nền + một size label)
   ============================================================================= */
@media (min-width: 769px) {
  /* Tables */
  body.use-new-ui .route-page thead th,
  body.use-new-ui .route-page .table-wrap thead th,
  body.use-new-ui .route-page table thead th,
  body.use-new-ui #modal thead th,
  body.use-new-ui .customers-page .customer-crm-table th {
    font-size: var(--type-admin-label) !important;
    min-height: 42px !important;
    padding: 10px 12px !important;
    line-height: 1.35 !important;
    font-weight: 700 !important;
  }

  body.use-new-ui .route-page tbody td,
  body.use-new-ui .route-page .table-wrap tbody td,
  body.use-new-ui .route-page table tbody td,
  body.use-new-ui #modal tbody td,
  body.use-new-ui .customers-page .customer-crm-table td {
    font-size: var(--type-admin-base) !important;
    min-height: 46px !important;
    padding: 10px 12px !important;
    line-height: 1.4 !important;
    font-weight: 500 !important;
  }

  body.use-new-ui .route-page table,
  body.use-new-ui .route-page .orders-table,
  body.use-new-ui .expenses-page .finance-expense-table {
    font-size: var(--type-admin-base) !important;
  }

  /* Cell innards — same base (chỉ khác màu/weight, không khác size) */
  body.use-new-ui .route-page tbody td a,
  body.use-new-ui .route-page tbody td .order-id-link,
  body.use-new-ui .route-page tbody td .customer-name-link,
  body.use-new-ui .route-page tbody td strong,
  body.use-new-ui .route-page tbody td select,
  body.use-new-ui .route-page tbody td input,
  body.use-new-ui .route-page tbody td .btn,
  body.use-new-ui .route-page .status,
  body.use-new-ui .route-page .cod-badge,
  body.use-new-ui .route-page .order-status-select,
  body.use-new-ui .route-page .customer-tier-badge,
  body.use-new-ui .route-page .badge,
  body.use-new-ui .route-page .chip {
    font-size: var(--type-admin-base) !important;
    line-height: 1.35 !important;
  }

  body.use-new-ui .route-page tbody td small,
  body.use-new-ui .route-page tbody td .customer-subtext,
  body.use-new-ui .route-page .muted,
  body.use-new-ui .route-page .finance-cell-note {
    font-size: var(--type-admin-label) !important;
    line-height: 1.35 !important;
  }

  /* Summary KPI cards — label nhỏ hơn 1 bậc, value nhấn nhẹ */
  body.use-new-ui .cards > .card .card-title,
  body.use-new-ui .orders-page .orders-summary-cards .card-title,
  body.use-new-ui .cod-page .cod-kpi-cards .card-title,
  body.use-new-ui .finance-kpi-label,
  body.use-new-ui .expenses-page .finance-kpi-label,
  body.use-new-ui .reports-tools-page .reports-kpi-label {
    font-size: var(--type-admin-label) !important;
    font-weight: 700 !important;
    letter-spacing: 0.06em !important;
  }

  body.use-new-ui .cards > .card .card-value,
  body.use-new-ui .orders-page .orders-summary-cards .card-value,
  body.use-new-ui .cod-page .cod-kpi-cards .card-value,
  body.use-new-ui .finance-kpi-value,
  body.use-new-ui .expenses-page .finance-kpi-value,
  body.use-new-ui .expenses-page .finance-kpi-card--hero-wide .finance-kpi-value,
  body.use-new-ui .data-check-page .cards .card-value {
    font-size: var(--type-admin-value) !important;
    font-weight: 700 !important;
    line-height: 1.15 !important;
    font-variant-numeric: tabular-nums !important;
  }

  /* Toolbar / filter — cùng base */
  body.use-new-ui .orders-page .orders-desk-chip,
  body.use-new-ui .route-page .segment-btn,
  body.use-new-ui .route-page .chart-toggle-group .btn,
  body.use-new-ui .inventory-page .inventory-tabs .btn,
  body.use-new-ui .route-page .toolbar .btn,
  body.use-new-ui .route-page input,
  body.use-new-ui .route-page select,
  body.use-new-ui .route-page textarea,
  body.use-new-ui .route-page .input-md,
  body.use-new-ui .expenses-page .finance-filter-input,
  body.use-new-ui .expenses-page .finance-btn-add,
  body.use-new-ui .expenses-page .finance-btn-view {
    font-size: var(--type-admin-base) !important;
  }

  /* Side panels — expenses, reports */
  body.use-new-ui .expenses-page .finance-panel-title,
  body.use-new-ui .expenses-page .finance-bd-title {
    font-size: var(--type-admin-base) !important;
    font-weight: 700 !important;
  }

  body.use-new-ui .expenses-page .finance-breakdown-inner,
  body.use-new-ui .expenses-page .finance-bd-line,
  body.use-new-ui .expenses-page .finance-bd-label,
  body.use-new-ui .expenses-page .finance-bd-value,
  body.use-new-ui .expenses-page .finance-bd-footnote {
    font-size: var(--type-admin-base) !important;
  }

  body.use-new-ui .expenses-page .finance-bd-section-label {
    font-size: var(--type-admin-label) !important;
    font-weight: 700 !important;
  }

  body.use-new-ui .reports-tools-page .reports-export-meta h4,
  body.use-new-ui .reports-tools-page .reports-export-meta p,
  body.use-new-ui .reports-tools-page .reports-export-foot,
  body.use-new-ui .reports-tools-page .reports-export-foot .export-status,
  body.use-new-ui .reports-tools-page .reports-export-foot .export-last {
    font-size: var(--type-admin-base) !important;
  }

  body.use-new-ui .reports-tools-page .reports-section-title,
  body.use-new-ui .reports-tools-page .reports-panel-title,
  body.use-new-ui .reports-tools-page .owner-section-head h3 {
    font-size: var(--type-admin-base) !important;
    font-weight: 700 !important;
  }

  body.use-new-ui .reports-tools-page .owner-kpi-label,
  body.use-new-ui .reports-tools-page .reports-kpi-label {
    font-size: var(--type-admin-label) !important;
    font-weight: 700 !important;
  }

  body.use-new-ui .reports-tools-page .owner-kpi-value,
  body.use-new-ui .reports-tools-page .reports-kpi-value {
    font-size: var(--type-admin-value) !important;
    font-weight: 700 !important;
  }

  /* Customer analytics mini-panels */
  body.use-new-ui .customers-page .customer-source-summary-card h3,
  body.use-new-ui .customers-page .customer-tier-summary-card h3,
  body.use-new-ui .customers-page .customer-source-head,
  body.use-new-ui .customers-page .customer-source-row,
  body.use-new-ui .customers-page .customer-tier-row {
    font-size: var(--type-admin-base) !important;
  }

  body.use-new-ui .customers-page .customer-source-panel-note {
    font-size: var(--type-admin-label) !important;
  }

  body.use-new-ui .sidebar .sidebar-command-kicker,
  body.use-new-ui .sidebar .sidebar-online-dot {
    font-size: var(--type-admin-label) !important;
  }

  body.use-new-ui .topbar .owner-quick-text strong,
  body.use-new-ui .topbar .owner-quick-sc,
  body.use-new-ui .topbar-spotlight-btn {
    font-size: var(--type-admin-base) !important;
  }
}

/* —— Route body default —— */
body.use-new-ui .route-page {
  font-size: var(--fs-md);
  line-height: var(--lh-normal);
}

body.use-new-ui .route-page .muted,
body.use-new-ui .muted {
  font-size: var(--fs-sm);
  color: var(--text-muted, #7b8797);
  line-height: var(--lh-normal);
}

/* Mobile admin: slightly smaller hero type, keep readable */
@media (max-width: 768px) {
  body.use-new-ui {
    --type-admin-base: 15px;
    --type-admin-label: 13px;
    --type-admin-value: 17px;
    --type-kpi-value: 20px;
    --type-topbar-title: 20px;
    --type-section-title: 18px;
  }

  body.use-new-ui .route-page tbody td,
  body.use-new-ui #modal tbody td {
    padding-top: 7px;
    padding-bottom: 7px;
  }
}