/* ============================================================
   rx_core — Overlay de transição (CANÓNICO, partilhado)
   Usado por todas as páginas/produtos RX. Injetado por overlay.js.
   Fonte da verdade: extraído do index.html do ImóvelRX (estável).
   Inclui o congelamento de tema (solid-dark/solid-light) para o
   conteúdo não mudar de cor quando o tema muda por baixo.
   ============================================================ */

@keyframes theme-gate-spin { to { transform: rotate(360deg); } }

#transition-overlay { display: flex; opacity: 0; pointer-events: none; transition: opacity 0.15s; }
#transition-overlay.visible { opacity: 1; pointer-events: auto; }
#transition-overlay.solid { transition: none; } /* arranque: instantâneo, sem flash */

/* Overlay de transição (login/logout/voltar) — fundo esbatido como os modais. */
#transition-overlay {
  position: fixed;
  inset: 0;
  z-index: 10000;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 1rem;
  /* Mesmo backdrop dos restantes modais (padrão dash→rel). */
  background: rgba(0,0,0,0.6);
  backdrop-filter: blur(4px);
  -webkit-backdrop-filter: blur(4px);
  font-family: 'DM Sans', sans-serif;
}
html.light #transition-overlay { background: rgba(255,255,255,0.6); }
/* Variante opaca: usada no arranque/login/logout, para a transição vinda do
   callback (que é opaco) ser imperceptível e não se ver o #app a montar. */
#transition-overlay.solid { background: #0a0a0f; backdrop-filter: none; -webkit-backdrop-filter: none; }
html.light #transition-overlay.solid { background: #faf9f7; }

/* Variante: tapa só a área de conteúdo, mantendo a top bar visível
   (usada na transição relatório → análises). Fundo esbatido como os modais. */
#transition-overlay.content-only {
  top: var(--nav-h, 60px);
  background: rgba(0,0,0,0.6);
  backdrop-filter: blur(4px);
  -webkit-backdrop-filter: blur(4px);
}
html.light #transition-overlay.content-only {
  background: rgba(255,255,255,0.6);
}
#transition-overlay.visible { opacity: 1; pointer-events: auto; }
#transition-overlay .logo {
  font-family: 'Syne', sans-serif;
  font-size: 1.5rem;
  font-weight: 800;
  letter-spacing: -0.02em;
  color: #e8e8f0;
}
html.light #transition-overlay .logo { color: #1a1916; }
#transition-overlay .logo span { color: #f5a623; }
#transition-overlay .transition-spinner {
  width: 28px;
  height: 28px;
  border: 2px solid #ffffff18;
  border-top-color: #f5a623;
  border-radius: 50%;
  animation: theme-gate-spin 0.8s linear infinite;
  animation-play-state: running;
  will-change: transform;
}
html.light #transition-overlay .transition-spinner { border-color: #0000001e; border-top-color: #e8960f; }
#transition-overlay .transition-box {
  background: var(--ink-2, #16161f);
  border: 1px solid var(--wire, #ffffff12);
  border-radius: 16px;
  padding: 2rem 2.5rem;
  max-width: 360px;
  width: 90%;
  min-height: 220px;
  text-align: center;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 1rem;
}
html.light #transition-overlay .transition-box {
  background: var(--ink-2, #ffffff);
  border-color: var(--wire, #00000014);
}
#transition-overlay .transition-text {
  text-align: center;
  font-family: 'DM Sans', sans-serif;
  display: flex;
  flex-direction: column;
  gap: 1rem;
}
#transition-overlay .transition-title {
  font-size: 0.9375rem;
  font-weight: 600;
  color: #e8e8f0;
}
html.light #transition-overlay .transition-title { color: #1a1916; }
#transition-overlay .transition-sub {
  font-size: 0.75rem;
  color: #888898;
}
html.light #transition-overlay .transition-sub { color: #7a7670; }

/* Overlay opaco com tema congelado: o texto/logo seguem o tema CONGELADO no
   overlay (solid-dark/solid-light), não o html.light — assim não mudam de cor
   quando o tema muda por baixo (ex.: logout dark→light). */
#transition-overlay.solid-dark { background: #0a0a0f !important; }
#transition-overlay.solid-light { background: #faf9f7 !important; }
#transition-overlay.solid-dark .logo { color: #e8e8f0 !important; }
#transition-overlay.solid-dark .logo span { color: #f5a623 !important; }
#transition-overlay.solid-dark .transition-title { color: #e8e8f0 !important; }
#transition-overlay.solid-dark .transition-sub { color: #888898 !important; }
#transition-overlay.solid-dark .transition-spinner { border-color: #ffffff18 !important; border-top-color: #f5a623 !important; }
#transition-overlay.solid-dark .transition-box { background: #16161f !important; border-color: #ffffff12 !important; }
#transition-overlay.solid-light .logo { color: #1a1916 !important; }
#transition-overlay.solid-light .logo span { color: #f5a623 !important; }
#transition-overlay.solid-light .transition-title { color: #1a1916 !important; }
#transition-overlay.solid-light .transition-sub { color: #7a7670 !important; }
#transition-overlay.solid-light .transition-spinner { border-color: #0000001e !important; border-top-color: #e8960f !important; }
#transition-overlay.solid-light .transition-box { background: #ffffff !important; border-color: #00000014 !important; }