/*
 * Any In IT - Design tokens globaux (architecture 3 couches)
 * ------------------------------------------------------------
 * Charge AVANT assets/css/custom.css, aux memes 4 points d'injection deja
 * existants (aucune nouvelle logique PHP, juste une ligne ajoutee a chacun) :
 *   - admin                 : application/helpers/assets_helper.php (_init_admin_assets)
 *   - portail client        : application/helpers/themes_helper.php (app_customers_head)
 *   - formulaires externes  : application/helpers/template_helper.php
 *   - page de connexion     : application/views/authentication/includes/head.php
 *
 * Architecture (Amazon/Material style a 3 couches) :
 *   A. PRIMITIVES  - echelles brutes (couleurs, rien d'autre ne doit lire
 *                    directement ces variables en dehors de la couche B).
 *   B. SEMANTIQUE  - "--color-*" nommes par intention (background, text,
 *                    border, primary, success...), chacun pointant vers
 *                    une primitive. C'est cette couche que [data-theme="dark"]
 *                    pourra un jour redefinir SEULE, sans toucher aux
 *                    primitives ni aux composants.
 *   C. COMPOSANTS  - tokens dedies a un composant (carte, bouton, input,
 *                    sidebar, header, modal), qui lisent la couche
 *                    semantique plutot que les primitives directement.
 *
 * Les primitives de bleu reprennent EXACTEMENT la couleur de marque deja en
 * production (--aiit-primary #2563eb / --aiit-primary-dark #1d4ed8 /
 * --aiit-primary-light #eff6ff / --aiit-primary-100 #dbeafe, definies dans
 * custom.css) : ce sont les valeurs Tailwind "blue-600/700/50/100", donc
 * l'echelle ci-dessous est completee avec les memes paliers Tailwind (50 a
 * 900) plutot qu'inventee. Idem pour les gris : les neutres deja en
 * production (--aiit-text #1e293b, --aiit-text-muted #64748b,
 * --aiit-text-faint #94a3b8) correspondent a l'echelle Tailwind "slate", on
 * la complete a l'identique.
 *
 * Aucune variable "a plat" historique n'est supprimee : elles restent
 * definies en bas de fichier en alias vers la nouvelle couche semantique,
 * pour compatibilite avec tout code qui les consommerait deja.
 */

