/* Estilos Globais do Arbor Imóveis PWA */
@charset "UTF-8";

@font-face {
  font-family: 'EngraversGothic BT';
  src: url('/fonts/EngraversGothicBT-Regular.ttf') format('truetype'),
       url('/fonts/EngraversGothic%20BT%20Regular.ttf') format('truetype');
  font-weight: 100 900;
  font-style: normal;
  font-display: swap;
}

.font-roboto-slab {
  font-family: 'Roboto Slab', Georgia, serif !important;
  font-weight: 700;
}

html, body {
  margin: 0;
  padding: 0;
  width: 100%;
  height: 100%;
  background-color: #fafaf7;
  color: #1e293b;
  font-family: 'Plus Jakarta Sans', 'Inter', system-ui, -apple-system, sans-serif;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

#root {
  width: 100%;
  height: 100%;
}

/* ==========================================================================
   Tema Escuro — Arbor · Verde Texturizado + Liquid Glass + Dourado
   ==========================================================================
   Camadas (nessa ordem, de trás pra frente):
     1. BACKGROUND = verde Arbor profundo, texturizado (variação tonal,
        gradientes suaves, relevo quase imperceptível) — nunca preto puro,
        nunca grafite neutro, nunca verde acinzentado/dessaturado.
     2. SUPERFÍCIES = Liquid Glass escuro e neutro (branco translúcido baixo,
        NÃO um filtro verde) — só em cards/painéis/controles, não na página
        inteira; fundo/sidebar/topbar continuam sólidos (chrome estrutural).
     3. CONTEÚDO = branco/off-white, em 3 níveis de opacidade (principal /
        secundário / terciário — nunca o matiz).
     4. DESTAQUES = dourado Arbor (#D2B06A) — raro, só VGV/metas/progresso/
        valor/seleção.
     5. ESTADOS = cores semânticas (status, temperatura, alertas) — discretas
        e translúcidas, nunca blocos sólidos pesados.

   Camada global de tema. Em vez de editar cor-a-cor cada tela (proibido pela
   diretriz do módulo), interceptamos aqui as classes utilitárias Tailwind
   (geradas em runtime pelo CDN) que o app inteiro já usa pra neutros
   (white/black/slate/stone), pra "blue" (definido no tailwind.config do
   index.html como a própria escala de verde Arbor — usadíssimo em toda a
   base pra ações/identidade) e pras cores de marca em hex arbitrário
   (`bg-[#174738]` etc.), redirecionando pros tokens abaixo quando `html`
   tem `.dark` (aplicada por contexts/ThemeContext.tsx). Qualquer tela nova
   que use essas mesmas classes já herda o tema — sem trabalho extra.

   Cada regra cobre a classe exata (`bg-slate-50`) E a variante de opacidade
   Tailwind (`bg-slate-50/80`) — as duas aparecem literalmente no app. As
   duas formas SEMPRE levam o prefixo `html.dark`, e a forma de opacidade é
   ancorada por espaço/início de string (nunca por `:`), pra nunca vazar pro
   tema claro nem pra dentro de um `hover:`/`focus:`/`group-hover:` alheio.
   E as regras de `divide-*` usam o combinador `> * + *` que o Tailwind
   realmente gera (não o próprio elemento) — um erro real encontrado nesta
   revisão: sem o combinador, o override nunca chegava a aplicar. */

:root {
  /* 1. BACKGROUND — verde Arbor profundo e texturizado. A base sólida é só
     o "chão"; a textura (variação tonal + relevo quase imperceptível) é
     aplicada em html.dark body como camadas de gradiente (ver abaixo). */
  --arbor-dark-bg: #0e2e22;
  --arbor-dark-chrome: #0a2419;
  --arbor-dark-topbar: #0c281c;

  /* 2. SUPERFÍCIES — Liquid Glass escuro e neutro: branco translúcido
     baixo (nunca um filtro verde), só em cards/painéis/controles. */
  --arbor-dark-surface: rgba(255, 255, 255, 0.06);
  --arbor-dark-surface-strong: rgba(255, 255, 255, 0.095);
  --arbor-dark-input: rgba(255, 255, 255, 0.065);
  --arbor-dark-hover: rgba(255, 255, 255, 0.05);
  --arbor-dark-border: rgba(255, 255, 255, 0.14);
  --arbor-dark-border-subtle: rgba(255, 255, 255, 0.08);
  --arbor-glass-blur: blur(18px) saturate(115%);
  /* Realce sutil no topo da superfície + sombra rasa — dá a sensação de
     "vidro" sem precisar de contornos pesados. Substitui qualquer
     shadow-xs/md do Tailwind no mesmo elemento (mesma propriedade). */
  --arbor-glass-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.09), 0 10px 28px -16px rgba(0, 0, 0, 0.55);

  /* 3. CONTEÚDO — branco é a informação principal; só a opacidade separa
     os 3 níveis (nunca o matiz). */
  --arbor-dark-text: #f7f5ef;
  --arbor-dark-text-muted: rgba(247, 245, 239, 0.65);
  --arbor-dark-text-faint: rgba(247, 245, 239, 0.42);

  /* Verde Arbor mais luminoso — só ações principais/estados ativos/
     identidade (NÃO cor de superfície, NÃO pintura geral de componentes). */
  --arbor-dark-green: #1b5a46;
  --arbor-dark-green-bright: #3a9172;

  /* 4. DESTAQUES — dourado Arbor, raro: VGV, metas, progresso, valor,
     seleção. Nunca preenchimento geral. */
  --arbor-dark-gold: #d2b06a;
  --arbor-dark-gold-bright: #d2b06a;
  --arbor-dark-gold-surface: rgba(210, 176, 106, 0.13);
  --arbor-dark-gold-border: rgba(210, 176, 106, 0.4);
  /* "Estados ativos/selecionados" em hex de marca (ex. border-[#174738])
     usam o verde de identidade, não dourado — dourado fica só nos pontos
     de "valor/destaque" explícitos (editados direto nos componentes). */
  --arbor-dark-active: var(--arbor-dark-green-bright);
  --arbor-dark-focus: rgba(58, 145, 114, 0.55);
  --arbor-dark-text-accent: var(--arbor-dark-green-bright);
}

