/* ===========================================================================
   Tema claro/escuro do App PWA — PontoFácil
   As cores de SUPERFÍCIE e TEXTO viram variáveis; as de MARCA (sky/blue/green
   /red/yellow) permanecem fixas. O padrão é escuro (igual ao original).
   =========================================================================== */
:root {
  --c-bg:     #050710;
  --c-topbar: #08101f;
  --c-card:   #0a1020;
  --c-camera: #02040e;
  --c-text:   #e2e8f8;
  --c-text2:  #cbd5e1;
  --c-muted:  #94a3b8;
  --c-muted2: #64748b;
  --c-subtle: #475569;
  --c-surface2: #1e293b;
  --c-border: rgba(56,189,248,0.1);
  --c-fill:   rgba(255,255,255,0.05);
}

[data-theme="light"] {
  --c-bg:     #eef2f7;
  --c-topbar: #ffffff;
  --c-card:   #ffffff;
  --c-camera: #0f172a;   /* preview de câmera continua escuro */
  --c-text:   #0f172a;
  --c-text2:  #334155;
  --c-muted:  #475569;
  --c-muted2: #64748b;
  --c-subtle: #64748b;
  --c-surface2: #e2e8f0;
  --c-border: rgba(15,23,42,0.10);
  --c-fill:   rgba(15,23,42,0.04);
}

/* Polimento extra do modo claro (sombras suaves nos cartões/topbar) */
[data-theme="light"] .card-dark,
[data-theme="light"] .card { box-shadow: 0 1px 3px rgba(15,23,42,0.06); }
[data-theme="light"] .topbar,
[data-theme="light"] .bottomnav { box-shadow: 0 1px 6px rgba(15,23,42,0.05); }

/* Botão flutuante de alternância de tema */
#pfThemeToggle {
  position: fixed; top: 10px; right: 12px; z-index: 9999;
  width: 38px; height: 38px; border-radius: 50%;
  border: 1px solid var(--c-border);
  background: var(--c-card); color: var(--c-text);
  font-size: 16px; line-height: 1; cursor: pointer;
  display: flex; align-items: center; justify-content: center;
  box-shadow: 0 2px 8px rgba(0,0,0,0.25);
}