/*
  theme.css — Tokens de marca compartidos (geostation.site)
  ==========================================================
  Paridad VISUAL con geodata.site / geonation.site (colores, tipografía,
  layout). Reimplementación propia — geostation.site no comparte código,
  base de datos ni infraestructura con esos proyectos, solo el lenguaje
  visual del grupo. Mismos valores que geonation.site/assets/css/theme.css.
*/

:root {
  /* Fondo oscuro (hero, login, franjas de portada) */
  --brand-navy-950: #0A1A2F;
  --brand-navy-900: #0B2134;
  --brand-navy-800: #1e293b;

  /* Acentos */
  --brand-gradient-highlight: linear-gradient(90deg, #34D399, #22D3EE); /* esmeralda → cian, texto destacado */
  --brand-dot-accent: #34D399;
  --brand-cyan: #0078D4;
  --brand-blue: #1565C0;
  --brand-cta-gradient: linear-gradient(135deg, #1565C0, #0078D4);      /* botones primarios */
  --brand-glow: rgba(0, 120, 212, 0.12);

  /* Panel claro (contenido, tarjetas) */
  --brand-white: #ffffff;
  --brand-bg-deep: #F0F2F5;
  --brand-gray-50: #F7F8FA;
  --brand-bg-hover: #EDF0F4;
  --brand-border-light: #E2E5EA;

  /* Texto */
  --brand-text-light: #f1f5f9;
  --brand-text-muted-onlight: rgba(255, 255, 255, 0.72);
  --brand-text-dark: #1A1A2E;
  --brand-text-dark-muted: #5F6B7A;
  --brand-text-dim: #9CA3AF;

  /* Estados */
  --brand-success: #16A34A;
  --brand-amber: #D97706;
  --brand-red: #DC2626;

  /* Tipografía */
  --brand-font: 'Inter', -apple-system, "Segoe UI", Roboto, sans-serif;
  --brand-font-mono: 'JetBrains Mono', 'SFMono-Regular', Consolas, monospace;

  /* Radios, sombras, transiciones (base para los efectos hover del sitio) */
  --brand-radius-pill: 999px;
  --brand-radius-card: 14px;
  --brand-shadow-sm: 0 1px 3px rgba(0,0,0,.08);
  --brand-shadow-md: 0 4px 12px rgba(0,0,0,.1);
  --brand-shadow-lg: 0 16px 40px rgba(10,26,47,.16);
  --brand-ease: cubic-bezier(.4,0,.2,1);
}

* { box-sizing: border-box; }
html, body { margin: 0; padding: 0; }
body {
  font-family: var(--brand-font);
  color: var(--brand-text-dark);
  background: var(--brand-bg-deep);
}
button, input, select, textarea { font-family: inherit; }
a { text-decoration: none; color: inherit; }
img { max-width: 100%; display: block; }
