/* ============================================================
   THÈME YELLOW+ (opt-in) · créé le 06/10/2026
   Activé par "theme": "yellow" dans le rapport JSON ou la config
   client. render.js ajoute alors cette feuille, la classe
   .theme-yellow sur <body> et le filtre SVG #duotone-ink.
   Sans thème, rien de ce fichier n'est chargé : les rapports
   mensuels existants (charte PAF violette) ne bougent pas.

   Source de la charte : marque/02-couleurs/couleurs.md et
   docs/identite-v2/01-etat-des-lieux.md (charte du 14/10/2026).
   Encre #171717 · gris clair #f5f5f5 · blanc (plus de crème)
   filets #e6e4e0 · texte #525252 · jaune signature #facc14
   Inter (texte et gros chiffres, plus de Thunder) · Playfair italique
   (mot d'accent sur fond sombre) · Caveat (annotations)
   Couleurs d'appoint seulement pour distinguer des séries : rose
   #e1306c, violet #2c2a8a. Pas de bleu, vert ni dégradé.
   ============================================================ */

@font-face { font-family: 'Playfair Display'; src: url('../assets/fonts/PlayfairDisplay-SemiBoldItalic-latin.woff2') format('woff2'); font-weight: 600; font-style: italic; }
@font-face { font-family: 'Caveat'; src: url('../assets/fonts/Caveat-variable.ttf') format('truetype'); font-weight: 400 700; font-style: normal; }

.theme-yellow {
  /* ---- les rôles de la charte PAF, remappés sur YELLOW+ ---- */
  --ink:          #171717;
  --ink-soft:     #525252;
  --paper:        #FFFFFF;
  --panel:        #f5f5f5;  /* gris clair (le crème est supprimé le 14/10/2026) */
  --card:         #f5f5f5;  /* gris clair plein (cartes) */
  --card-soft:    #f5f5f5;
  --accent:       #171717;  /* l'ancien violet devient l'encre */
  --accent-deep:  #171717;
  --accent-dark:  #525252;
  --yellow:       #facc14;
  --watermark:    #f5f5f5;
  --alert-bg:     #f5f5f5;
  --chart-1: #171717;
  --chart-2: #facc14;
  --chart-3: #525252;
  --chart-4: #e0e0e0;       /* barre « ordinaire » : gris neutre, comme le graphique du site */
  --chart-5: #8a8780;
  --chart-grid: rgba(23, 23, 23, .14);

  /* ---- propres au thème ---- */
  --text:  #525252;          /* texte courant sur fond clair */
  --line:  #e6e4e0;          /* filets */
  --mark:  #fbd659;          /* trait de surligneur du site YELLOW+ */
  --star:  #facc14;
  --font-display: 'Inter', system-ui, sans-serif;
  --font-num:  'Inter', system-ui, sans-serif; /* gros chiffres en Inter très gras, comme le site */
  --font-accent: 'Playfair Display', Georgia, serif;
  --font-hand: 'Caveat', cursive;
}

/* Texte courant en gris charte, titres et gras en encre */
.theme-yellow .slide { color: var(--text); }
.theme-yellow h1.title,
.theme-yellow strong, .theme-yellow b { color: var(--ink); }
.theme-yellow h1.title { font-weight: 700; letter-spacing: -.02em; line-height: 1.25; }
.theme-yellow .kicker { color: var(--text); font-size: 15px; font-weight: 600; letter-spacing: .08em; text-transform: uppercase; margin-bottom: 10px; }
.theme-yellow .footnote { color: var(--text); font-style: normal; font-size: 14px; }

/* ---- Surligneur : le trait exact du site (primitives.module.css) ----
   Un ou deux mots, jamais une ligne entière. */
.theme-yellow mark {
  position: relative; z-index: 1; display: inline-block;
  padding: 0 .1em; margin: 0; background: transparent; color: inherit;
  white-space: nowrap;
}
.theme-yellow mark::before {
  content: ""; position: absolute; z-index: -1;
  left: -.1em; right: -.1em; top: 55%; height: .6em; inset-block-end: auto;
  transform: translateY(-50%) rotate(-1.5deg);
  border-radius: 1em; background: var(--mark);
}
/* Sur fond sombre : pas de trait, le mot passe en Playfair italique jaune
   (règle du site, 14/10/2026) */
.theme-yellow .on-dark mark { color: var(--yellow); font-family: var(--font-accent); font-style: italic; font-weight: 600; font-size: 1.1em; }
.theme-yellow .on-dark mark::before { display: none; }