html.dark {
  color-scheme: dark;
}

html.dark,
html.dark body {
  background-color: var(--arbor-dark-bg);
  color: var(--arbor-dark-text);
}

/* Textura do ambiente: gradientes muito suaves (variação tonal + relevo
   quase imperceptível), nunca um desenho literal. Fixo em relação à
   viewport pra não "rolar" com o conteúdo, como um material físico. */
html.dark body {
  background-image:
    radial-gradient(120% 90% at 8% -15%, rgba(58, 145, 114, 0.22) 0%, rgba(14, 46, 34, 0) 55%),
    radial-gradient(90% 70% at 100% 0%, rgba(58, 145, 114, 0.14) 0%, rgba(14, 46, 34, 0) 50%),
    radial-gradient(110% 80% at 15% 115%, rgba(6, 20, 15, 0.55) 0%, rgba(14, 46, 34, 0) 60%),
    radial-gradient(70% 60% at 85% 90%, rgba(210, 176, 106, 0.05) 0%, rgba(14, 46, 34, 0) 55%),
    linear-gradient(180deg, rgba(255, 255, 255, 0.03) 0%, rgba(255, 255, 255, 0) 12%),
    linear-gradient(0deg, rgba(0, 0, 0, 0.22) 0%, rgba(0, 0, 0, 0) 18%);
  background-attachment: fixed, fixed, fixed, fixed, fixed, fixed;
}

/* Scrollbar em tom verde, não cinza */
html.dark ::-webkit-scrollbar-thumb {
  background: rgba(159, 194, 174, 0.25);
}
html.dark ::-webkit-scrollbar-thumb:hover {
  background: rgba(159, 194, 174, 0.4);
}

/* --- Neutros: branco / preto ------------------------------------------- */
html.dark [class~="bg-white"], html.dark [class*=" bg-white/"], html.dark [class^="bg-white/"] {
  background-color: var(--arbor-dark-surface);
  backdrop-filter: var(--arbor-glass-blur);
  -webkit-backdrop-filter: var(--arbor-glass-blur);
  box-shadow: var(--arbor-glass-shadow);
}
html.dark [class~="text-white"], html.dark [class*=" text-white/"], html.dark [class^="text-white/"] { color: var(--arbor-dark-text); }
html.dark [class~="border-white"], html.dark [class*=" border-white/"], html.dark [class^="border-white/"] { border-color: var(--arbor-dark-border); }
html.dark [class~="bg-black"], html.dark [class*=" bg-black/"], html.dark [class^="bg-black/"] {
  background-color: var(--arbor-dark-chrome);
}
html.dark [class~="text-black"], html.dark [class*=" text-black/"], html.dark [class^="text-black/"] { color: var(--arbor-dark-text); }
html.dark [class~="border-black"], html.dark [class*=" border-black/"], html.dark [class^="border-black/"] { border-color: var(--arbor-dark-border); }
html.dark [class~="placeholder-white"]::placeholder { color: var(--arbor-dark-text-faint); }

/* --- Neutros: escala slate / stone --------------------------------------
   (mesma tabela para as duas famílias — o app usa slate como cinza
   principal e stone como variante quente, sempre para fundo/texto/borda) */
html.dark [class~="bg-slate-50"], html.dark [class*=" bg-slate-50/"], html.dark [class^="bg-slate-50/"],
html.dark [class~="bg-stone-50"], html.dark [class*=" bg-stone-50/"], html.dark [class^="bg-stone-50/"],
html.dark [class~="from-slate-50"], html.dark [class*=" from-slate-50/"], html.dark [class^="from-slate-50/"],
html.dark [class~="to-slate-50"], html.dark [class*=" to-slate-50/"], html.dark [class^="to-slate-50/"] { background-color: var(--arbor-dark-hover); }

html.dark [class~="bg-slate-100"], html.dark [class*=" bg-slate-100/"], html.dark [class^="bg-slate-100/"],
html.dark [class~="bg-stone-100"], html.dark [class*=" bg-stone-100/"], html.dark [class^="bg-stone-100/"],
html.dark [class~="from-slate-100"], html.dark [class*=" from-slate-100/"], html.dark [class^="from-slate-100/"],
html.dark [class~="to-slate-100"], html.dark [class*=" to-slate-100/"], html.dark [class^="to-slate-100/"] {
  background-color: var(--arbor-dark-surface-strong);
  backdrop-filter: var(--arbor-glass-blur);
  -webkit-backdrop-filter: var(--arbor-glass-blur);
  box-shadow: var(--arbor-glass-shadow);
}

