/*
 * Variables de design Maiven (chantier CSS, phase 4).
 *
 * Source unique des couleurs, tailles, espacements, rayons, ombres et z-index.
 * Tout nouveau CSS utilise ces variables : jamais de couleur ou de taille en dur.
 * Choix valides le 2026-10-03 sur /entreprise/styleguide/ : primaire #0055FF,
 * gris Slate, etats Argon, 9 tailles de texte. Chargees par
 * templates/shared/reuse/argon_css.html (toutes les bases).
 */
:root {
  /* --- Primaire ------------------------------------------------------- */
  --mv-primary: #0055ff;
  --mv-primary-hover: #0044cc;
  --mv-primary-dark: #0f16bf;
  --mv-primary-50: #eff6ff;
  --mv-primary-100: #dbeafe;
  --mv-primary-200: #bfdbfe;
  --mv-primary-300: #93c5fd;
  --mv-primary-focus-ring: 0 0 0 3px rgba(0, 85, 255, 0.12);

  /* --- Gris (Slate) --------------------------------------------------- */
  --mv-white: #ffffff;
  --mv-gray-50: #f8fafc;
  --mv-gray-100: #f1f5f9;
  --mv-gray-200: #e2e8f0;
  --mv-gray-300: #cbd5e1;
  --mv-gray-400: #94a3b8;
  --mv-gray-500: #64748b;
  --mv-gray-600: #475569;
  --mv-gray-700: #334155;
  --mv-gray-800: #1e293b;
  --mv-gray-900: #0f172a;

  /* Roles (a utiliser de preference aux teintes brutes) */
  --mv-text-heading: var(--mv-gray-900);
  --mv-text-strong: var(--mv-gray-700);
  --mv-text: var(--mv-gray-500);
  --mv-text-muted: var(--mv-gray-400);
  --mv-text-disabled: var(--mv-gray-300);
  --mv-border: var(--mv-gray-300);
  --mv-divider: var(--mv-gray-200);
  --mv-surface: var(--mv-white);
  --mv-surface-muted: var(--mv-gray-50);

  /* --- Etats (Argon) -------------------------------------------------- */
  --mv-success: #2dce89;
  --mv-danger: #f5365c;
  --mv-warning: #fb6340;
  --mv-info: #11cdef;
  /* Variantes lisibles en texte et fonds doux, derivees de la teinte d'etat */
  --mv-success-text: color-mix(in srgb, var(--mv-success) 60%, #000);
  --mv-danger-text: color-mix(in srgb, var(--mv-danger) 75%, #000);
  --mv-warning-text: color-mix(in srgb, var(--mv-warning) 70%, #000);
  --mv-info-text: color-mix(in srgb, var(--mv-info) 60%, #000);
  --mv-success-soft: color-mix(in srgb, var(--mv-success) 10%, #fff);
  --mv-danger-soft: color-mix(in srgb, var(--mv-danger) 8%, #fff);
  --mv-warning-soft: color-mix(in srgb, var(--mv-warning) 10%, #fff);
  --mv-info-soft: color-mix(in srgb, var(--mv-info) 10%, #fff);

  /* --- Typographie ---------------------------------------------------- */
  --mv-font-sans: "Urbanist", sans-serif;
  --mv-font-mono: "SF Mono", Monaco, "Courier New", monospace;
  --mv-fs-2xs: 0.6875rem;  /* 11 px : interfaces denses (editeurs, panneaux) */
  --mv-fs-xs: 0.75rem;     /* 12 px : legendes, badges */
  --mv-fs-sm: 0.875rem;    /* 14 px : texte d'interface */
  --mv-fs-md: 1rem;        /* 16 px : texte courant */
  --mv-fs-lg: 1.125rem;    /* 18 px : intertitres */
  --mv-fs-xl: 1.25rem;     /* 20 px : titres de carte */
  --mv-fs-2xl: 1.5rem;     /* 24 px : titres de section */
  --mv-fs-3xl: 2rem;       /* 32 px : titres de page */
  --mv-fs-4xl: 2.5rem;     /* 40 px : accroches */
  --mv-fw-regular: 400;
  --mv-fw-medium: 500;
  --mv-fw-semibold: 600;
  --mv-fw-bold: 700;
  --mv-lh-tight: 1.2;
  --mv-lh-normal: 1.5;

  /* --- Espacements (base 4 px) ---------------------------------------- */
  --mv-space-1: 0.25rem;   /* 4 px */
  --mv-space-1-5: 0.375rem;/* 6 px */
  --mv-space-2: 0.5rem;    /* 8 px */
  --mv-space-3: 0.75rem;   /* 12 px */
  --mv-space-4: 1rem;      /* 16 px */
  --mv-space-5: 1.25rem;   /* 20 px */
  --mv-space-6: 1.5rem;    /* 24 px */
  --mv-space-8: 2rem;      /* 32 px */
  --mv-space-10: 2.5rem;   /* 40 px */
  --mv-space-12: 3rem;     /* 48 px */

  /* --- Rayons --------------------------------------------------------- */
  --mv-radius-xs: 4px;
  --mv-radius-sm: 6px;
  --mv-radius-md: 8px;
  --mv-radius-lg: 12px;
  --mv-radius-xl: 16px;
  --mv-radius-pill: 999px;
  --mv-radius-round: 50%;

  /* --- Ombres --------------------------------------------------------- */
  --mv-shadow-sm: 0 1px 2px rgba(15, 23, 42, 0.06);
  --mv-shadow-md: 0 2px 8px rgba(15, 23, 42, 0.08);
  --mv-shadow-lg: 0 8px 24px rgba(15, 23, 42, 0.1);
  --mv-shadow-xl: 0 16px 40px rgba(15, 23, 42, 0.14);

  /* --- Z-index (alignes sur Bootstrap) -------------------------------- */
  --mv-z-base: 1;
  --mv-z-raised: 10;
  --mv-z-dropdown: 1000;
  --mv-z-sticky: 1020;
  --mv-z-fixed: 1030;
  --mv-z-offcanvas: 1045;
  --mv-z-modal-backdrop: 1050;
  --mv-z-modal: 1055;
  --mv-z-popover: 1070;
  --mv-z-tooltip: 1080;
  --mv-z-toast: 1090;
  --mv-z-overlay: 2000;     /* surcouches applicatives au-dessus des modales (chat, menus contextuels) */

  /* --- Mouvement ------------------------------------------------------ */
  --mv-transition-fast: 0.15s ease;
  --mv-transition: 0.25s ease;
}