/* ============================================================
   PaysagePro — 00-tokens.css
   Source unique de verite des variables de design.
   Aucune regle de rendu ici : uniquement des declarations custom.

   Organisation du fichier :
     1. schema de couleur natif (color-scheme, pilote light-dark()) ;
     2. palette HISTORIQUE, sous [data-pp-skin="legacy"] — conservee
        uniquement pour comparer en developpement ;
     3. echelles structurelles (espace, rayons, z-index, duree,
        gabarit) — independantes du skin ;
     4. palette v2, qui est le DEFAUT depuis la v1.41.0 ;
     5. typographie ;
     6. repli pour les navigateurs sans light-dark().

   Un seul bloc par theme grace a light-dark() : l'ancien socle
   dupliquait 23 lignes a l'identique entre [data-theme=dark] et
   @media (prefers-color-scheme: dark).
   ============================================================ */

/* ------------------------------------------------------------
   Schema de couleur natif.
   Pilote light-dark() ET les widgets natifs (scrollbars, date pickers,
   champs de formulaire), qui suivaient jusqu'ici l'OS et non le theme
   applicatif. color-scheme est heritable : poser data-theme sur
   n'importe quel element bascule tout son sous-arbre.
   ------------------------------------------------------------ */
:root                { color-scheme: light dark; }
[data-theme="sun"]   { color-scheme: light; }
[data-theme="dark"]  { color-scheme: dark; }
[data-theme="auto"]  { color-scheme: light dark; }

