/* ==============================================================================
   ByteFactura — Design Tokens: Minimalismo Financiero de Alta Gama
   ============================================================================== */

:root {
  /* Paleta Editorial & Financiera */
  --tinta: #090d16;
  --tinta-2: #1e293b;
  --texto: #0f172a;
  --texto-2: #475569;
  --texto-3: #64748b;

  /* Superficies y Bordes (1px Hairline) */
  --papel: #f8fafc;
  --hoja: #ffffff;
  --linea: #e2e8f0;
  --linea-fuerte: #cbd5e1;

  /* Identidad ByteFactura */
  --marca: #090d16;
  --marca-osc: #1e293b;
  --marca-azul: #1d4ed8;
  --marca-claro: #eff6ff;

  /* Acento Ejecutivo */
  --acento: #1d4ed8;
  --acento-hover: #1e40af;

  /* Estados Semánticos */
  --ok: #059669;
  --ok-bg: #ecfdf5;
  --aviso: #d97706;
  --aviso-bg: #fffbeb;
  --error: #dc2626;
  --error-bg: #fef2f2;

  /* Radios de curvatura */
  --r-s: 6px;
  --r: 10px;
  --r-l: 14px;
  --r-xl: 18px;

  /* Tipografías */
  --f-titulo: 'Plus Jakarta Sans', system-ui, -apple-system, sans-serif;
  --f-texto: 'Inter', system-ui, -apple-system, 'Segoe UI', Roboto, sans-serif;
  --f-num: 'Inter', system-ui, -apple-system, 'Segoe UI', sans-serif;

  /* Elevaciones sutiles */
  --sombra-papel: 0 1px 2px rgba(9, 13, 22, 0.04);
  --sombra-elevada: 0 12px 32px -8px rgba(9, 13, 22, 0.08), 0 2px 6px rgba(9, 13, 22, 0.03);
  --sombra-modal: 0 24px 48px -12px rgba(9, 13, 22, 0.18);

  /* Transiciones */
  --t-rapida: 0.15s cubic-bezier(0.16, 1, 0.3, 1);
  --t-media: 0.25s cubic-bezier(0.16, 1, 0.3, 1);
}

/* Modo Oscuro para la plataforma SaaS */
[data-tema="oscuro"] {
  --tinta: #f8fafc;
  --tinta-2: #e2e8f0;
  --texto: #f1f5f9;
  --texto-2: #94a3b8;
  --texto-3: #64748b;

  --papel: #090d16;
  --hoja: #111827;
  --linea: #1e293b;
  --linea-fuerte: #334155;

  --marca: #2563eb;
  --marca-osc: #3b82f6;
  --marca-claro: rgba(37, 99, 235, 0.15);

  --ok: #34d399;
  --ok-bg: rgba(16, 185, 129, 0.14);
  --aviso: #fbbf24;
  --aviso-bg: rgba(245, 158, 11, 0.14);
  --error: #f87171;
  --error-bg: rgba(239, 68, 68, 0.14);

  --sombra-papel: 0 1px 3px rgba(0, 0, 0, 0.35);
  --sombra-elevada: 0 12px 32px rgba(0, 0, 0, 0.45);
}