html.dark [class~="bg-slate-200"], html.dark [class*=" bg-slate-200/"], html.dark [class^="bg-slate-200/"],
html.dark [class~="bg-stone-200"], html.dark [class*=" bg-stone-200/"], html.dark [class^="bg-stone-200/"],
html.dark [class~="to-slate-200"], html.dark [class*=" to-slate-200/"], html.dark [class^="to-slate-200/"] { background-color: var(--arbor-dark-border); }

html.dark [class~="bg-slate-300"], html.dark [class*=" bg-slate-300/"], html.dark [class^="bg-slate-300/"],
html.dark [class~="bg-slate-400"], html.dark [class*=" bg-slate-400/"], html.dark [class^="bg-slate-400/"],
html.dark [class~="bg-slate-500"], html.dark [class*=" bg-slate-500/"], html.dark [class^="bg-slate-500/"],
html.dark [class~="bg-slate-600"], html.dark [class*=" bg-slate-600/"], html.dark [class^="bg-slate-600/"] { background-color: var(--arbor-dark-border); }

html.dark [class~="bg-slate-700"], html.dark [class*=" bg-slate-700/"], html.dark [class^="bg-slate-700/"],
html.dark [class~="bg-slate-800"], html.dark [class*=" bg-slate-800/"], html.dark [class^="bg-slate-800/"] {
  background-color: var(--arbor-dark-surface-strong);
  backdrop-filter: var(--arbor-glass-blur);
  -webkit-backdrop-filter: var(--arbor-glass-blur);
  box-shadow: var(--arbor-glass-shadow);
}

html.dark [class~="bg-slate-900"], html.dark [class*=" bg-slate-900/"], html.dark [class^="bg-slate-900/"],
html.dark [class~="bg-slate-950"], html.dark [class*=" bg-slate-950/"], html.dark [class^="bg-slate-950/"] {
  background-color: var(--arbor-dark-chrome);
}

html.dark [class~="text-slate-900"], html.dark [class*=" text-slate-900/"], html.dark [class^="text-slate-900/"],
html.dark [class~="text-slate-800"], html.dark [class*=" text-slate-800/"], html.dark [class^="text-slate-800/"],
html.dark [class~="text-stone-900"], html.dark [class*=" text-stone-900/"], html.dark [class^="text-stone-900/"],
html.dark [class~="text-stone-800"], html.dark [class*=" text-stone-800/"], html.dark [class^="text-stone-800/"] { color: var(--arbor-dark-text); }

html.dark [class~="text-slate-700"], html.dark [class*=" text-slate-700/"], html.dark [class^="text-slate-700/"],
html.dark [class~="text-slate-600"], html.dark [class*=" text-slate-600/"], html.dark [class^="text-slate-600/"],
html.dark [class~="text-stone-700"], html.dark [class*=" text-stone-700/"], html.dark [class^="text-stone-700/"],
html.dark [class~="text-stone-600"], html.dark [class*=" text-stone-600/"], html.dark [class^="text-stone-600/"] { color: var(--arbor-dark-text-muted); }

html.dark [class~="text-slate-500"], html.dark [class*=" text-slate-500/"], html.dark [class^="text-slate-500/"],
html.dark [class~="text-slate-400"], html.dark [class*=" text-slate-400/"], html.dark [class^="text-slate-400/"],
html.dark [class~="text-slate-300"], html.dark [class*=" text-slate-300/"], html.dark [class^="text-slate-300/"],
html.dark [class~="text-stone-500"], html.dark [class*=" text-stone-500/"], html.dark [class^="text-stone-500/"],
html.dark [class~="text-stone-400"], html.dark [class*=" text-stone-400/"], html.dark [class^="text-stone-400/"] { color: var(--arbor-dark-text-faint); }

html.dark [class~="placeholder-slate-300"],
html.dark [class~="placeholder-slate-400"],
html.dark [class~="placeholder-slate-500"] { color: var(--arbor-dark-text-faint); }

html.dark [class~="border-slate-100"], html.dark [class*=" border-slate-100/"], html.dark [class^="border-slate-100/"],
html.dark [class~="border-slate-150"],
html.dark [class~="border-slate-200"], html.dark [class*=" border-slate-200/"], html.dark [class^="border-slate-200/"],
html.dark [class~="border-stone-100"], html.dark [class*=" border-stone-100/"], html.dark [class^="border-stone-100/"],
html.dark [class~="border-stone-200"], html.dark [class*=" border-stone-200/"], html.dark [class^="border-stone-200/"] { border-color: var(--arbor-dark-border-subtle); }

/* divide-* do Tailwind aplica a borda nos FILHOS via combinador
   (`.divide-slate-200 > :not([hidden]) ~ :not([hidden])`), não no próprio
   elemento — por isso precisa do mesmo combinador aqui, senão o override
   nunca tem efeito (bug real encontrado nesta revisão: linhas de tabela
   continuavam no slate-200 claro original, "quase brancas" sobre o fundo
   escuro). */
html.dark [class~="divide-slate-100"] > :not([hidden]) ~ :not([hidden]),
html.dark [class~="divide-slate-150"] > :not([hidden]) ~ :not([hidden]),
html.dark [class~="divide-slate-200"] > :not([hidden]) ~ :not([hidden]),
html.dark [class~="divide-stone-100"] > :not([hidden]) ~ :not([hidden]),
html.dark [class~="divide-stone-200"] > :not([hidden]) ~ :not([hidden]) { border-color: var(--arbor-dark-border-subtle); }

