/* ════════════════════════════════════════════════════════════════════
   TERRA SOLUÇÕES — VISUAL 2.0 · Refresh editorial-técnico
   ────────────────────────────────────────────────────────────────────
   Drop-in que sobrescreve tipografia e refinamentos do style.css.
   Funcionalidade preservada — só CSS, nada de JS ou markup.

   Uso:
        <link rel="stylesheet" href="css/style.css?v=20260422" />
        <link rel="stylesheet" href="css/terra-brand-tokens.css" />
        <link rel="stylesheet" href="css/terra-visual-2.0.css" />

   Direção:
   • Manrope dominante para tudo que é produto (UI, KPIs, modais)
   • Cormorant Garamond fica RESERVADO ao wordmark "Terra" e capa
     editorial do auth — ali a serif tem peso narrativo
   • Números com tabular-nums em todas as colunas e KPIs
   • Microcopy em mono onde tem código/ID/coordenada
   • Hairlines e respiro maior; menos peso decorativo
   ════════════════════════════════════════════════════════════════════ */

/* ─── 1. Sans dominante: títulos de produto deixam de ser serif ─── */
.auth-card-head h1,
.modal-header h2,
.profile-modal-header h2,
.report-modal-header h2 {
    font-family: "Manrope", "Inter", system-ui, sans-serif !important;
    font-weight: 700 !important;
    letter-spacing: -0.02em !important;
}

/* Tamanhos compactados — produto pede densidade, não revista */
.auth-card-head h1 {
    font-size: clamp(28px, 2.6vw, 36px) !important;
    line-height: 1.05 !important;
}


.modal-header h2 {
    font-size: clamp(20px, 2vw, 24px) !important;
    line-height: 1.15 !important;
    letter-spacing: -0.015em !important;
}

/* Hero da auth — mantém serif (capa editorial) mas mais elegante */
.auth-hero-copy h2 {
    font-weight: 500 !important;
    font-style: italic !important;
    letter-spacing: -0.025em !important;
}

/* Hero do shell autenticado — sans, não serif */
.shell-hero h1,
.shell-hero-title,
.dashboard-hero h1 {
    font-family: "Manrope", "Inter", system-ui, sans-serif !important;
    font-weight: 700 !important;
    letter-spacing: -0.025em !important;
    font-size: clamp(28px, 2.8vw, 38px) !important;
    line-height: 1.05 !important;
}

/* ─── 2. Wordmark "Terra" — único lugar onde a serif manda ─────── */
.logo-text {
    font-family: "Cormorant Garamond", Georgia, serif !important;
    font-weight: 600 !important;
    letter-spacing: 0.005em !important;
    font-size: 19px !important;
}

/* ─── 3. Tabular figures em TUDO que é número ─────────────────── */
body,
.report-kpi-value,
.report-item-meta,
.tooltip-value-mono,
.profile-block-kicker,
.report-block-kicker,
.auth-admin-code-card strong,
.kpi-value,
.kpi-number,
.metric-value,
.metric-number,
.dashboard-stat,
.spotlight-stat,
[class*="-value"],
[class*="-stat"],
[class*="-number"],
[class*="-count"] {
    font-feature-settings: "tnum" 1, "ss01" 1, "cv11" 1 !important;
    font-variant-numeric: tabular-nums !important;
}

/* ─── 4. Microcopy em caps mais sutis (menos peso, menos tracking) ─ */
.report-block-kicker,
.profile-block-kicker,
.report-kpi-label,
.profile-kpi-label,
.layer-card-kicker,
.filter-section-title,
.section-kicker,
.layer-section-title {
    font-weight: 600 !important;
    letter-spacing: 0.12em !important;
    font-size: 10.5px !important;
    color: rgba(23, 50, 74, 0.55) !important;
}

/* ─── 5. Botões: menos uppercase agressivo no produto interno ──── */
.modal-action,
.report-action-btn,
.profile-action-btn,
.spotlight-action,
.layer-card-action {
    text-transform: none !important;
    letter-spacing: -0.005em !important;
    font-weight: 600 !important;
    font-size: 13px !important;
}

