/**
 * HRZ OPS — Density Overrides v1.0 (2026-04-30)
 *
 * SYSTEM-WIDE compact density. Last in CSS load chain — wins specificity.
 * Hugo (founder) quer mais info por viewport. Reduz fonts/padding/spacing
 * em ~25% globalmente, mantendo legibilidade e a11y.
 *
 * Touch targets:
 *   Desktop: 32px (compact, OK pra equipe HRZ que usa só desktop)
 *   Mobile (<=768px): 44px (Apple HIG / WCAG 2.5.5)
 */

:root {
  /* === DENSITY TOKENS (compact scale) === */
  --hrz-fs-xs: 10px;
  --hrz-fs-sm: 11px;
  --hrz-fs-base: 12px;
  --hrz-fs-md: 13px;
  --hrz-fs-lg: 14px;
  --hrz-fs-xl: 16px;
  --hrz-fs-2xl: 18px;
  --hrz-fs-3xl: 22px;

  --hrz-sp-1: 4px;
  --hrz-sp-2: 6px;
  --hrz-sp-3: 8px;
  --hrz-sp-4: 10px;
  --hrz-sp-5: 12px;
  --hrz-sp-6: 16px;
  --hrz-sp-7: 20px;

  --hrz-touch: 32px;
  --hrz-input-h: 32px;
  --hrz-button-h: 32px;
  --hrz-radius-sm: 6px;
  --hrz-radius-md: 8px;

  --hrz-lh-tight: 1.2;
  --hrz-lh-normal: 1.4;
}

@media (max-width: 768px) {
  :root {
    --hrz-touch: 44px;
    --hrz-input-h: 44px;
    --hrz-button-h: 44px;
    --hrz-fs-base: 13px;
    --hrz-sp-4: 12px;
  }
}

/* === GLOBAL BODY DEFAULT (não force tudo, mas cria baseline) === */
body, .app {
  font-size: var(--hrz-fs-md, 13px);
  line-height: var(--hrz-lh-normal);
}

/* === HEADINGS NORMALIZED === */
.app h1, .main h1, .page-title {
  font-size: 20px !important;
  font-weight: 600;
  line-height: 1.25;
  margin-bottom: 12px;
}
.app h2, .main h2 {
  font-size: 16px !important;
  font-weight: 600;
  line-height: 1.3;
  margin-bottom: 10px;
}
.app h3, .main h3 {
  font-size: 14px !important;
  font-weight: 600;
  line-height: 1.3;
  margin-bottom: 8px;
}
.app h4 {
  font-size: 13px !important;
  font-weight: 600;
}

/* === PAGE TITLE / SECTION TITLE compact === */
.page-title {
  font-size: 20px !important;
}
.page-sub, .page-subtitle {
  font-size: 12px !important;
  color: var(--text-secondary);
}

/* === KPI / STATS cards normalized === */
.kpi-card, .stat-card, .metric-card {
  padding: 10px 12px !important;
  border-radius: 8px;
}
.kpi-val, .kpi-value, .stat-value, .metric-value {
  font-size: 18px !important;
  font-weight: 700;
  line-height: 1.2;
}
.kpi-label, .stat-label, .metric-label {
  font-size: 11px !important;
  color: var(--text-secondary);
  margin-bottom: 2px;
}

/* === BUTTONS compact === */
.btn, button.btn-primary, button.btn-secondary, button.btn-ghost {
  font-size: 12px !important;
  padding: 6px 12px !important;
  min-height: var(--hrz-touch);
  border-radius: 6px;
  line-height: 1.2;
}
.btn-sm {
  font-size: 11px !important;
  padding: 4px 10px !important;
  min-height: 28px;
}

/* === FORMS / INPUTS compact === */
input, select, textarea, .f-sel, .f-search {
  font-size: 12px !important;
  padding: 6px 10px !important;
  min-height: var(--hrz-input-h);
  border-radius: 6px;
}
label {
  font-size: 11px !important;
  margin-bottom: 4px;
}

/* === TABLES compact === */
table th {
  font-size: 11px !important;
  padding: 6px 8px !important;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.3px;
}
table td {
  font-size: 12px !important;
  padding: 6px 8px !important;
}

/* === BADGES / PILLS compact === */
.badge, .pill, .chip, .tag {
  font-size: 10px !important;
  padding: 2px 6px !important;
  border-radius: 4px;
  font-weight: 600;
  line-height: 1.4;
}

/* === SIDEBAR compact === */
.sidebar, aside.sidebar {
  font-size: 12px;
}
.nav-item {
  padding: 7px 12px !important;
  font-size: 12px !important;
}
.nav-section-title {
  font-size: 10px !important;
  text-transform: uppercase;
  letter-spacing: 0.5px;
}

/* === TOPBAR compact === */
.topbar {
  height: 48px !important;
  padding: 0 16px !important;
}
.topbar-icon-btn {
  width: 32px !important;
  height: 32px !important;
}

/* === MODAL/DRAWER compact === */
.modal {
  padding: 16px !important;
  border-radius: 12px;
}
.modal-header h2 { font-size: 16px !important; }
.modal-body { font-size: 12px !important; }

/* === CARD GENERIC compact === */
.card, .panel, .container-card {
  padding: 12px !important;
  border-radius: 8px;
  margin-bottom: 12px;
}

/* === MOBILE recovery (touch ≥44px) === */
@media (max-width: 768px) {
  .btn, button.btn-primary, button.btn-secondary {
    min-height: 44px;
    padding: 10px 16px !important;
  }
  input, select, textarea {
    min-height: 44px;
    padding: 10px 12px !important;
    font-size: 14px !important; /* prevent iOS auto-zoom */
  }
  .nav-item { padding: 12px 14px !important; font-size: 13px !important; }
  table th, table td { padding: 8px !important; font-size: 12px !important; }
}

/* === Forced-colors (high contrast OS mode) === */
@media (forced-colors: active) {
  .btn, .nav-item, input, select, table { border: 1px solid CanvasText; }
}

/* === Reduced motion safe === */
@media (prefers-reduced-motion: reduce) {
  * { animation-duration: 0s !important; transition-duration: 0s !important; }
}