:root {
    /* ==========================================================================
       A. PRIMITIVES - echelles brutes, ne pas utiliser hors de la couche B
       ========================================================================== */

    /* Bleu de marque (= Tailwind blue-*, aligne sur --aiit-primary* de custom.css) */
    --color-blue-50:  #eff6ff;
    --color-blue-100: #dbeafe;
    --color-blue-200: #bfdbfe;
    --color-blue-300: #93c5fd;
    --color-blue-400: #60a5fa;
    --color-blue-500: #3b82f6;
    --color-blue-600: #2563eb; /* = --aiit-primary */
    --color-blue-700: #1d4ed8; /* = --aiit-primary-dark */
    --color-blue-800: #1e40af;
    --color-blue-900: #1e3a8a;

    /* Neutres (= Tailwind slate-*, aligne sur --aiit-text* de custom.css) */
    --color-gray-0:   #ffffff;
    --color-gray-50:  #f8fafc; /* = --aiit-surface-alt */
    --color-gray-100: #f1f5f9;
    --color-gray-200: #e2e8f0;
    --color-gray-300: #cbd5e1;
    --color-gray-400: #94a3b8; /* = --aiit-text-faint */
    --color-gray-500: #64748b; /* = --aiit-text-muted */
    --color-gray-600: #475569;
    --color-gray-700: #334155;
    --color-gray-800: #1e293b; /* = --aiit-text */
    --color-gray-900: #0f172a;

    /* Statuts (couleurs deja en usage reel dans custom.css, non reinventees) */
    --color-green-500:  #16a34a; /* = --aiit-success */
    --color-amber-500:  #f59e0b; /* = --aiit-warning */
    --color-red-500:    #ef4444; /* = --aiit-danger */
    --color-sky-500:    #0ea5e9; /* = --aiit-info */

    /* ==========================================================================
       B. SEMANTIQUE - c'est cette couche qu'un futur [data-theme="dark"]
       redefinira seule (les composants ci-dessous ne lisent que ceci).
       ========================================================================== */

    --color-background:       #f6f8fb; /* = --aiit-bg, teinte propre au produit, hors echelle slate stricte */
    --color-surface:          var(--color-gray-0);
    --color-surface-elevated: var(--color-gray-0);
    --color-surface-alt:      var(--color-gray-50);

    --color-text:           var(--color-gray-800);
    --color-text-secondary: var(--color-gray-600);
    --color-text-muted:     var(--color-gray-500);
    --color-text-faint:     var(--color-gray-400);

    --color-border:        #e5e9f0; /* = --aiit-border, deja en production */
    --color-border-subtle: #eef1f6; /* = --aiit-border-light, deja en production */

    --color-primary:        var(--color-blue-600);
    --color-primary-hover:  var(--color-blue-700);
    --color-primary-active: var(--color-blue-800);
    --color-primary-subtle: var(--color-blue-50);
    --color-primary-subtle-strong: var(--color-blue-100);

    --color-success: var(--color-green-500);
    --color-warning: var(--color-amber-500);
    --color-danger:  var(--color-red-500);
    --color-info:    var(--color-sky-500);

    /* ==========================================================================
       Typographie
       ========================================================================== */

    --font-family-sans: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
    --font-family-mono: "SFMono-Regular", Consolas, "Liberation Mono", Menlo, monospace;

    --font-size-xs:   11.5px;
    --font-size-sm:   12.5px;
    --font-size-base: 14px;
    --font-size-md:   15px;
    --font-size-lg:   17px;
    --font-size-xl:   20px;
    --font-size-2xl:  24px;
    --font-size-3xl:  30px;

    --font-weight-regular:  400;
    --font-weight-medium:   500;
    --font-weight-semibold: 600;
    --font-weight-bold:     700;

    --line-height-tight:  1.15;
    --line-height-normal: 1.5;
    --line-height-loose:  1.7;

    /* ==========================================================================
       Spacing (base 4px, coherent avec les valeurs deja utilisees dans
       custom.css : 4/8/10/12/14/16/18/20/24/32/40...)
       ========================================================================== */

    --space-1:  4px;
    --space-2:  8px;
    --space-3:  12px;
    --space-4:  16px;
    --space-5:  20px;
    --space-6:  24px;
    --space-8:  32px;
    --space-10: 40px;
    --space-12: 48px;
    --space-16: 64px;
    --space-20: 80px;
    --space-24: 96px;

    /* ==========================================================================
       Radius (sm/md/lg alignes sur --aiit-radius-sm/-radius/-radius-lg deja
       en production ; xl/2xl/pill sont nouveaux, pour les futurs composants
       premium : heros, modales larges, badges pilule)
       ========================================================================== */

    --radius-sm:   8px;  /* = --aiit-radius-sm */
    --radius-md:   12px; /* = --aiit-radius */
    --radius-lg:   18px; /* = --aiit-radius-lg */
    --radius-xl:   24px;
    --radius-2xl:  32px;
    --radius-pill: 999px;

    /* ==========================================================================
       Ombres (xs/sm/md/lg alignees sur --aiit-shadow-sm/-shadow/-shadow-md/
       -shadow-lg deja en production ; xl nouvelle, tres sobre)
       ========================================================================== */

    --shadow-xs: 0 1px 2px rgba(15, 23, 42, 0.04);  /* = --aiit-shadow-sm */
    --shadow-sm: 0 2px 10px rgba(15, 23, 42, 0.06); /* = --aiit-shadow */
    --shadow-md: 0 8px 28px rgba(15, 23, 42, 0.10); /* = --aiit-shadow-md */
    --shadow-lg: 0 16px 48px rgba(15, 23, 42, 0.14);
    --shadow-xl: 0 24px 64px rgba(15, 23, 42, 0.18);

    /* ==========================================================================
       Motion - durees + easings. --duration-normal/-ease-standard
       reproduisent exactement --aiit-transition (all 0.18s ease) deja en
       production, pour pouvoir le faire pointer ici sans rien changer
       visuellement.
       ========================================================================== */

    --duration-instant: 0ms;
    --duration-fast:    120ms;
    --duration-normal:  180ms; /* = duree de --aiit-transition */
    --duration-slow:    320ms;

    --ease-standard:   ease; /* = easing de --aiit-transition (compat stricte) */
    --ease-emphasized: cubic-bezier(0.2, 0, 0, 1);
    --ease-enter:      cubic-bezier(0, 0, 0.2, 1);
    --ease-exit:       cubic-bezier(0.4, 0, 1, 1);

    --transition-base: all var(--duration-normal) var(--ease-standard);

    /* ==========================================================================
       Z-index - echelle nommee. #menu.sidebar utilise deja 1050 en mobile
       (custom.css) qui correspond a la valeur standard des modales
       Bootstrap 3 (volontaire, pour passer au-dessus du header en mobile) :
       on ne la change pas, on documente juste son equivalent nomme.
       ========================================================================== */

    --z-base:     1;
    --z-dropdown: 20;
    --z-sticky:   30;
    --z-sidebar:  40;
    --z-overlay:  1040;
    --z-modal:    1050; /* = z-index Bootstrap 3 standard des modales, deja en usage */
    --z-popover:  1060;
    --z-toast:    1070;

    /* ==========================================================================
       C. COMPOSANTS - lisent la couche semantique, jamais les primitives
       ========================================================================== */

    /* Carte / panel */
    --card-background: var(--color-surface);
    --card-border:     1px solid var(--color-border-subtle);
    --card-radius:     var(--radius-md);
    --card-padding:    var(--space-6);
    --card-shadow:     var(--shadow-sm);
    --card-shadow-hover: var(--shadow-md);

    /* Boutons */
    --button-height-sm: 30px;
    --button-height-md: 38px;
    --button-height-lg: 46px;
    --button-radius:    var(--radius-sm);

    /* Champs de formulaire */
    --input-height: 38px;
    --input-radius: var(--radius-sm);
    --input-border: 1px solid var(--color-border);
    --input-focus-ring: 0 0 0 3px var(--color-primary-subtle);

    /* Sidebar (largeur reelle = .sidebar en dur dans assets/css/style.css,
       core Perfex, non modifie ici ; --sidebar-collapsed-width est un
       token preparatoire pour un futur mode reduit, non branche sur du
       CSS existant aujourd'hui) */
    --sidebar-width:           230px; /* = .sidebar width, assets/css/style.css */
    --sidebar-collapsed-width: 64px;  /* reserve, aucun mode reduit actif actuellement */

    /* Header (hauteur reelle = #header height, assets/css/style.css) */
    --header-height: 57px;

    /* Modales */
    --modal-radius: var(--radius-md);
    --modal-shadow: var(--shadow-md);

    /* ==========================================================================
       Alias historiques (compatibilite) - noms "a plat" de la premiere
       version de ce fichier. Rien dans le code actuel ne les consomme
       (verifie), mais on les conserve pointant vers la nouvelle couche
       semantique/composant pour ne jamais casser un usage existant ou
       futur qui s'y referrerait.
       ========================================================================== */

    --bg:             var(--color-background);
    --bg-elevated:    var(--color-surface-elevated);
    --surface:        var(--color-surface);
    --surface-alt:    var(--color-surface-alt);
    --border:         var(--color-border);
    --border-light:   var(--color-border-subtle);

    --primary:       var(--color-primary);
    --primary-dark:  var(--color-primary-hover);
    --primary-light: var(--color-primary-subtle);
    --primary-100:   var(--color-primary-subtle-strong);

    --accent:  var(--color-success);
    --warning: var(--color-warning);
    --error:   var(--color-danger);
    --info:    var(--color-info);

    --text:       var(--color-text);
    --text-muted: var(--color-text-muted);
    --text-faint: var(--color-text-faint);

    --space-xs: var(--space-1);
    --space-sm: var(--space-2);
    --space-md: var(--space-4);
    --space-lg: var(--space-6);
    --space-xl: var(--space-10);

    --radius-sm-legacy: var(--radius-sm);
    --radius-md-legacy: var(--radius-md);
    --radius-lg-legacy: var(--radius-lg);

    --shadow-sm-legacy: var(--shadow-xs);
    --shadow-md-legacy: var(--shadow-md);
    --shadow-lg-legacy: var(--shadow-lg);

    --duration-fast-legacy: var(--duration-fast);
    --duration-base:        var(--duration-normal);
    --duration-slow-legacy: var(--duration-slow);
}

/*
 * Dark mode - PAS ACTIVE dans cette passe. Cette regle est volontairement
 * absente : la couche B (semantique) ci-dessus est prete a etre redefinie
 * dans un futur bloc [data-theme="dark"] { --color-background: ...; ... },
 * sans toucher aux primitives (couche A) ni aux tokens composants
 * (couche C), qui continueront de lire la couche B automatiquement.
 */