/* Jetons de design (design tokens) : toutes les couleurs, tailles et espacements de l'app.
   Un seul endroit à modifier pour changer l'apparence. Base : Human Interface Guidelines d'Apple. */
:root {
  color-scheme: light dark;
  --font: -apple-system, BlinkMacSystemFont, "SF Pro Text", "Helvetica Neue", "Segoe UI", Roboto, sans-serif;
  --font-mono: ui-monospace, "SF Mono", Menlo, monospace;

  /* Couleurs, mode clair */
  --bg: #F2F2F7;            /* fond groupé iOS */
  --bg-elev: #FFFFFF;       /* cartes, barres */
  --text: #000000;
  --text-2: rgba(60, 60, 67, 0.72);   /* secondaire, contraste 4,6 sur blanc */
  --text-3: rgba(60, 60, 67, 0.55);
  --sep: rgba(60, 60, 67, 0.18);
  --accent: #1E6F57;        /* vert Cockpit, contraste 5,9 sur blanc */
  --accent-soft: rgba(30, 111, 87, 0.12);
  --on-accent: #FFFFFF;
  --green: #1E7F4F;
  --red: #C0392B;
  --amber: #B26C16;
  --blue: #2C5A8C;
  --fill: rgba(120, 120, 128, 0.14);  /* boutons secondaires */
  --shadow: 0 1px 2px rgba(0, 0, 0, 0.05), 0 4px 14px rgba(0, 0, 0, 0.04);

  /* Rythme : grille de 8 pt */
  --s-1: 4px; --s-2: 8px; --s-3: 12px; --s-4: 16px; --s-5: 20px; --s-6: 24px; --s-8: 32px; --s-10: 40px;
  --r-card: 12px; --r-btn: 10px; --r-pill: 999px;
  --gutter: 16px;
  --sidenav-w: 240px;
  --tabbar-h: 56px;
  --dur: 180ms;
}

@media (prefers-color-scheme: dark) {
  :root {
    --bg: #000000;
    --bg-elev: #1C1C1E;
    --text: #FFFFFF;
    --text-2: rgba(235, 235, 245, 0.68);
    --text-3: rgba(235, 235, 245, 0.5);
    --sep: rgba(84, 84, 88, 0.6);
    --accent: #4CC38A;      /* contraste 7 sur #1C1C1E */
    --accent-soft: rgba(76, 195, 138, 0.16);
    --on-accent: #06281C;
    --green: #4CC38A;
    --red: #FF6B5E;
    --amber: #F0A945;
    --blue: #6AA7E8;
    --fill: rgba(120, 120, 128, 0.24);
    --shadow: none;
  }
}

@media (min-width: 900px) { :root { --gutter: 24px; } }