/* Jetons de style communs de 91STUDIO Immo (refonte, lot 1, 24/10/2026).
 * Copiés de la maquette D2-bureau validée par Henri (« je préfère D2-bureau, typo plus fine ») : typographie fine
 * 13/400, titres 17/600, chiffres 22/500 tabulaires, libellés 11/500, rayons, verre, thème clair et sombre.
 *
 * Thème : l'attribut data-theme de <html>, posé avant le premier rendu par le script de tête de la carte
 * (« clair » ou « sombre », les valeurs de l'app depuis septembre ; « light » / « dark » de la maquette valent pareil).
 * « Automatique » est un choix, pas un thème : src/coquille.js le résout en clair ou sombre selon le réglage du système.
 * Une page sans data-theme suit le système (@media prefers-color-scheme).
 *
 * Portée : les jetons sont posés sur :root ET sur la classe .jt. La carte redéfinit sur body.page-app quelques noms
 * semblables (--panneau, --encre, --filet, --survol, --actif) avec ses propres valeurs : un élément de la refonte
 * (la coquille, ses écrans) porte la classe .jt pour retrouver ceux-ci. Les anciennes pages les ignorent.
 * Tailles de texte FIXES (rem sur une base de 16 px, jamais mises à l'échelle).
 */
:root, .jt {
  --police: -apple-system, BlinkMacSystemFont, "SF Pro Text", "SF Pro Display", "Helvetica Neue", Arial, sans-serif;
  --t-10: .625rem; --t-11: .6875rem; --t-12: .75rem; --t-13: .8125rem; --t-14: .875rem;
  --t-15: .9375rem; --t-17: 1.0625rem; --t-22: 1.375rem;
  --interligne: 1.4; --interligne-texte: 1.5;
  --r-panneau: 14px; --r-carte: 12px; --r-moyen: 10px; --r-bouton: 7px; --r-pastille: 5px; --r-fin: 3px; --r-rond: 999px;   /* scripts/jetonner-rayons.mjs */
  --h-bouton: 30px; --h-ligne: 28px; --h-onglet: 34px;
  --sidebar: 244px; --sidebar-repliee: 70px; --fiche: 380px; --kepler: 292px; --marge: 12px;
  /* données : couleurs identiques carte / légende / fiche */
  --z-ug: #C9A46A; --z-au: #C2774E; --z-a: #8FA372;
  /* PPRN : couleurs officielles KaruGéo (SLD ms:pprn_*) */
  --pprn-0: #ffffff; --pprn-1: #a0e0ff; --pprn-2: #40c0ff; --pprn-3: #0000ff; --pprn-4: #ff8080;
  --pprn-5: #ff0000; --pprn-6: #ff0000; --pprn-8: #a0e0ff; --pprn-9: #ffe8be; --pprn-opacite: .30;
}
/* clair */
:root, .jt, [data-theme="clair"], [data-theme="clair"] .jt, [data-theme="light"], [data-theme="light"] .jt {
  --fond-app: #F5F5F7; --sidebar-fond: #F5F5F7; --panneau: #FFFFFF;
  --verre: rgba(255, 255, 255, .92); --verre-plein: rgba(255, 255, 255, .985); --verre-givre: rgba(255, 255, 255, .86); --verre-flou: blur(18px) saturate(1.1);
  --verre-ombre: 0 1px 2px rgba(0, 0, 0, .06), 0 8px 28px rgba(0, 0, 0, .10); --verre-filet: none;
  --encre: #1d1d1f; --texte: #1d1d1f; --attenue: #6e6e73; --discret: #86868b;
  --filet: rgba(0, 0, 0, .08); --filet-fort: rgba(0, 0, 0, .12);
  --survol: rgba(0, 0, 0, .04); --actif: rgba(0, 0, 0, .06); --champ: rgba(0, 0, 0, .04);
  --plein: #1d1d1f; --plein-texte: #FFFFFF;
  --etiquette-fond: rgba(255, 255, 255, .88); --etiquette-texte: #1d1d1f; --numero-fond: rgba(255, 255, 255, .72); --numero-texte: #3a3a3c;
  /* types de ventes, teintes écartées (Henri, 25/10/2026) : Terrain sauge, Maison ocre, Appartement ardoise, Local gris ; la carte
     prend son jeu selon le FOND (src/d2-ventes.js), ces jetons servent l'interface (frise, légendes) */
  --parcelle: #1d1d1f; --vente: #6B5536; --vente-bati: rgba(0, 0, 0, .22); --vente-terrain: #306725; --vente-maison: #CC8505; --vente-appartement: #0F487C; --vente-local: #6B6B70;
  --frise-hors: rgba(0, 0, 0, .10);
  --ok: #30B158; --alerte: #D9822B;
  --voile-tiroir: rgba(255, 255, 255, .58);
  --menu-ombre: 0 10px 30px rgba(0, 0, 0, .18);
  color-scheme: light;
}
/* sombre : choisi, ou suivi du système quand la page ne pose pas de thème */
[data-theme="sombre"], [data-theme="sombre"] .jt, [data-theme="dark"], [data-theme="dark"] .jt {
  --fond-app: #0B0C0E; --sidebar-fond: #101113; --panneau: #141518;
  --verre: rgba(14, 14, 14, .66); --verre-plein: rgba(22, 22, 24, .97); --verre-givre: rgba(14, 14, 14, .58); --verre-flou: blur(18px) saturate(.6);
  --verre-ombre: none; --verre-filet: inset 0 0 0 1px rgba(255, 255, 255, .07);
  --encre: #F2EEE6; --texte: rgba(255, 255, 255, .86); --attenue: rgba(255, 255, 255, .68); --discret: rgba(255, 255, 255, .5);
  --filet: rgba(255, 255, 255, .08); --filet-fort: rgba(255, 255, 255, .12);
  --survol: rgba(255, 255, 255, .05); --actif: rgba(255, 255, 255, .08); --champ: rgba(255, 255, 255, .05);
  --plein: #F2F2F2; --plein-texte: #0B0C0E;
  --etiquette-fond: rgba(14, 14, 14, .86); --etiquette-texte: #F2EEE6; --numero-fond: rgba(14, 14, 14, .55); --numero-texte: rgba(255, 255, 255, .85);
  --parcelle: #EDE6D8; --vente: #E6D6B3; --vente-bati: rgba(255, 255, 255, .32); --vente-terrain: #B7E6A0; --vente-maison: #D49A0A; --vente-appartement: #79A4D3; --vente-local: #CFCFD3;
  --frise-hors: rgba(255, 255, 255, .12);
  --ok: #7FBF8A; --alerte: #E3A65B;
  --voile-tiroir: rgba(0, 0, 0, .45);
  --menu-ombre: 0 10px 30px rgba(0, 0, 0, .5);
  color-scheme: dark;
}
@media (prefers-color-scheme: dark) {
  :root:not([data-theme]), :root:not([data-theme]) .jt {
    --fond-app: #0B0C0E; --sidebar-fond: #101113; --panneau: #141518;
    --verre: rgba(14, 14, 14, .66); --verre-plein: rgba(22, 22, 24, .97); --verre-givre: rgba(14, 14, 14, .58); --verre-flou: blur(18px) saturate(.6);
    --verre-ombre: none; --verre-filet: inset 0 0 0 1px rgba(255, 255, 255, .07);
    --encre: #F2EEE6; --texte: rgba(255, 255, 255, .86); --attenue: rgba(255, 255, 255, .68); --discret: rgba(255, 255, 255, .5);
    --filet: rgba(255, 255, 255, .08); --filet-fort: rgba(255, 255, 255, .12);
    --survol: rgba(255, 255, 255, .05); --actif: rgba(255, 255, 255, .08); --champ: rgba(255, 255, 255, .05);
    --plein: #F2F2F2; --plein-texte: #0B0C0E;
    --ok: #7FBF8A; --alerte: #E3A65B;
    --voile-tiroir: rgba(0, 0, 0, .45);
    --menu-ombre: 0 10px 30px rgba(0, 0, 0, .5);
    color-scheme: dark;
  }
}
/* les chiffres : tabulaires */
.jt .tab, .jt .chiffre { font-variant-numeric: tabular-nums; }