html.dark [class~="border-slate-300"], html.dark [class*=" border-slate-300/"], html.dark [class^="border-slate-300/"],
html.dark [class~="border-slate-400"], html.dark [class*=" border-slate-400/"], html.dark [class^="border-slate-400/"],
html.dark [class~="border-slate-600"], html.dark [class*=" border-slate-600/"], html.dark [class^="border-slate-600/"],
html.dark [class~="border-slate-700"], html.dark [class*=" border-slate-700/"], html.dark [class^="border-slate-700/"],
html.dark [class~="border-slate-800"], html.dark [class*=" border-slate-800/"], html.dark [class^="border-slate-800/"] { border-color: var(--arbor-dark-border); }

/* --- "blue" (tailwind.config em index.html redefine essa família inteira
   como a escala de verde Arbor — blue-50 a blue-950 SÃO #f1f6f3…#030b08,
   não azul) --------------------------------------------------------------
   Usadíssima em toda a base pra ações/identidade/estado ativo (era um
   "furo" real nesta revisão: sem esta regra, bg-blue-100/text-blue-700 —
   ex. o chip "Em Atendimento" de Leads — não tinha NENHUM override no
   escuro e aparecia com a cor clara original crua). */
html.dark [class~="bg-blue-50"], html.dark [class*=" bg-blue-50/"], html.dark [class^="bg-blue-50/"],
html.dark [class~="bg-blue-100"], html.dark [class*=" bg-blue-100/"], html.dark [class^="bg-blue-100/"],
html.dark [class~="bg-blue-200"], html.dark [class*=" bg-blue-200/"], html.dark [class^="bg-blue-200/"] { background-color: rgba(58, 145, 114, 0.16); }
html.dark [class~="border-blue-100"], html.dark [class*=" border-blue-100/"], html.dark [class^="border-blue-100/"],
html.dark [class~="border-blue-200"], html.dark [class*=" border-blue-200/"], html.dark [class^="border-blue-200/"] { border-color: rgba(58, 145, 114, 0.4); }
html.dark [class~="text-blue-600"], html.dark [class*=" text-blue-600/"], html.dark [class^="text-blue-600/"],
html.dark [class~="text-blue-700"], html.dark [class*=" text-blue-700/"], html.dark [class^="text-blue-700/"],
html.dark [class~="text-blue-800"], html.dark [class*=" text-blue-800/"], html.dark [class^="text-blue-800/"],
html.dark [class~="text-blue-900"], html.dark [class*=" text-blue-900/"], html.dark [class^="text-blue-900/"] { color: var(--arbor-dark-green-bright); }
html.dark [class~="bg-blue-800"], html.dark [class*=" bg-blue-800/"], html.dark [class^="bg-blue-800/"],
html.dark [class~="bg-blue-900"], html.dark [class*=" bg-blue-900/"], html.dark [class^="bg-blue-900/"],
html.dark [class~="bg-blue-950"], html.dark [class*=" bg-blue-950/"], html.dark [class^="bg-blue-950/"] { filter: brightness(1.3); }

/* --- Botões "Assistente IA" (roxo, convenção usada em ~20 telas) ---------
   Integra à identidade Arbor (verde + traço dourado) mantendo a
   diferenciação funcional: continua reconhecível como "ação de IA", só não
   destoa mais da paleta do resto do sistema. */
