/* recursos/css/variables.css
 * SPDX-License-Identifier: MIT
 * SPDX-FileCopyrightText: 2026 RiLi Platform S. de R.L. de C.V. <contacto@rili.mx>
 * Variables de diseño e identidad visual de la plataforma RiLi
 */

@import url('https://fonts.googleapis.com/css2?family=Plus+Jakarta+Sans:wght@400;500;600;700;800&family=Inter:wght@300;400;500;600;700&family=JetBrains+Mono:wght@400;600&display=swap');

:root,
body.theme-dark {
  /* Tipografía ejecutiva RiLi */
  --r-main-font: 'Inter', system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
  --r-heading-font: 'Plus Jakarta Sans', 'Inter', system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
  --r-code-font: 'JetBrains Mono', monospace;

  /* Colores principales RiLi (Modo Obscuro) */
  --rili-blue-primary: #2563eb;
  --rili-blue-hover: #1d4ed8;
  --rili-blue-light: #38bdf8;
  --rili-blue-gradient: linear-gradient(135deg, #60a5fa 0%, #2563eb 60%, #1d4ed8 100%);
  --rili-emerald-accent: #10b981;
  --rili-emerald-glow: rgba(16, 185, 129, 0.35);


  /* Variables Reveal.js base */
  --r-background-color: #0b0f19;
  --r-main-color: #f1f5f9;
  --r-heading-color: #38bdf8;
  --r-heading-gradient: var(--rili-blue-gradient);
  --r-h2-color: #60a5fa;
  --r-h2-border: rgba(37, 99, 235, 0.35);
  --r-h3-color: #94a3b8;
  --r-strong-color: #ffffff;
  --r-em-color: #38bdf8;
  --r-link-color: #38bdf8;
  --r-link-color-hover: #60a5fa;
  --r-selection-background-color: rgba(37, 99, 235, 0.4);
  --r-selection-color: #ffffff;

  /* Tarjetas y superficies */
  --r-card-bg: rgba(15, 23, 42, 0.75);
  --r-card-border: rgba(37, 99, 235, 0.25);
  --r-card-shadow: 0 10px 35px rgba(0, 0, 0, 0.55);

  /* Código */
  --r-code-bg: #070b16;
  --r-code-color: #e2e8f0;
  --r-code-border: rgba(37, 99, 235, 0.35);
  --r-inline-code-bg: rgba(37, 99, 235, 0.15);
  --r-inline-code-color: #60a5fa;

  /* Insignias e indicadores */
  --r-badge-bg: rgba(37, 99, 235, 0.15);
  --r-badge-border: rgba(37, 99, 235, 0.4);
  --r-badge-color: #60a5fa;
  --r-badge-accent-bg: rgba(16, 185, 129, 0.15);
  --r-badge-accent-border: rgba(16, 185, 129, 0.45);
  --r-badge-accent-color: #34d399;

  /* Barra de progreso y pie de diapositiva */
  --r-progress-color: #2563eb;
  --r-slide-number-bg: rgba(11, 15, 25, 0.75);
  --r-slide-number-color: #64748b;
  --r-diagram-bg: #070b16;
  --r-diagram-border: rgba(37, 99, 235, 0.3);
  --r-diagram-shadow: 0 8px 24px rgba(0, 0, 0, 0.5);
}

/* Modo Claro / Proyector de Alta Luminosidad */
html[data-theme="light"],
html.theme-light,
body.theme-light,
[data-theme="light"] {
  --r-background-color: #f8fafc;
  --r-main-color: #0f172a;
  --r-heading-color: #1e40af;
  --r-heading-gradient: linear-gradient(135deg, #1e40af 0%, #2563eb 60%, #0284c7 100%);
  --r-h2-color: #1d4ed8;
  --r-h2-border: rgba(29, 78, 216, 0.3);
  --r-h3-color: #475569;
  --r-strong-color: #020617;
  --r-em-color: #1d4ed8;
  --r-link-color: #2563eb;
  --r-link-color-hover: #1d4ed8;
  --r-selection-background-color: rgba(37, 99, 235, 0.25);
  --r-selection-color: #0f172a;

  /* Tarjetas y superficies claras */
  --r-card-bg: rgba(255, 255, 255, 0.92);
  --r-card-border: #cbd5e1;
  --r-card-shadow: 0 10px 25px rgba(0, 0, 0, 0.08);

  /* Código claro */
  --r-code-bg: #f1f5f9;
  --r-code-color: #0f172a;
  --r-code-border: #cbd5e1;
  --r-inline-code-bg: rgba(37, 99, 235, 0.08);
  --r-inline-code-color: #1d4ed8;

  /* Insignias claras */
  --r-badge-bg: rgba(37, 99, 235, 0.1);
  --r-badge-border: rgba(37, 99, 235, 0.3);
  --r-badge-color: #1d4ed8;
  --r-badge-accent-bg: rgba(16, 185, 129, 0.12);
  --r-badge-accent-border: rgba(16, 185, 129, 0.35);
  --r-badge-accent-color: #047857;

  --r-progress-color: #2563eb;
  --r-slide-number-bg: rgba(248, 250, 252, 0.85);
  --r-slide-number-color: #64748b;
  --r-diagram-bg: #ffffff;
  --r-diagram-border: #cbd5e1;
  --r-diagram-shadow: 0 8px 25px rgba(0, 0, 0, 0.08);
}