/* ATOME — Design Tokens
 * Inclure une fois dans votre app (ex: src/styles/atome-tokens.css)
 * Utilisable via var(--atome-...) partout
 */

:root {
  /* Brand colors */
  --atome-ink: #0a1428;
  --atome-ink-soft: #152042;
  --atome-ink-deep: #050a18;
  --atome-paper: #f7f8fb;

  /* Primary blue (chip + brand) */
  --atome-blue: #3b6cd9;
  --atome-blue-deep: #1e3a8a;
  --atome-blue-light: #7aa3ff;

  /* Neural-network gradient (data-brain effect) */
  --atome-cyan: #22d3ee;
  --atome-violet: #a855f7;
  --atome-grad-brain: linear-gradient(135deg, #22d3ee 0%, #3b82f6 50%, #a855f7 100%);

  /* Accent (legacy orange — only for special states/highlights, optional) */
  --atome-accent: #ff7a3d;

  /* Typography */
  --atome-font-wordmark: 'Caveat', 'Dancing Script', cursive;
  --atome-font-body: 'Geist', 'Inter', system-ui, sans-serif;

  /* Radii */
  --atome-radius-sm: 6px;
  --atome-radius-md: 12px;
  --atome-radius-lg: 20px;
  --atome-radius-pill: 999px;

  /* Shadows */
  --atome-shadow-sm: 0 1px 2px rgba(10,20,40,0.06);
  --atome-shadow-md: 0 6px 20px rgba(10,20,40,0.08);
  --atome-shadow-lg: 0 20px 60px rgba(10,20,40,0.12);
  --atome-glow-blue: 0 0 24px rgba(59,108,217,0.35);
}

/* Dark theme override */
[data-theme="dark"] {
  --atome-paper: #0a1428;
  --atome-ink: #f7f8fb;
}

/* Wordmark utility */
.atome-wordmark {
  font-family: var(--atome-font-wordmark);
  font-style: italic;
  font-weight: 600;
  line-height: 1;
  letter-spacing: 0.01em;
}

/* Brand gradient text */
.atome-brand-text {
  background: var(--atome-grad-brain);
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
}