/* Auth e CTAs principais MANTÊM uppercase (peso narrativo) */
.auth-submit,
.auth-cta-btn {
    /* não mexe — uppercase fica */
}

/* ─── 6. Hairlines: bordas mais finas, sombras mais sutis ──────── */
.modal-shell,
.report-modal-shell,
.profile-modal-shell,
.spotlight-card,
.layer-card,
.auth-card {
    border: 1px solid rgba(10, 44, 74, 0.08) !important;
    box-shadow:
        0 1px 0 rgba(255, 255, 255, 0.6) inset,
        0 12px 32px rgba(8, 24, 42, 0.08),
        0 2px 6px rgba(8, 24, 42, 0.04) !important;
}

/* ─── 7. Respiro nos KPIs ─────────────────────────────────────── */
.report-kpi-value,
.profile-kpi-value {
    font-weight: 700 !important;
    font-size: 26px !important;
    letter-spacing: -0.025em !important;
    line-height: 1 !important;
}

/* ─── 8. Top bar: tipografia mais fina, mais respiro ──────────── */
.top-bar {
    letter-spacing: 0 !important;
}

.top-bar nav a,
.top-bar-link,
.top-bar-nav a {
    font-weight: 500 !important;
    letter-spacing: -0.005em !important;
    text-transform: none !important;
    font-size: 13.5px !important;
}

/* ─── 9. Sidebar: filtros mais arejados ───────────────────────── */
.sidebar label,
.sidebar summary {
    font-family: "Manrope", "Inter", system-ui, sans-serif !important;
    font-weight: 500 !important;
    letter-spacing: -0.005em !important;
}

.filter-chip,
.active-filter-chip {
    font-weight: 500 !important;
    letter-spacing: 0 !important;
    font-size: 12px !important;
}

/* ─── 10. Mono para coordenadas, IDs, códigos ─────────────────── */
.report-item-meta code,
.tooltip-value-mono,
.auth-admin-code-card strong,
.coordinate,
.farm-id,
[class*="-code"],
[class*="-id-"] {
    font-family: "JetBrains Mono", "Geist Mono", "SF Mono", ui-monospace, monospace !important;
    font-feature-settings: "tnum" 1, "zero" 1 !important;
}

/* ─── 11. Chip/badge: pílula sutil em vez de bloco pesado ─────── */
.status-badge,
.layer-badge,
.farm-badge {
    font-weight: 600 !important;
    letter-spacing: 0.04em !important;
    font-size: 10.5px !important;
    text-transform: uppercase !important;
    border-radius: 999px !important;
    padding: 3px 9px !important;
}

/* ─── 12. Foco e hover: anel teal suave em todo lugar ─────────── */
*:focus-visible {
    outline: none !important;
    box-shadow: var(--focus-ring) !important;
    border-radius: 6px;
}

/* ─── 13. Scrollbar discreta (webkit) ─────────────────────────── */
.sidebar ::-webkit-scrollbar,
.modal-body ::-webkit-scrollbar,
.report-modal-body ::-webkit-scrollbar {
    width: 6px;
    height: 6px;
}

.sidebar ::-webkit-scrollbar-thumb,
.modal-body ::-webkit-scrollbar-thumb,
.report-modal-body ::-webkit-scrollbar-thumb {
    background: rgba(10, 44, 74, 0.18);
    border-radius: 3px;
}

.sidebar ::-webkit-scrollbar-thumb:hover,
.modal-body ::-webkit-scrollbar-thumb:hover,
.report-modal-body ::-webkit-scrollbar-thumb:hover {
    background: rgba(10, 44, 74, 0.32);
}

.sidebar ::-webkit-scrollbar-track,
.modal-body ::-webkit-scrollbar-track,
.report-modal-body ::-webkit-scrollbar-track {
    background: transparent;
}

/* ─── 14. Anti-aliasing ───────────────────────────────────────── */
body {
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    text-rendering: optimizeLegibility;
}