/* css/variables.css */
:root {
  /* Paleta inspirada en Banco Internacional + Toque Zen/Lujoso */
  --color-primary: #004B87;      /* Azul profundo corporativo */
  --color-secondary: #00A3E0;    /* Cyan vibrante */
  --color-accent: #C9A961;       /* Dorado orgánico de lujo */
  --color-bg: #F9FAFB;           /* Fondo claro orgánico */
  --color-surface: #FFFFFF;      /* Superficies */
  --color-text: #1E293B;         /* Texto principal */
  --color-text-muted: #64748B;   /* Texto secundario */
  --color-border: #E2E8F0;
  
  /* Tipografía */
  --font-heading: 'Cormorant Garamond', serif;
  --font-body: 'Inter', sans-serif;
  
  /* Espaciado y Transiciones */
  --spacing-xs: 0.25rem;
  --spacing-sm: 0.5rem;
  --spacing-md: 1rem;
  --spacing-lg: 2rem;
  --spacing-xl: 4rem;
  --transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
  --border-radius: 8px;
  --shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -1px rgba(0, 0, 0, 0.06);
}

[data-theme="dark"] {
  --color-primary: #48C9B0;      /* Teal claro para contraste en oscuro */
  --color-secondary: #00A3E0;
  --color-accent: #E8D5B5;
  --color-bg: #0F172A;           /* Fondo oscuro profundo */
  --color-surface: #1E293B;
  --color-text: #F1F5F9;
  --color-text-muted: #94A3B8;
  --color-border: #334155;
  --shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.5);
}