/* Inspecia TV — refinamento tipográfico tecnológico e organizado.
   Mantém as proporções/grade atuais e atua somente na linguagem visual das fontes. */

:root {
  --font-display: "Space Grotesk", "Segoe UI Variable Display", "Segoe UI", system-ui, sans-serif;
  --font-ui: "Manrope", "Segoe UI Variable Text", "Segoe UI", system-ui, sans-serif;
}

html,
body,
#app {
  font-family: var(--font-ui) !important;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  text-rendering: optimizeLegibility;
  font-kerning: normal;
  font-synthesis: none;
}

/* Identidade e títulos: mais tecnológica, limpa e compacta. */
.brand-logo,
.title-block h1,
.panel-heading h2,
.activity-heading strong {
  font-family: var(--font-display) !important;
  font-optical-sizing: auto;
}

.brand-logo {
  font-weight: 700 !important;
  letter-spacing: -0.045em !important;
}

.title-block h1 {
  font-weight: 700 !important;
  letter-spacing: -0.045em !important;
  text-wrap: balance;
}

.title-block h1 span {
  font-weight: 700 !important;
}

.panel-heading h2 {
  font-weight: 700 !important;
  letter-spacing: -0.025em !important;
}

/* Labels e textos auxiliares com hierarquia consistente. */
.metric-label,
.rank-header,
.queue-header,
.workshop-head,
.date-box span,
.operation-box,
.activity-heading small {
  font-family: var(--font-ui) !important;
  font-weight: 700 !important;
  letter-spacing: 0.01em !important;
}

.metric-label {
  color: #c8d7d1 !important;
}

.panel-heading p,
.metric-body small,
.team-title small,
.team-column > span,
.team-column > small,
.activity-card small,
.bar-hour,
.chart-y {
  font-family: var(--font-ui) !important;
  font-weight: 600 !important;
  letter-spacing: 0 !important;
}

/* Números: alinhamento tabular e aparência de painel operacional. */
.metric-value-row strong,
.date-box strong,
.bar-number,
.rank-row > strong,
.performance b,
.queue-row strong,
.workshop-row strong,
.team-column > b,
.team-column > strong,
.activity-time,
.metric-trend,
.metric-percent,
.rank-position {
  font-family: var(--font-ui) !important;
  font-variant-numeric: tabular-nums lining-nums;
  font-feature-settings: "tnum" 1, "lnum" 1;
}

.metric-value-row strong,
.date-box strong,
.team-column > b {
  font-weight: 800 !important;
  letter-spacing: -0.045em !important;
}

.bar-number,
.rank-row > strong,
.queue-row strong,
.workshop-row strong,
.performance b,
.team-column > strong {
  font-weight: 750 !important;
}

/* Tabelas e listas: leitura mais organizada e uniforme. */
.rank-row,
.queue-row,
.workshop-row,
.inspector-cell strong,
.team-title strong,
.activity-card strong {
  font-family: var(--font-ui) !important;
  letter-spacing: -0.012em !important;
}

.inspector-cell strong,
.team-title strong,
.activity-card strong {
  font-weight: 750 !important;
}

.rank-row > span,
.queue-row > span,
.workshop-row > span {
  font-weight: 600 !important;
}

/* Chips e estados ficam mais precisos, sem aparência de fonte genérica. */
.status-pill,
.counter-chip,
.outline-chip,
.fullscreen-button,
.metric-trend,
.metric-percent {
  font-family: var(--font-ui) !important;
  font-weight: 800 !important;
  letter-spacing: -0.01em !important;
}

/* Evita aspecto serrilhado em números e textos pequenos em TVs Full HD. */
@media (min-width: 1500px) {
  .rank-row,
  .queue-row,
  .workshop-row,
  .activity-card,
  .metric-card,
  .panel-heading {
    text-rendering: geometricPrecision;
  }
}
