/* ═══════════════════════════════════════════════════════════════
   N&C Imóveis — Tema (design tokens)
   Referência: LMS Ônix (fundo quase-preto neutro no escuro / cinza-branco
   bem claro no claro). AZUL predominante em botões/retângulos/ativos;
   teal #006e7e como azul de detalhe/contraste; coral só em 1-2 detalhes.
   Paleta: azul-petróleo #033042 (principal) · teal #006e7e · coral #FB8964.
   Fonte: Montserrat (2 pesos: 500/700).
   ═══════════════════════════════════════════════════════════════ */
@import url('/shared/fonts/montserrat.css');

:root {
  /* ── Marca ── */
  --marca-azul: #033042;
  --marca-azul-2: #06222e;
  --marca-teal: #006e7e;
  --marca-coral: #FB8964;

  /* ── MODO CLARO (padrão) ── */
  --bg: #f4f6f8;           /* página: cinza-branco bem claro */
  --surface: #ffffff;      /* cards, sidebar: branco */
  --surface-2: #eef2f5;
  --surface-3: #e4eaee;
  --text: #0d2129;
  --text-2: #52646d;
  --text-muted: #8a99a1;
  --border: #e6ebef;
  --border-2: #d7e0e5;

  /* Azul = acento DOMINANTE (ativos, destaques, retângulos) */
  --acento: #033042;
  --acento-suave: rgba(3,48,66,.09);
  --acento-suave-2: rgba(3,48,66,.14);

  /* Azul de detalhe/contraste (barras, foco, contadores, links) = #00597d */
  --detalhe: #00597d;
  --detalhe-suave: rgba(0,89,125,.12);

  /* Coral = acento raro (1-2 detalhes: sucesso, etapa concluída) */
  --coral: #FB8964;
  --coral-suave: rgba(251,137,100,.16);

  /* Primário (botões + retângulo ativo) = azul #033042, hover #00597d */
  --primario: #033042;
  --primario-hover: #00597d;
  --primario-texto: #ffffff;

  /* Status semânticos */
  --st-aguardando: #b7791f;  --st-aguardando-bg: #fdf4e3;
  --st-andamento: #00597d;   --st-andamento-bg: #e2eef4;
  --st-ok: #1f8a5b;          --st-ok-bg: #e7f6ee;
  --st-cancelado: #b04a4a;   --st-cancelado-bg: #fbeceb;
  --erro: #d64545;   --erro-bg: #fdeceb;

  --raio: 14px; --raio-sm: 10px; --raio-lg: 20px; --raio-pill: 999px;
  --sombra: 0 1px 2px rgba(6,45,60,.05), 0 6px 20px rgba(6,45,60,.05);
  --sombra-sm: 0 1px 2px rgba(6,45,60,.06);
  --sombra-fl: 0 16px 44px rgba(6,45,60,.20);
  --trans: .18s cubic-bezier(.4,0,.2,1);
  --sidebar-larga: 244px; --sidebar-fina: 72px; --topbar-altura: 60px;
}

/* ── MODO ESCURO (fundo #0f141a, como as capturas de referência) ── */
:root[data-theme='dark'] {
  --bg: #0f141a;
  --surface: #171d25;
  --surface-2: #1e2530;
  --surface-3: #27303d;
  --text: #eef2f5;
  --text-2: #9fb1bb;
  --text-muted: #677986;
  --border: #212b38;
  --border-2: #2d3846;

  --acento: #7fc8e6;                 /* azul claro p/ texto de ativos no escuro */
  --acento-suave: rgba(0,89,125,.24);
  --acento-suave-2: rgba(0,89,125,.34);

  --detalhe: #3ea6cf;
  --detalhe-suave: rgba(62,166,207,.16);

  --coral: #FB8964;
  --coral-suave: rgba(251,137,100,.18);

  --primario: #00597d;               /* botão + retângulo ativo, azul visível no escuro */
  --primario-hover: #0a6d95;
  --primario-texto: #ffffff;

  --st-aguardando: #e0b567;  --st-aguardando-bg: rgba(224,181,103,.14);
  --st-andamento: #3ea6cf;   --st-andamento-bg: rgba(62,166,207,.14);
  --st-ok: #5cd39a;          --st-ok-bg: rgba(92,211,154,.14);
  --st-cancelado: #f08a8a;   --st-cancelado-bg: rgba(240,138,138,.14);
  --erro: #f08a8a;   --erro-bg: rgba(240,138,138,.14);

  --sombra: 0 1px 2px rgba(0,0,0,.4), 0 8px 24px rgba(0,0,0,.4);
  --sombra-sm: 0 1px 2px rgba(0,0,0,.4);
  --sombra-fl: 0 16px 44px rgba(0,0,0,.6);
}

/* Segue o sistema quando o usuário não escolheu manualmente */
@media (prefers-color-scheme: dark) {
  :root:not([data-theme='light']) {
    --bg: #0f141a;
    --surface: #171d25;
    --surface-2: #1e2530;
    --surface-3: #27303d;
    --text: #eef2f5;
    --text-2: #9fb1bb;
    --text-muted: #677986;
    --border: #212b38;
    --border-2: #2d3846;
    --acento: #7fc8e6;
    --acento-suave: rgba(0,89,125,.24);
    --acento-suave-2: rgba(0,89,125,.34);
    --detalhe: #3ea6cf;
    --detalhe-suave: rgba(62,166,207,.16);
    --coral: #FB8964;
    --coral-suave: rgba(251,137,100,.18);
    --primario: #00597d;
    --primario-hover: #0a6d95;
    --primario-texto: #ffffff;
    --st-aguardando: #e0b567;  --st-aguardando-bg: rgba(224,181,103,.14);
    --st-andamento: #3ea6cf;   --st-andamento-bg: rgba(62,166,207,.14);
    --st-ok: #5cd39a;          --st-ok-bg: rgba(92,211,154,.14);
    --st-cancelado: #f08a8a;   --st-cancelado-bg: rgba(240,138,138,.14);
    --erro: #f08a8a;   --erro-bg: rgba(240,138,138,.14);
    --sombra: 0 1px 2px rgba(0,0,0,.4), 0 8px 24px rgba(0,0,0,.4);
    --sombra-sm: 0 1px 2px rgba(0,0,0,.4);
    --sombra-fl: 0 16px 44px rgba(0,0,0,.6);
  }
}

/* ── Reset + base ── */
* { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; }
body {
  margin: 0;
  font-family: 'Montserrat', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
  background: var(--bg); color: var(--text);
  font-weight: 500; line-height: 1.55; letter-spacing: -0.01em;
  -webkit-font-smoothing: antialiased; text-rendering: optimizeLegibility;
  -webkit-tap-highlight-color: transparent; min-height: 100dvh;
  transition: background var(--trans), color var(--trans);
}
img { max-width: 100%; }
a { color: inherit; }
h1, h2, h3, h4 { font-weight: 700; letter-spacing: -0.02em; margin: 0; }
::selection { background: var(--detalhe-suave); }

.oculto { display: none !important; }
.texto-2 { color: var(--text-2); }
.texto-muted { color: var(--text-muted); }

/* Ícones de linha (SVG) — herdam a cor do texto via currentColor */
[data-icone-tema] { display: inline-flex; align-items: center; justify-content: center; }
[data-icone-tema] svg { width: 1.2rem; height: 1.2rem; display: block; }