html.dark [class~="bg-purple-600"], html.dark [class*=" bg-purple-600/"], html.dark [class^="bg-purple-600/"],
html.dark [class~="bg-purple-500"], html.dark [class*=" bg-purple-500/"], html.dark [class^="bg-purple-500/"] {
  background-color: var(--arbor-dark-green-bright);
  border-color: rgba(210, 176, 106, 0.45);
}
html.dark [class~="hover:bg-purple-700"]:hover,
html.dark [class~="hover:bg-purple-600"]:hover { background-color: #256b54; }
html.dark [class~="bg-purple-100"], html.dark [class*=" bg-purple-100/"], html.dark [class^="bg-purple-100/"] { background-color: rgba(58, 145, 114, 0.16); }
html.dark [class~="text-purple-700"], html.dark [class~="text-purple-300"] { color: var(--arbor-dark-green-bright); }

/* --- Inputs / campos de formulário --------------------------------------
   Cobre os padrões repetidos de `bg-white border border-slate-300` usados
   em toda ficha/modal do sistema. */
html.dark input,
html.dark select,
html.dark textarea {
  background-color: var(--arbor-dark-input);
  color: var(--arbor-dark-text);
  backdrop-filter: var(--arbor-glass-blur);
  -webkit-backdrop-filter: var(--arbor-glass-blur);
}
html.dark input::placeholder,
html.dark textarea::placeholder { color: var(--arbor-dark-text-faint); }
html.dark input:disabled,
html.dark select:disabled,
html.dark textarea:disabled { background-color: var(--arbor-dark-surface); color: var(--arbor-dark-text-faint); }

/* --- Cores de marca em hex arbitrário (bg-[#...], text-[#...], etc.) ----
   Superfícies claras (creme/dourado-claro) da marca → viram superfície
   escura. Verdes já profundos usados como "ação/destaque" na versão clara
   (botões, bordas de foco) ganham brilho extra pra continuar se destacando
   sobre o novo fundo escuro, em vez de desaparecer nele. */
/* bg-[#FAF8F5] é literalmente o chrome estrutural (Sidebar/Header no app) —
   sólido, sem blur, mais escuro que as superfícies de vidro. */
html.dark [class~="bg-[#FAF8F5]"], html.dark [class*=" bg-[#FAF8F5]/"], html.dark [class^="bg-[#FAF8F5]/"] {
  background-color: var(--arbor-dark-chrome);
}

html.dark [class~="bg-[#FAF5ED]"], html.dark [class*=" bg-[#FAF5ED]/"], html.dark [class^="bg-[#FAF5ED]/"],
html.dark [class~="bg-[#f8f9fa]"], html.dark [class*=" bg-[#f8f9fa]/"], html.dark [class^="bg-[#f8f9fa]/"],
html.dark [class~="bg-[#DFEBE4]"], html.dark [class*=" bg-[#DFEBE4]/"], html.dark [class^="bg-[#DFEBE4]/"],
html.dark [class~="bg-[#F1F6F3]"], html.dark [class*=" bg-[#F1F6F3]/"], html.dark [class^="bg-[#F1F6F3]/"] {
  background-color: var(--arbor-dark-surface);
  backdrop-filter: var(--arbor-glass-blur);
  -webkit-backdrop-filter: var(--arbor-glass-blur);
}

/* Superfícies claras douradas (badges de meta/valor não atingido etc.) →
   viram um verde-superfície com um traço sutil de dourado, não branco puro. */
html.dark [class~="bg-[#F5EBD8]"], html.dark [class*=" bg-[#F5EBD8]/"], html.dark [class^="bg-[#F5EBD8]/"] { background-color: var(--arbor-dark-gold-surface); }

html.dark [class~="border-[#E6DFD4]"], html.dark [class*=" border-[#E6DFD4]/"], html.dark [class^="border-[#E6DFD4]/"],
html.dark [class~="border-[#C0D8CB]"], html.dark [class*=" border-[#C0D8CB]/"], html.dark [class^="border-[#C0D8CB]/"],
html.dark [class~="border-[#ebdcc3]"], html.dark [class*=" border-[#ebdcc3]/"], html.dark [class^="border-[#ebdcc3]/"],
html.dark [class~="border-[#DFEBE4]"], html.dark [class*=" border-[#DFEBE4]/"], html.dark [class^="border-[#DFEBE4]/"] { border-color: var(--arbor-dark-border-subtle); }

html.dark [class~="bg-[#174738]"], html.dark [class*=" bg-[#174738]/"], html.dark [class^="bg-[#174738]/"],
html.dark [class~="bg-[#0d2d22]"], html.dark [class*=" bg-[#0d2d22]/"], html.dark [class^="bg-[#0d2d22]/"],
html.dark [class~="bg-[#0a1912]"], html.dark [class*=" bg-[#0a1912]/"], html.dark [class^="bg-[#0a1912]/"],
html.dark [class~="bg-[#0F2E23]"], html.dark [class*=" bg-[#0F2E23]/"], html.dark [class^="bg-[#0F2E23]/"],
html.dark [class~="bg-[#204030]"], html.dark [class*=" bg-[#204030]/"], html.dark [class^="bg-[#204030]/"],
html.dark [class~="bg-[#0f3227]"], html.dark [class*=" bg-[#0f3227]/"], html.dark [class^="bg-[#0f3227]/"],
html.dark [class~="bg-[#12382c]"], html.dark [class*=" bg-[#12382c]/"], html.dark [class^="bg-[#12382c]/"],
html.dark [class~="bg-[#183325]"], html.dark [class*=" bg-[#183325]/"], html.dark [class^="bg-[#183325]/"],
html.dark [class~="bg-[#061711]"], html.dark [class*=" bg-[#061711]/"], html.dark [class^="bg-[#061711]/"],
html.dark [class~="bg-[#030b08]"], html.dark [class*=" bg-[#030b08]/"], html.dark [class^="bg-[#030b08]/"],
html.dark [class~="bg-[#133a2f]"], html.dark [class*=" bg-[#133a2f]/"], html.dark [class^="bg-[#133a2f]/"],
html.dark [class~="bg-[#1f4d3d]"], html.dark [class*=" bg-[#1f4d3d]/"], html.dark [class^="bg-[#1f4d3d]/"] {
  filter: brightness(1.3);
}

html.dark [class~="text-[#174738]"], html.dark [class*=" text-[#174738]/"], html.dark [class^="text-[#174738]/"],
html.dark [class~="text-[#0d2d22]"], html.dark [class*=" text-[#0d2d22]/"], html.dark [class^="text-[#0d2d22]/"],
html.dark [class~="text-[#0a1912]"], html.dark [class*=" text-[#0a1912]/"], html.dark [class^="text-[#0a1912]/"],
html.dark [class~="text-[#0F2E23]"], html.dark [class*=" text-[#0F2E23]/"], html.dark [class^="text-[#0F2E23]/"],
html.dark [class~="text-[#204030]"], html.dark [class*=" text-[#204030]/"], html.dark [class^="text-[#204030]/"],
html.dark [class~="text-[#0f3227]"], html.dark [class*=" text-[#0f3227]/"], html.dark [class^="text-[#0f3227]/"],
html.dark [class~="text-[#12382c]"], html.dark [class*=" text-[#12382c]/"], html.dark [class^="text-[#12382c]/"],
html.dark [class~="text-[#183325]"], html.dark [class*=" text-[#183325]/"], html.dark [class^="text-[#183325]/"],
html.dark [class~="text-[#133a2f]"], html.dark [class*=" text-[#133a2f]/"], html.dark [class^="text-[#133a2f]/"] { color: var(--arbor-dark-text-accent); }

html.dark [class~="border-[#174738]"], html.dark [class*=" border-[#174738]/"], html.dark [class^="border-[#174738]/"],
html.dark [class~="border-[#0d2d22]"], html.dark [class*=" border-[#0d2d22]/"], html.dark [class^="border-[#0d2d22]/"],
html.dark [class~="border-[#0a1912]"], html.dark [class*=" border-[#0a1912]/"], html.dark [class^="border-[#0a1912]/"] { border-color: var(--arbor-dark-active); }

html.dark [class~="ring-[#174738]"], html.dark [class*=" ring-[#174738]/"], html.dark [class^="ring-[#174738]/"],
html.dark [class~="ring-[#0d2d22]"], html.dark [class*=" ring-[#0d2d22]/"], html.dark [class^="ring-[#0d2d22]/"] { --tw-ring-color: var(--arbor-dark-focus); }

/* Dourado de marca já usado em texto (valores/meta) sobre fundo cor de
   canela/marrom escuro (#8C6D3F etc.) — vira dourado claro legível sobre
   verde escuro, mantendo o papel de "acento premium". */
html.dark [class~="text-[#8C6D3F]"], html.dark [class*=" text-[#8C6D3F]/"], html.dark [class^="text-[#8C6D3F]/"],
html.dark [class~="text-[#8B6F4E]"], html.dark [class*=" text-[#8B6F4E]/"], html.dark [class^="text-[#8B6F4E]/"],
html.dark [class~="text-[#8f7045]"], html.dark [class*=" text-[#8f7045]/"], html.dark [class^="text-[#8f7045]/"],
html.dark [class~="text-[#A68558]"], html.dark [class*=" text-[#A68558]/"], html.dark [class^="text-[#A68558]/"],
html.dark [class~="text-[#a68558]"], html.dark [class*=" text-[#a68558]/"], html.dark [class^="text-[#a68558]/"] { color: var(--arbor-dark-gold-bright); }

/* --- Cores semânticas (sucesso/alerta/erro/info em badges e alertas) ----
   Mantidas com a mesma identidade de cor, só com fundo escurecido
   (translúcido sobre a superfície escura) e texto clareado, pra continuar
   com contraste adequado em vez de virar um bloco quase branco. */
html.dark [class~="bg-red-50"], html.dark [class*=" bg-red-50/"], html.dark [class^="bg-red-50/"],
html.dark [class~="bg-red-100"], html.dark [class*=" bg-red-100/"], html.dark [class^="bg-red-100/"],
html.dark [class~="bg-red-200"], html.dark [class*=" bg-red-200/"], html.dark [class^="bg-red-200/"] { background-color: rgba(239, 68, 68, 0.16); }
html.dark [class~="border-red-100"],
html.dark [class~="border-red-200"] { border-color: rgba(239, 68, 68, 0.4); }
html.dark [class~="text-red-600"],
html.dark [class~="text-red-700"],
html.dark [class~="text-red-800"],
html.dark [class~="text-red-900"] { color: #fca5a5; }

html.dark [class~="bg-rose-50"], html.dark [class*=" bg-rose-50/"], html.dark [class^="bg-rose-50/"],
html.dark [class~="bg-rose-100"], html.dark [class*=" bg-rose-100/"], html.dark [class^="bg-rose-100/"],
html.dark [class~="bg-rose-200"], html.dark [class*=" bg-rose-200/"], html.dark [class^="bg-rose-200/"] { background-color: rgba(244, 63, 94, 0.16); }
html.dark [class~="border-rose-100"],
html.dark [class~="border-rose-200"] { border-color: rgba(244, 63, 94, 0.4); }
html.dark [class~="text-rose-600"],
html.dark [class~="text-rose-700"],
html.dark [class~="text-rose-800"],
html.dark [class~="text-rose-900"] { color: #fda4af; }

html.dark [class~="bg-amber-50"], html.dark [class*=" bg-amber-50/"], html.dark [class^="bg-amber-50/"],
html.dark [class~="bg-amber-100"], html.dark [class*=" bg-amber-100/"], html.dark [class^="bg-amber-100/"],
html.dark [class~="bg-amber-200"], html.dark [class*=" bg-amber-200/"], html.dark [class^="bg-amber-200/"] { background-color: rgba(197, 168, 128, 0.16); }
html.dark [class~="border-amber-100"],
html.dark [class~="border-amber-200"] { border-color: rgba(197, 168, 128, 0.4); }
html.dark [class~="text-amber-600"],
html.dark [class~="text-amber-700"],
html.dark [class~="text-amber-800"],
html.dark [class~="text-amber-900"] { color: var(--arbor-dark-gold-bright); }

html.dark [class~="bg-orange-50"], html.dark [class*=" bg-orange-50/"], html.dark [class^="bg-orange-50/"],
html.dark [class~="bg-orange-100"], html.dark [class*=" bg-orange-100/"], html.dark [class^="bg-orange-100/"],
html.dark [class~="bg-orange-200"], html.dark [class*=" bg-orange-200/"], html.dark [class^="bg-orange-200/"] { background-color: rgba(249, 115, 22, 0.16); }
html.dark [class~="border-orange-100"],
html.dark [class~="border-orange-200"] { border-color: rgba(249, 115, 22, 0.4); }
html.dark [class~="text-orange-600"],
html.dark [class~="text-orange-700"],
html.dark [class~="text-orange-800"],
html.dark [class~="text-orange-900"] { color: #fdba74; }

html.dark [class~="bg-yellow-50"], html.dark [class*=" bg-yellow-50/"], html.dark [class^="bg-yellow-50/"],
html.dark [class~="bg-yellow-100"], html.dark [class*=" bg-yellow-100/"], html.dark [class^="bg-yellow-100/"],
html.dark [class~="bg-yellow-200"], html.dark [class*=" bg-yellow-200/"], html.dark [class^="bg-yellow-200/"] { background-color: rgba(234, 179, 8, 0.16); }
html.dark [class~="border-yellow-100"],
html.dark [class~="border-yellow-200"] { border-color: rgba(234, 179, 8, 0.4); }
html.dark [class~="text-yellow-600"],
html.dark [class~="text-yellow-700"],
html.dark [class~="text-yellow-800"],
html.dark [class~="text-yellow-900"] { color: #fde047; }

/* emerald = "sucesso/concluído" na maior parte do app (ex. chip "Visita
   Realizada") — usa o verde Arbor de identidade em vez de um verde genérico,
   pra manter a marca mesmo nos estados semânticos. */
html.dark [class~="bg-emerald-50"], html.dark [class*=" bg-emerald-50/"], html.dark [class^="bg-emerald-50/"],
html.dark [class~="bg-emerald-100"], html.dark [class*=" bg-emerald-100/"], html.dark [class^="bg-emerald-100/"],
html.dark [class~="bg-emerald-200"], html.dark [class*=" bg-emerald-200/"], html.dark [class^="bg-emerald-200/"] { background-color: rgba(58, 145, 114, 0.16); }
html.dark [class~="border-emerald-100"],
html.dark [class~="border-emerald-200"] { border-color: rgba(58, 145, 114, 0.4); }
html.dark [class~="text-emerald-600"],
html.dark [class~="text-emerald-700"],
html.dark [class~="text-emerald-800"],
html.dark [class~="text-emerald-900"] { color: var(--arbor-dark-green-bright); }

html.dark [class~="bg-green-50"], html.dark [class*=" bg-green-50/"], html.dark [class^="bg-green-50/"],
html.dark [class~="bg-green-100"], html.dark [class*=" bg-green-100/"], html.dark [class^="bg-green-100/"],
html.dark [class~="bg-green-200"], html.dark [class*=" bg-green-200/"], html.dark [class^="bg-green-200/"] { background-color: rgba(34, 197, 94, 0.16); }
html.dark [class~="border-green-100"],
html.dark [class~="border-green-200"] { border-color: rgba(34, 197, 94, 0.4); }
html.dark [class~="text-green-600"],
html.dark [class~="text-green-700"],
html.dark [class~="text-green-800"],
html.dark [class~="text-green-900"] { color: #86efac; }

html.dark [class~="bg-teal-50"], html.dark [class*=" bg-teal-50/"], html.dark [class^="bg-teal-50/"],
html.dark [class~="bg-teal-100"], html.dark [class*=" bg-teal-100/"], html.dark [class^="bg-teal-100/"],
html.dark [class~="bg-teal-200"], html.dark [class*=" bg-teal-200/"], html.dark [class^="bg-teal-200/"] { background-color: rgba(20, 184, 166, 0.16); }
html.dark [class~="border-teal-100"],
html.dark [class~="border-teal-200"] { border-color: rgba(20, 184, 166, 0.4); }
html.dark [class~="text-teal-600"],
html.dark [class~="text-teal-700"],
html.dark [class~="text-teal-800"],
html.dark [class~="text-teal-900"] { color: #5eead4; }

html.dark [class~="bg-cyan-50"], html.dark [class*=" bg-cyan-50/"], html.dark [class^="bg-cyan-50/"],
html.dark [class~="bg-cyan-100"], html.dark [class*=" bg-cyan-100/"], html.dark [class^="bg-cyan-100/"],
html.dark [class~="bg-cyan-200"], html.dark [class*=" bg-cyan-200/"], html.dark [class^="bg-cyan-200/"] { background-color: rgba(6, 182, 212, 0.16); }
html.dark [class~="border-cyan-100"],
html.dark [class~="border-cyan-200"] { border-color: rgba(6, 182, 212, 0.4); }
html.dark [class~="text-cyan-600"],
html.dark [class~="text-cyan-700"],
html.dark [class~="text-cyan-800"],
html.dark [class~="text-cyan-900"] { color: #67e8f9; }

html.dark [class~="bg-sky-50"], html.dark [class*=" bg-sky-50/"], html.dark [class^="bg-sky-50/"],
html.dark [class~="bg-sky-100"], html.dark [class*=" bg-sky-100/"], html.dark [class^="bg-sky-100/"],
html.dark [class~="bg-sky-200"], html.dark [class*=" bg-sky-200/"], html.dark [class^="bg-sky-200/"] { background-color: rgba(14, 165, 233, 0.16); }
html.dark [class~="border-sky-100"],
html.dark [class~="border-sky-200"] { border-color: rgba(14, 165, 233, 0.4); }
html.dark [class~="text-sky-600"],
html.dark [class~="text-sky-700"],
html.dark [class~="text-sky-800"],
html.dark [class~="text-sky-900"] { color: #7dd3fc; }

html.dark [class~="bg-indigo-50"], html.dark [class*=" bg-indigo-50/"], html.dark [class^="bg-indigo-50/"],
html.dark [class~="bg-indigo-100"], html.dark [class*=" bg-indigo-100/"], html.dark [class^="bg-indigo-100/"],
html.dark [class~="bg-indigo-200"], html.dark [class*=" bg-indigo-200/"], html.dark [class^="bg-indigo-200/"] { background-color: rgba(99, 102, 241, 0.16); }
html.dark [class~="border-indigo-100"],
html.dark [class~="border-indigo-200"] { border-color: rgba(99, 102, 241, 0.4); }
html.dark [class~="text-indigo-600"],
html.dark [class~="text-indigo-700"],
html.dark [class~="text-indigo-800"],
html.dark [class~="text-indigo-900"] { color: #a5b4fc; }

html.dark [class~="bg-violet-50"], html.dark [class*=" bg-violet-50/"], html.dark [class^="bg-violet-50/"],
html.dark [class~="bg-violet-100"], html.dark [class*=" bg-violet-100/"], html.dark [class^="bg-violet-100/"],
html.dark [class~="bg-violet-200"], html.dark [class*=" bg-violet-200/"], html.dark [class^="bg-violet-200/"] { background-color: rgba(139, 92, 246, 0.16); }
html.dark [class~="border-violet-100"],
html.dark [class~="border-violet-200"] { border-color: rgba(139, 92, 246, 0.4); }
html.dark [class~="text-violet-600"],
html.dark [class~="text-violet-700"],
html.dark [class~="text-violet-800"],
html.dark [class~="text-violet-900"] { color: #c4b5fd; }

html.dark [class~="bg-purple-50"], html.dark [class*=" bg-purple-50/"], html.dark [class^="bg-purple-50/"],
html.dark [class~="bg-purple-100"], html.dark [class*=" bg-purple-100/"], html.dark [class^="bg-purple-100/"],
html.dark [class~="bg-purple-200"], html.dark [class*=" bg-purple-200/"], html.dark [class^="bg-purple-200/"] { background-color: rgba(168, 85, 247, 0.16); }
html.dark [class~="border-purple-100"],
html.dark [class~="border-purple-200"] { border-color: rgba(168, 85, 247, 0.4); }
html.dark [class~="text-purple-600"],
html.dark [class~="text-purple-700"],
html.dark [class~="text-purple-800"],
html.dark [class~="text-purple-900"] { color: #d8b4fe; }

html.dark [class~="bg-fuchsia-50"], html.dark [class*=" bg-fuchsia-50/"], html.dark [class^="bg-fuchsia-50/"],
html.dark [class~="bg-fuchsia-100"], html.dark [class*=" bg-fuchsia-100/"], html.dark [class^="bg-fuchsia-100/"],
html.dark [class~="bg-fuchsia-200"], html.dark [class*=" bg-fuchsia-200/"], html.dark [class^="bg-fuchsia-200/"] { background-color: rgba(217, 70, 239, 0.16); }
html.dark [class~="border-fuchsia-100"],
html.dark [class~="border-fuchsia-200"] { border-color: rgba(217, 70, 239, 0.4); }
html.dark [class~="text-fuchsia-600"],
html.dark [class~="text-fuchsia-700"],
html.dark [class~="text-fuchsia-800"],
html.dark [class~="text-fuchsia-900"] { color: #f0abfc; }

html.dark [class~="bg-pink-50"], html.dark [class*=" bg-pink-50/"], html.dark [class^="bg-pink-50/"],
html.dark [class~="bg-pink-100"], html.dark [class*=" bg-pink-100/"], html.dark [class^="bg-pink-100/"],
html.dark [class~="bg-pink-200"], html.dark [class*=" bg-pink-200/"], html.dark [class^="bg-pink-200/"] { background-color: rgba(236, 72, 153, 0.16); }
html.dark [class~="border-pink-100"],
html.dark [class~="border-pink-200"] { border-color: rgba(236, 72, 153, 0.4); }
html.dark [class~="text-pink-600"],
html.dark [class~="text-pink-700"],
html.dark [class~="text-pink-800"],
html.dark [class~="text-pink-900"] { color: #f9a8d4; }

html.dark [class~="bg-lime-50"], html.dark [class*=" bg-lime-50/"], html.dark [class^="bg-lime-50/"],
html.dark [class~="bg-lime-100"], html.dark [class*=" bg-lime-100/"], html.dark [class^="bg-lime-100/"],
html.dark [class~="bg-lime-200"], html.dark [class*=" bg-lime-200/"], html.dark [class^="bg-lime-200/"] { background-color: rgba(132, 204, 22, 0.16); }
html.dark [class~="border-lime-100"],
html.dark [class~="border-lime-200"] { border-color: rgba(132, 204, 22, 0.4); }
html.dark [class~="text-lime-600"],
html.dark [class~="text-lime-700"],
html.dark [class~="text-lime-800"],
html.dark [class~="text-lime-900"] { color: #bef264; }
