/* Yaye Dia Agro v2 — jetons de la charte (mêmes valeurs que js/ui/tailwind-theme.js) */
:root {
  /* Toutes les nuances de la charte (canaux dans couleurs.css, thème clair ou sombre) */
  --brand-50: rgb(var(--tw-brand-50)); --brand-100: rgb(var(--tw-brand-100)); --brand-200: rgb(var(--tw-brand-200)); --brand-300: rgb(var(--tw-brand-300)); --brand-400: rgb(var(--tw-brand-400)); --brand-500: rgb(var(--tw-brand-500)); --brand-600: rgb(var(--tw-brand-600)); --brand-700: rgb(var(--tw-brand-700)); --brand-800: rgb(var(--tw-brand-800)); --brand-900: rgb(var(--tw-brand-900)); --brand-950: rgb(var(--tw-brand-950));
  --leaf-50: rgb(var(--tw-leaf-50)); --leaf-100: rgb(var(--tw-leaf-100)); --leaf-200: rgb(var(--tw-leaf-200)); --leaf-300: rgb(var(--tw-leaf-300)); --leaf-400: rgb(var(--tw-leaf-400)); --leaf-500: rgb(var(--tw-leaf-500)); --leaf-600: rgb(var(--tw-leaf-600)); --leaf-700: rgb(var(--tw-leaf-700)); --leaf-800: rgb(var(--tw-leaf-800)); --leaf-900: rgb(var(--tw-leaf-900)); --leaf-950: rgb(var(--tw-leaf-950));
  --red-50: rgb(var(--tw-red-50)); --red-100: rgb(var(--tw-red-100)); --red-200: rgb(var(--tw-red-200)); --red-300: rgb(var(--tw-red-300)); --red-400: rgb(var(--tw-red-400)); --red-500: rgb(var(--tw-red-500)); --red-600: rgb(var(--tw-red-600)); --red-700: rgb(var(--tw-red-700)); --red-800: rgb(var(--tw-red-800)); --red-900: rgb(var(--tw-red-900)); --red-950: rgb(var(--tw-red-950));
  --amber-50: rgb(var(--tw-amber-50)); --amber-100: rgb(var(--tw-amber-100)); --amber-200: rgb(var(--tw-amber-200)); --amber-300: rgb(var(--tw-amber-300)); --amber-400: rgb(var(--tw-amber-400)); --amber-500: rgb(var(--tw-amber-500)); --amber-600: rgb(var(--tw-amber-600)); --amber-700: rgb(var(--tw-amber-700)); --amber-800: rgb(var(--tw-amber-800)); --amber-900: rgb(var(--tw-amber-900)); --amber-950: rgb(var(--tw-amber-950));
  --info-50: rgb(var(--tw-info-50)); --info-100: rgb(var(--tw-info-100)); --info-200: rgb(var(--tw-info-200)); --info-300: rgb(var(--tw-info-300)); --info-400: rgb(var(--tw-info-400)); --info-500: rgb(var(--tw-info-500)); --info-600: rgb(var(--tw-info-600)); --info-700: rgb(var(--tw-info-700)); --info-800: rgb(var(--tw-info-800)); --info-900: rgb(var(--tw-info-900)); --info-950: rgb(var(--tw-info-950));
  --plum-50: rgb(var(--tw-plum-50)); --plum-100: rgb(var(--tw-plum-100)); --plum-200: rgb(var(--tw-plum-200)); --plum-300: rgb(var(--tw-plum-300)); --plum-400: rgb(var(--tw-plum-400)); --plum-500: rgb(var(--tw-plum-500)); --plum-600: rgb(var(--tw-plum-600)); --plum-700: rgb(var(--tw-plum-700)); --plum-800: rgb(var(--tw-plum-800)); --plum-900: rgb(var(--tw-plum-900)); --plum-950: rgb(var(--tw-plum-950));
  --ink-50: rgb(var(--tw-ink-50)); --ink-100: rgb(var(--tw-ink-100)); --ink-200: rgb(var(--tw-ink-200)); --ink-300: rgb(var(--tw-ink-300)); --ink-400: rgb(var(--tw-ink-400)); --ink-500: rgb(var(--tw-ink-500)); --ink-600: rgb(var(--tw-ink-600)); --ink-700: rgb(var(--tw-ink-700)); --ink-800: rgb(var(--tw-ink-800)); --ink-900: rgb(var(--tw-ink-900)); --ink-950: rgb(var(--tw-ink-950));

  /* Sémantique */
  --color-bg: var(--ink-50);
  --color-surface: rgb(var(--tw-surface));
  --color-border: var(--ink-200);
  --color-border-strong: var(--ink-300);
  --color-text: var(--ink-800);
  --color-text-muted: var(--ink-500);
  --color-primary: var(--brand-600);
  --color-primary-hover: var(--brand-700);
  --color-danger: var(--red-500);
  --color-focus: var(--brand-200);

  /* Formes et profondeur */
  --radius-control: 8px;
  --radius-container: 12px;
  --shadow-card: 0 1px 2px rgba(24, 24, 24, 0.04), 0 1px 3px rgba(24, 24, 24, 0.06);
  --shadow-overlay: 0 12px 32px -8px rgba(24, 24, 24, 0.18), 0 4px 12px -4px rgba(24, 24, 24, 0.08);

  /* Typographie */
  --font-sans: 'Inter', system-ui, -apple-system, 'Segoe UI', Roboto, sans-serif;
  --text-page-title: 24px;
  --text-section: 18px;
  --text-body: 14px;
  --text-label: 13px;
  --text-small: 12px;

  /* Compatibilité avec les anciennes variables de main.css */
  --yaye-green: var(--brand-600);
  --yaye-green-dark: var(--brand-700);
  --yaye-green-light: var(--brand-300);
  --yaye-red: var(--red-500);
  --yaye-red-dark: var(--red-600);
  --yaye-red-light: var(--red-200);
  --gray-50: var(--ink-50); --gray-100: var(--ink-100); --gray-200: var(--ink-200); --gray-300: var(--ink-300);
  --gray-400: var(--ink-400); --gray-500: var(--ink-500); --gray-600: var(--ink-600); --gray-700: var(--ink-700);
  --gray-800: var(--ink-800); --gray-900: var(--ink-900);
}

html {
  -webkit-text-size-adjust: 100%;
}

body {
  font-family: var(--font-sans);
  font-size: var(--text-body);
  line-height: 1.55;
  color: var(--color-text);
  background-color: var(--color-bg);
  font-feature-settings: 'cv11', 'ss01';
  -webkit-font-smoothing: antialiased;
}

::selection {
  background: var(--brand-100);
  color: var(--brand-900);
}

/* Focus visible homogène (clavier) */
:where(a, button, input, select, textarea, [tabindex]):focus-visible {
  outline: 2px solid var(--brand-400);
  outline-offset: 2px;
}

/* Montants et chiffres alignés */
.tabular-nums, .montant {
  font-variant-numeric: tabular-nums;
}
.montant {
  white-space: nowrap;
}

/* Barres de défilement discrètes */
* {
  scrollbar-width: thin;
  scrollbar-color: var(--ink-300) transparent;
}
*::-webkit-scrollbar { width: 8px; height: 8px; }
*::-webkit-scrollbar-thumb { background: var(--ink-300); border-radius: 8px; }
*::-webkit-scrollbar-track { background: transparent; }