[data-pp-skin="legacy"] {
  /* --- Rampe verte historique (comparaison uniquement) --------------- */
  --pp-green-900: light-dark(#1b3a2b, #95d5b2);
  --pp-green-700: light-dark(#2d6a4f, #74c69d);
  --pp-green-500: light-dark(#40916c, #52b788);
  --pp-green-300: light-dark(#95d5b2, #40916c);
  --pp-green-100: light-dark(#d8f3dc, #1e3a2a);

  /* --- Couleur de marque -------------------------------------------
     Surchargee par BrandingService quand le tenant a une couleur custom.
     Definie ici pour que les feuilles zip-v31-* cessent de retomber
     sur leur fallback #1a8a4f, et pour que la page de connexion
     (minimal.php, sans injection de branding) reste dans la palette. */
  --pp-primary:       light-dark(#2d6a4f, #74c69d);
  --pp-primary-hover: light-dark(#1b3a2b, #95d5b2);
  --pp-primary-on:    #ffffff;

  /* --- Surfaces et texte -------------------------------------------- */
  --pp-bg:           light-dark(#f7faf8, #0d1310);
  --pp-text:         light-dark(#1a2e22, #e8ece9);
  --pp-muted:        light-dark(#5b6d62, #8fa197);
  --pp-border:       light-dark(#dce5df, #2a3530);
  --pp-card-bg:      light-dark(#ffffff, #1a1f1d);
  --pp-header-bg:    light-dark(#ffffff, #1a1f1d);
  --pp-sidebar-bg:   light-dark(#1b3a2b, #0b1810);
  --pp-sidebar-text: light-dark(#ffffff, #d4ebdb);

  /* --- Champs de saisie ---------------------------------------------
     --pp-input-bg-hover etait referencee 3 fois sans jamais exister. */
  --pp-input-bg:       light-dark(#ffffff, #1f2624);
  --pp-input-bg-hover: light-dark(#f0f7f3, #262e2b);

  /* --- Liens ---------------------------------------------------------
     Idem : breadcrumb-trail.css:35,41 tombait sur #4b6cb7 / #2d4373,
     seuls bleus de toute l'application. */
  --pp-link:       var(--pp-green-700);
  --pp-link-hover: var(--pp-green-900);

  /* --- Couleurs semantiques ------------------------------------------
     Les teintes de premier plan n'etaient pas redefinies en sombre dans
     l'ancien app.css : comportement conserve a l'identique ici, corrige
     au lot 1.38.0 avec les contrastes mesures. */
  --pp-success:    #2d6a4f;
  --pp-success-bg: light-dark(#eaf5ef, #1e3a2a);
  --pp-warning:    #d68d00;
  --pp-warning-bg: light-dark(#fdf3df, #3a2f18);
  --pp-danger:     #b8251b;
  --pp-danger-bg:  light-dark(#fbebea, #3a1c1a);
  --pp-info:       #3a6fa0;
  --pp-info-bg:    light-dark(#e8f0f8, #1a2838);

  /* --- Ombres et rayons ----------------------------------------------
     light-dark() ne resout que des COULEURS : les ombres se composent
     donc a partir de couleurs tokenisees, pas d'une liste d'ombres. */
  --pp-shadow-c1: light-dark(rgba(27, 58, 43, 0.08), rgba(0, 0, 0, 0.40));
  --pp-shadow-c2: light-dark(rgba(27, 58, 43, 0.04), rgba(0, 0, 0, 0.25));
  --pp-shadow-c3: light-dark(rgba(27, 58, 43, 0.12), rgba(0, 0, 0, 0.50));
  --pp-shadow:    0 1px 3px var(--pp-shadow-c1), 0 4px 12px var(--pp-shadow-c2);
  --pp-shadow-lg: 0 4px 16px var(--pp-shadow-c3);
  --pp-radius:    8px;
  --pp-radius-lg: 12px;

}

/* ============================================================
   ECHELLES STRUCTURELLES

   Independantes du skin : elles ne portent aucune couleur et sont
   consommees par 20-layout.css et 30-components.css.
   ============================================================ */
:root {
  /* Espacement, base 4 */
  --pp-space-0:  0;
  --pp-space-1:  4px;
  --pp-space-2:  8px;
  --pp-space-3:  12px;
  --pp-space-4:  16px;
  --pp-space-5:  20px;
  --pp-space-6:  24px;
  --pp-space-7:  28px;
  --pp-space-8:  32px;
  --pp-space-10: 40px;
  --pp-space-12: 48px;
  --pp-space-16: 64px;

  /* Rayons complets */
  --pp-radius-xs:   4px;
  --pp-radius-sm:   6px;
  --pp-radius-md:   10px;
  --pp-radius-xl:   20px;
  --pp-radius-full: 999px;

  /* Empilement — remplace les valeurs anarchiques de l'ancien socle
     (10, 50, 100, 998, 999, 1000, 1200, 9999, 10000, 10001). */
  --pp-z-hide:     -1;
  --pp-z-base:      1;
  --pp-z-sticky:  100;
  --pp-z-header:  200;
  --pp-z-scrim:   300;
  --pp-z-sidebar: 310;
  --pp-z-dropdown:400;
  --pp-z-popover: 500;
  --pp-z-modal:   600;
  --pp-z-toast:   700;
  --pp-z-tooltip: 800;

  /* Mouvement */
  --pp-dur-instant: 80ms;
  --pp-dur-fast:    140ms;
  --pp-dur-base:    200ms;
  --pp-dur-slow:    320ms;
  --pp-ease-standard: cubic-bezier(.2, 0, 0, 1);
  --pp-ease-out:      cubic-bezier(0, 0, .2, 1);
  --pp-ease-in:       cubic-bezier(.4, 0, 1, 1);
  --pp-ease-spring:   cubic-bezier(.34, 1.3, .64, 1);

  /* Gabarit — le seuil mobile est aussi lu par pp-ui.js, ce qui evite
     que CSS et JS divergent (cause de la zone morte 901-980px). */
  --pp-sidebar-w:        240px;
  --pp-sidebar-w-mobile: 288px;
  --pp-header-h:         60px;
  --pp-content-max:      1440px;
  --pp-tap-min:          44px;
  --pp-bp-sm:   640px;
  --pp-bp-md:   768px;
  --pp-bp-lg:  1024px;
  --pp-bp-xl:  1280px;
}

/* ============================================================
   SKIN v2 — nouvelle identite visuelle (lot 1.38.0)

   DEFAUT depuis la v1.41.0 : le bloc s'applique a :root.

   Le selecteur [data-pp-skin="v2"] est conserve pour que le kit de
   doc/design-kit/ continue de fonctionner tel quel, et pour pouvoir
   revenir explicitement au defaut apres une comparaison.

   Les noms de tokens sont IDENTIQUES a ceux du bloc historique :
   aucun composant n'a a savoir quel skin est actif.
   ============================================================ */
:root,
[data-pp-skin="v2"] {
  /* --- Rampe verte unifiee -------------------------------------------
     Remplace les huit verts en concurrence de l'ancien socle
     (#1b3a2b, #2d6a4f, #40916c, #95d5b2, #d8f3dc, #1a8a4f, #8fd19e,
     plus #1e9e5a / #2c5f2d / #059669 en ligne dans les vues).
     Plus profonde et un peu plus froide : c'est le principal vecteur
     du changement d'allure, a identite paysagiste constante. */
  --pp-g-50:  #f2f8f4;
  --pp-g-100: #dff0e6;
  --pp-g-200: #bfe1cd;
  --pp-g-300: #92cba9;
  --pp-g-400: #5fae83;
  --pp-g-500: #368f63;
  --pp-g-600: #24734e;
  --pp-g-700: #1a5b3e;
  --pp-g-800: #154930;
  --pp-g-900: #103525;
  --pp-g-950: #0a2118;

  /* --- Rampe neutre, legerement teintee sauge -------------------------
     Un gris strictement neutre parait sale a cote du vert. */
  --pp-n-0:   #ffffff;
  --pp-n-25:  #fafcfb;
  --pp-n-50:  #f5f8f6;
  --pp-n-100: #eaf0ec;
  --pp-n-200: #dae3dd;
  --pp-n-300: #bcc9c1;
  --pp-n-400: #93a49a;
  --pp-n-500: #6d7f74;
  --pp-n-600: #536257;
  --pp-n-700: #3e4b43;
  --pp-n-800: #2a332d;
  --pp-n-900: #19201c;
  --pp-n-950: #0e1310;

  /* --- Surfaces et texte ---------------------------------------------
     Contrastes mesures (WCAG 2.1), tous >= 4,5:1 en clair ET en sombre.
     --pp-text-muted passe de 4,9:1 a 6,04:1 : c'est la correction
     d'accessibilite la plus repandue de l'application, obtenue sans
     toucher une seule vue. */
  --pp-bg:             light-dark(var(--pp-n-50),  var(--pp-n-950));
  --pp-surface:        light-dark(var(--pp-n-0),   var(--pp-n-900));
  --pp-surface-2:      light-dark(var(--pp-n-25),  #212a24);
  --pp-surface-sunken: light-dark(var(--pp-n-0),   #131916);
  --pp-text:           light-dark(var(--pp-n-900), #e7ede9);
  --pp-text-muted:     light-dark(var(--pp-n-600), #9fb0a5);
  --pp-text-subtle:    light-dark(var(--pp-n-400), var(--pp-n-500));
  --pp-border:         light-dark(var(--pp-n-200), #2c3831);
  --pp-border-strong:  light-dark(var(--pp-n-300), #3e4b43);

  --pp-sidebar-bg:   light-dark(var(--pp-g-900), #0a1410);
  --pp-sidebar-text: light-dark(#ffffff, #d6e4db);
  --pp-header-bg:    var(--pp-surface);
  --pp-card-bg:      var(--pp-surface);

  /* --- Marque ---------------------------------------------------------
     Surchargeable par BrandingService. Tout le socle consomme
     --pp-primary : sidebar, boutons, en-tetes de tableau, anneau de
     focus, liens, onglet actif, pagination. */
  --pp-primary:        light-dark(var(--pp-g-600), var(--pp-g-400));
  --pp-primary-hover:  light-dark(var(--pp-g-700), var(--pp-g-300));
  --pp-primary-active: light-dark(var(--pp-g-800), var(--pp-g-200));
  --pp-primary-soft:   light-dark(var(--pp-g-100), #16311f);
  --pp-primary-border: light-dark(var(--pp-g-200), #1f4a32);
  --pp-primary-on:     light-dark(#ffffff, var(--pp-n-950));

  --pp-th-bg:   var(--pp-primary-soft);
  --pp-th-text: light-dark(var(--pp-g-900), var(--pp-g-200));

  /* --- Champs et liens ------------------------------------------------ */
  --pp-input-bg:       var(--pp-surface-sunken);
  --pp-input-bg-hover: light-dark(var(--pp-g-50), #212a24);
  --pp-link:           var(--pp-primary);
  --pp-link-hover:     var(--pp-primary-hover);

  /* --- Semantique, avec fond, texte et bordure par tonalite ----------- */
  --pp-success-text:   light-dark(#1a6b45, #6ede9f);
  --pp-success-bg:     light-dark(#e6f4ec, #12301f);
  --pp-success-border: light-dark(#b6dfc7, #1e5136);
  --pp-warning-text:   light-dark(#8a5a00, #f2c14e);
  --pp-warning-bg:     light-dark(#fdf3dc, #33290f);
  --pp-warning-border: light-dark(#f0d69a, #5c4715);
  --pp-danger-text:    light-dark(#a51f1a, #ff8b83);
  --pp-danger-bg:      light-dark(#fdeceb, #391917);
  --pp-danger-border:  light-dark(#f3c1bd, #6b2b26);
  --pp-info-text:      light-dark(#1a5f8a, #6fc0f0);
  --pp-info-bg:        light-dark(#e6f2f9, #10293a);
  --pp-info-border:    light-dark(#b7d9ec, #1d4a66);

  /* --- Teintes d'action ------------------------------------------------
     Deux accents hors de la gamme verte du produit, introduits le 01/09/2026
     pour les pastilles de la liste des AO. Ils ne servent qu'a distinguer
     quatre actions d'un coup d'oeil : reprendre (vert primaire), score
     (turquoise), archiver (violet), supprimer (rouge danger). N'en faire ni
     un statut ni un etat — la semantique reste success/warning/danger/info.

     Chaque teinte suit le triplet du kit : -bg pour le fond pastel, le nom nu
     pour l'encre, -border pour la tranche. Les pastilles sont pastel depuis le
     01/09/2026 : un aplat sature a quatre exemplaires par ligne dominait la
     lecture d'un tableau dont l'information est ailleurs. Le fond porte la
     teinte, le trace porte le contraste. En theme sombre le couple s'inverse,
     comme partout ailleurs dans le kit. */
  --pp-act-score:          light-dark(#2f6b70, #7fd0d6);
  --pp-act-score-bg:       light-dark(#e3f1f2, #123033);
  --pp-act-score-border:   light-dark(#b6d9dc, #1e5158);
  --pp-act-archive:        light-dark(#7b3fa0, #cba6e6);
  --pp-act-archive-bg:     light-dark(#f2e9f8, #2a1a35);
  --pp-act-archive-border: light-dark(#d8c2e8, #4d3560);

  /* Anciens noms plats, conserves : 129 badges et 64 alertes des vues
     les consomment encore. */
  --pp-success: var(--pp-success-text);
  --pp-warning: var(--pp-warning-text);
  --pp-danger:  var(--pp-danger-text);
  --pp-info:    var(--pp-info-text);

  /* --- Alias historiques ---------------------------------------------
     Ce sont eux qui rendent nav-groups.css, table-tools.css et
     breadcrumb-trail.css corrects sans une seule edition. */
  --pp-green-900: light-dark(var(--pp-g-900), var(--pp-g-300));
  --pp-green-700: light-dark(var(--pp-g-700), var(--pp-g-400));
  --pp-green-500: var(--pp-g-500);
  --pp-green-300: light-dark(var(--pp-g-300), var(--pp-g-600));
  --pp-green-100: light-dark(var(--pp-g-100), var(--pp-g-900));
  --pp-muted:     var(--pp-text-muted);

  /* --- Ombres, plus douces et plus etagees ---------------------------- */
  --pp-shadow-c1: light-dark(rgba(16, 53, 37, 0.08), rgba(0, 0, 0, 0.40));
  --pp-shadow-c2: light-dark(rgba(16, 53, 37, 0.04), rgba(0, 0, 0, 0.25));
  --pp-shadow-c3: light-dark(rgba(16, 53, 37, 0.12), rgba(0, 0, 0, 0.55));
  --pp-shadow-xs: 0 1px 2px var(--pp-shadow-c1);
  --pp-shadow-sm: 0 1px 3px var(--pp-shadow-c1), 0 1px 2px var(--pp-shadow-c2);
  --pp-shadow-md: 0 4px 12px var(--pp-shadow-c1), 0 2px 4px var(--pp-shadow-c2);
  --pp-shadow-lg: 0 12px 28px var(--pp-shadow-c3), 0 4px 8px var(--pp-shadow-c2);
  --pp-shadow-xl: 0 24px 48px var(--pp-shadow-c3);
  --pp-shadow:    var(--pp-shadow-sm);
  --pp-focus-color: var(--pp-primary);
  --pp-focus-ring:  0 0 0 3px color-mix(in srgb, var(--pp-primary) 32%, transparent);

  /* --- Rayons, un cran plus doux -------------------------------------- */
  --pp-radius:    var(--pp-radius-md);
  --pp-radius-lg: 14px;
}

/* ------------------------------------------------------------
   Typographie du skin v2.

   Base 16px au lieu de 15px : l'interface respire immediatement.
   L'echelle separe la densite des tableaux et formulaires (14px) du
   corps de texte (16px), ce que l'ancien socle ne faisait pas.
   ------------------------------------------------------------ */
:root {
  --pp-font-sans: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto,
                  "Helvetica Neue", Arial, sans-serif;
  --pp-font-mono: ui-monospace, SFMono-Regular, "Cascadia Mono", Menlo,
                  Consolas, monospace;

  --pp-fs-100: 0.6875rem;  /* 11px — micro-libelles */
  --pp-fs-200: 0.75rem;    /* 12px — badges, legendes */
  --pp-fs-300: 0.8125rem;  /* 13px — meta, cellules denses */
  --pp-fs-400: 0.875rem;   /* 14px — base des tableaux et formulaires */
  --pp-fs-500: 1rem;       /* 16px — corps de texte */
  --pp-fs-600: 1.125rem;   /* 18px — titre de card */
  --pp-fs-700: 1.25rem;    /* 20px — h3 hors carte */
  /* Haut de l'echelle resserre en v1.61.0 : 28/36 -> 24/28.
     Les titres de section occupent fs-800 sur TOUTES les pages depuis que leur
     taille est unifiee, et non plus les seules fiches ecrites en h2. A l'ancien
     calibre, une page de saisie n'etait plus qu'une succession de bandeaux, et
     le titre de page ecrasait ce qui le suivait. Les ecarts du haut sont donc
     plus courts que ceux du bas — c'est le propre d'une application dense, ou
     un titre situe, mais ne se lit pas de loin.
     fs-700 suit (22 -> 20px) : laisse a 22, il ne se serait plus distingue des
     24px d'un titre de section, et deux niveaux separes de deux pixels se
     lisent comme une erreur, pas comme une hierarchie. */
  --pp-fs-800: 1.5rem;     /* 24px — titre de section, valeur de KPI */
  --pp-fs-900: 1.75rem;    /* 28px — h1 de page */

  --pp-fw-normal:   400;
  --pp-fw-medium:   500;
  --pp-fw-semibold: 600;
  --pp-fw-bold:     700;

  --pp-lh-tight:   1.2;
  --pp-lh-snug:    1.35;
  --pp-lh-normal:  1.55;
  --pp-lh-relaxed: 1.7;

  --pp-ls-tight: -0.011em;
  --pp-ls-caps:   0.06em;
}

/* ------------------------------------------------------------
   Filet pour les navigateurs sans light-dark() (anterieurs a
   Chrome 123 / Safari 17.5 / Firefox 120). Ils recoivent le theme
   clair : degrade, jamais casse.
   ------------------------------------------------------------ */
@supports not (color: light-dark(#000, #fff)) {
  :root {
    --pp-green-900: #1b3a2b;
    --pp-green-700: #2d6a4f;
    --pp-green-500: #40916c;
    --pp-green-300: #95d5b2;
    --pp-green-100: #d8f3dc;
    --pp-primary:       #2d6a4f;
    --pp-primary-hover: #1b3a2b;
    --pp-bg:           #f7faf8;
    --pp-text:         #1a2e22;
    --pp-muted:        #5b6d62;
    --pp-border:       #dce5df;
    --pp-card-bg:      #ffffff;
    --pp-header-bg:    #ffffff;
    --pp-sidebar-bg:   #1b3a2b;
    --pp-sidebar-text: #ffffff;
    --pp-input-bg:       #ffffff;
    --pp-input-bg-hover: #f0f7f3;
    --pp-success-bg: #eaf5ef;
    --pp-warning-bg: #fdf3df;
    --pp-danger-bg:  #fbebea;
    --pp-info-bg:    #e8f0f8;
    --pp-shadow-c1: rgba(27, 58, 43, 0.08);
    --pp-shadow-c2: rgba(27, 58, 43, 0.04);
    --pp-shadow-c3: rgba(27, 58, 43, 0.12);
  }
}