/* ---- Photos : duotone encre → crème chaude ---- */
.theme-yellow .duotone img { filter: url(#duotone-ink); }

/* ---- Bandeau « scotché » ---- */
.theme-yellow .tape, .theme-yellow .tape::before { background: var(--yellow); }
.theme-yellow .tape { color: var(--ink); }

/* ---- Couverture ---- */
.theme-yellow .cover { background: var(--panel); }
.theme-yellow .cover__title { font-family: 'Inter', sans-serif; font-size: 92px; font-weight: 800; letter-spacing: -.02em; }
.theme-yellow .cover__client, .theme-yellow .cover__doc { background: rgba(23, 23, 23, .72); letter-spacing: .14em; font-size: 20px; }
.theme-yellow .cover::after { /* logo YELLOW+ noir, sous la mosaïque, aligné à droite */
  content: ""; position: absolute; right: 5.25%; bottom: 22px; width: 132px; height: 22px; z-index: 2;
  background: url('../assets/logos/yellow-plus-noir.svg') no-repeat right center / contain;
}

/* ---- Intercalaire photo : voile encre pour faire ressortir le scotch ---- */
.theme-yellow .section__photo::after { content: ""; position: absolute; inset: 0; background: rgba(23, 23, 23, .42); }
.theme-yellow .section__author { text-shadow: 0 1px 8px rgba(0, 0, 0, .6); }
.theme-yellow .section__title { font-family: 'Inter', sans-serif; font-weight: 800; letter-spacing: -.02em; }
.theme-yellow .section__kicker { letter-spacing: .16em; }
.theme-yellow .section__sub { font-weight: 500; }

/* ---- Sommaire : numéros en Inter très gras, filets charte ---- */
.theme-yellow .toc__title { color: var(--ink); font-weight: 800; letter-spacing: -.02em; line-height: 1.05; }
.theme-yellow .toc__list { counter-reset: toc; }
.theme-yellow .toc__item {
  counter-increment: toc; display: grid; grid-template-columns: 58px 1fr; column-gap: 16px; align-items: baseline;
  border-bottom: 1px solid var(--line); padding: 14px 0;
}
.theme-yellow .toc__item::before {
  content: counter(toc, decimal-leading-zero); grid-row: span 2;
  font-family: var(--font-num); font-size: 30px; line-height: .9; color: var(--ink); font-weight: 800; letter-spacing: -.03em;
}
.theme-yellow .toc__item .t { grid-column: 2; color: var(--ink); font-size: 21px; margin-bottom: 2px; }
.theme-yellow .toc__item .d { grid-column: 2; color: var(--text); font-size: 17px; }

/* ---- Tableaux, cartes, graphiques SVG : l'ancien violet → encre/gris ----
   charts.js écrit ses couleurs en attributs SVG ; une règle CSS l'emporte
   sur un attribut de présentation, on les remappe donc ici. */
.theme-yellow .chart-svg [fill="#7372FF"] { fill: var(--ink); }
.theme-yellow .chart-svg [stroke="#7372FF"] { stroke: var(--ink); }
.theme-yellow .chart-svg [fill="#F9F871"] { fill: var(--yellow); }
.theme-yellow .chart-svg [fill="#5B01EF"] { fill: var(--ink-soft); }
.theme-yellow .chart-svg [fill="#C6BEEE"] { fill: var(--chart-4); }
.theme-yellow .chart-svg [fill="#4544FF"] { fill: var(--chart-5); }
.theme-yellow .chart-svg [fill="#1F1551"] { fill: var(--ink); }

/* ---- chiffres : gros chiffres en Inter 800, chiffre fort au surligneur ---- */
.theme-yellow .fig { border-left-color: var(--line); }
.theme-yellow .fig__label { color: var(--text); }
.theme-yellow .fig__value { font-family: var(--font-num); font-weight: 800; font-size: 76px; letter-spacing: -.03em; line-height: 1; color: var(--ink); }
.theme-yellow .fig--fort .fig__value span { background: none; position: relative; z-index: 1; display: inline-block; padding: 0 .06em; margin: 0; }
.theme-yellow .fig--fort .fig__value span::before {
  content: ""; position: absolute; z-index: -1; left: -.06em; right: -.06em; top: 58%; height: .42em;
  transform: translateY(-50%) rotate(-1.5deg); border-radius: 1em; background: var(--mark);
}
.theme-yellow .figs-conclusion { color: var(--text); }
/* ---- créas : ombres neutres ---- */
.theme-yellow .crea__img { box-shadow: 0 10px 24px -14px rgba(0, 0, 0, .35); }
.theme-yellow .crea__t { color: var(--ink); }
.theme-yellow .figs[style*="--figs-n:4"] .fig__value { font-size: 56px; }
.theme-yellow .figs[style*="--figs-n:4"] .fig { padding-left: 26px; padding-right: 26px; }
