/* ═══════════════════════════════════════════════════════════════════════════
   PROSPECTING MANUAL — ADDITIF CSS directory
   Sections 146 à 150. À charger après pm-global.css.

   CRÉATION DU 21 SEPTEMBRE 2026 (étape 3.7, décision 110) : les quatre annuaires et
   /tools-finder/. Ce que le socle porte n'est pas écrit ici : cartes, en-têtes de bloc
   (pm-bh), petits boutons (pm-sm), notes (pm-fn), sommaire et sections (pm-toc, pm-sec),
   FAQ (pm-faq-h), fil d'Ariane, shortlist et tiroir, tri (section 15 du socle JS).
   Plancher typographique à 12 px (décision 46), hors étiquettes en capitales espacées
   (11 px). Les encres sont écrites en clair ; seules les surfaces lisent une variable
   (décision 38). Aucune classe du socle n'est redéfinie ; les rares règles qui en ciblent
   une sont scopées par `.pm-di` ou `.pm-card-l`.
   MISE À JOUR DU 22 SEPTEMBRE 2026 (étape 3.8, chantier B, décision 129) — la règle d'encre forcée de la
   v6.2 n'existe plus sur les pages de la v8 : le socle pose l'encre de base des paragraphes en section 184,
   sans !important. La garde contextuelle de ce fichier a perdu son !important et gagne par ses trois
   classes ; un composant neuf stylise un paragraphe avec deux classes, jamais avec !important.

   ═══════════════════════════════════════════════════════════════════════════ */

/* ═══ 146. OUVERTURE ═══════════════════════════════════════════════════════ */
.pm-di .pm-hd{max-width:720px}
.pm-di .pm-ednote{margin:0 0 18px}
/* la v6.2 force l'encre de tout paragraphe du conteneur en !important (défaut 10, socle
   section 79) : la divulgation, sur carte claire, reprend une encre sombre */
/* une ligne avant le premier Try (premiere phrase de la decision 89) ; le bloc complet ferme la page (decision 111) */
/* la ligne de divulgation est au socle (section 157, décision 120) ; seule sa marge est propre à l'annuaire */


/* ═══ 147. LES FILTRES — recherche, tri, puces par groupe ═══════════════════
   Les puces se combinent en ET entre groupes et en OU dans un groupe ; une puce sans
   aucune ligne correspondante est désactivée au chargement (décision 82). Dessin du
   21 septembre 2026 (décision 112) : boîte blanche à liseré indigo, champ de recherche
   en pilule avec loupe, tri en contrôle segmenté, un panneau par groupe de puces,
   coche sur la puce pressée.                                                          */
.pm-di-filt{position:relative;display:grid;gap:14px;margin-top:18px;padding:20px 18px 16px;border-radius:16px;
  background:#fff;border:1px solid #C7D0E0;box-shadow:0 8px 24px rgba(30,40,100,.06)}
.pm-di-filt::before{content:'';position:absolute;left:18px;right:18px;top:-1px;height:3px;border-radius:0 0 3px 3px;
  background:linear-gradient(90deg,#4F46E5,#7C3AED)}
.pm-di-top{display:flex;flex-wrap:wrap;gap:12px;align-items:center;justify-content:space-between}
.pm-di-search{display:flex;align-items:center;gap:10px;flex:1 1 280px}
.pm-di-search>span:first-child,.pm-di-sort>span,.pm-di-fr>span{font-family:var(--pm-fm);font-size:var(--pm-fs-xs);letter-spacing:.1em;
  text-transform:uppercase;color:var(--pm-ink-l2);white-space:nowrap}
.pm-di-search-in{position:relative;flex:1;min-width:0}
.pm-di-search-ic{position:absolute;left:13px;top:50%;width:16px;height:16px;transform:translateY(-50%);color:var(--pm-ink-l3);pointer-events:none}
.pm-di-search input{width:100%;box-sizing:border-box;padding:10px 14px 10px 38px;border-radius:var(--pm-r-pill);border:1px solid #B9C3D6;
  background:#fff;box-shadow:inset 0 1px 2px rgba(15,23,42,.06);font:inherit;font-size:var(--pm-fs-ui);color:#0F172A;
  transition:border-color var(--pm-t1),box-shadow var(--pm-t1)}
.pm-di-search input::placeholder{color:#7C8AA5}
.pm-di-search input:focus{outline:none;border-color:#4338CA;box-shadow:0 0 0 3px rgba(67,56,202,.18)}
.pm-di-search-in:focus-within .pm-di-search-ic{color:#4338CA}
.pm-di-sort{display:flex;align-items:center;gap:10px;flex-wrap:wrap}
.pm-di-seg{display:inline-flex;border:1px solid #B9C3D6;border-radius:var(--pm-r-pill);background:#fff;overflow:hidden}
.pm-di-so{padding:8px 14px;border:none;border-radius:0;background:#fff;font-family:var(--pm-fb);font-size:var(--pm-fs-meta);font-weight:600;
  line-height:1;color:#1E293B;cursor:pointer;transition:background var(--pm-t1),color var(--pm-t1)}
.pm-di-so+.pm-di-so{border-left:1px solid #DDE3EE}
.pm-di-so:hover{background:#EEF0FF;color:#3730A3}
.pm-di-so[aria-pressed="true"]{background:#4338CA;color:#fff}
.pm-di-groups{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px}
.pm-di-fr{display:grid;gap:9px;align-content:start;padding:12px 14px 13px;border-radius:12px;background:#F4F6FB;border:1px solid #DDE3EE}
.pm-di-fr.is-wide{grid-column:1/-1}
.pm-di-chips{display:flex;flex-wrap:wrap;gap:7px}
.pm-di-chip{position:relative;padding:7px 13px;border-radius:var(--pm-r-pill);background:#fff;border:1px solid #B9C3D6;
  font-family:var(--pm-fb);font-size:var(--pm-fs-meta);font-weight:600;line-height:1.2;color:#1E293B;cursor:pointer;
  transition:background var(--pm-t1),color var(--pm-t1),border-color var(--pm-t1),padding var(--pm-t1)}
.pm-di-chip:hover{border-color:#4338CA;color:#3730A3;background:#EEF0FF}
.pm-di-chip[aria-pressed="true"]{background:#4338CA;border-color:#4338CA;color:#fff;padding-left:27px}
.pm-di-chip[aria-pressed="true"]::before{content:'';position:absolute;left:11px;top:50%;width:9px;height:5px;
  border-left:2px solid #fff;border-bottom:2px solid #fff;transform:translateY(-65%) rotate(-45deg)}
.pm-di-chip.is-empty{opacity:.4;cursor:default;pointer-events:none}
/* Décision 113 : une couleur sobre par groupe de puces — indigo, sarcelle, ambre, vert — portée par
   data-tone sur le panneau ; encres écrites en clair (décision 38) ; la puce pressée passe en teinte pleine */
.pm-di-fr>span{display:flex;align-items:center;gap:7px}
.pm-di-fr>span::before{content:'';width:8px;height:8px;border-radius:50%;background:#4338CA;flex-shrink:0}
.pm-di-fr[data-tone="cat"] .pm-di-chip{background:#EEF0FF;border-color:#C7CBF5;color:#3730A3}
.pm-di-fr[data-tone="cat"] .pm-di-chip:hover{background:#E0E4FF;border-color:#4338CA;color:#3730A3}
.pm-di-fr[data-tone="cat"] .pm-di-chip[aria-pressed="true"]{background:#4338CA;border-color:#4338CA;color:#fff}
.pm-di-fr[data-tone="team"]>span::before{background:#0F766E}
.pm-di-fr[data-tone="team"] .pm-di-chip{background:#E6F6F4;border-color:#A9DED6;color:#0F5F58}
.pm-di-fr[data-tone="team"] .pm-di-chip:hover{background:#D3EFEB;border-color:#0F766E;color:#0F5F58}
.pm-di-fr[data-tone="team"] .pm-di-chip[aria-pressed="true"]{background:#0F766E;border-color:#0F766E;color:#fff}
.pm-di-fr[data-tone="budget"]>span::before{background:#B45309}
.pm-di-fr[data-tone="budget"] .pm-di-chip{background:#FFF4E0;border-color:#F3D7A2;color:#8A4B00}
.pm-di-fr[data-tone="budget"] .pm-di-chip:hover{background:#FFEAC4;border-color:#B45309;color:#8A4B00}
.pm-di-fr[data-tone="budget"] .pm-di-chip[aria-pressed="true"]{background:#B45309;border-color:#B45309;color:#fff}
.pm-di-fr[data-tone="plan"]>span::before{background:#15803D}
.pm-di-fr[data-tone="plan"] .pm-di-chip{background:#EAF6EC;border-color:#B5DEC0;color:#166534}
.pm-di-fr[data-tone="plan"] .pm-di-chip:hover{background:#D9EFDD;border-color:#15803D;color:#166534}
.pm-di-fr[data-tone="plan"] .pm-di-chip[aria-pressed="true"]{background:#15803D;border-color:#15803D;color:#fff}
.pm-di-foot{display:flex;align-items:center;justify-content:space-between;gap:10px;flex-wrap:wrap}
.pm-di-count{font-size:var(--pm-fs-meta);color:#1E293B}
.pm-di-count b{font-family:var(--pm-fb);font-size:var(--pm-fs-body);font-weight:700;color:#4338CA}
/* l'attribut hidden (JS : bouton « Clear filters », lignes filtrées, message, « Show all ») l'emporte sur toute
   règle display du socle, dont celle des petits boutons pm-sm */
.pm-di [hidden]{display:none!important}


/* ═══ 148. LA LISTE — une ligne par outil, quarante visibles, le reste sur demande ═
   Les lignes au-delà de la quarantième sont masquées tant que la liste n'est ni dépliée
   (is-all) ni filtrée (is-filtered) ; elles sont dans le HTML, seule leur visibilité change. */
.pm-di-tbl{width:100%;min-width:760px;border-collapse:collapse;font-size:var(--pm-fs-meta);margin-top:16px}
.pm-di-tbl thead th{padding:9px 12px;text-align:left;white-space:nowrap;font-family:var(--pm-fm);font-size:var(--pm-fs-xs);
  letter-spacing:.1em;text-transform:uppercase;font-weight:600;color:var(--pm-ink-l2);border-bottom:2px solid #C7D0E0}
.pm-di-tbl td{padding:10px 12px;border-bottom:1px solid #D9E0EC;color:#1E293B;vertical-align:middle}
.pm-di-tbl tbody tr:last-child td{border-bottom:none}
.pm-di-tbl tbody tr:hover td{background:#EEF2FA}
.pm-di-tbl tbody:not(.is-all):not(.is-filtered) tr:nth-child(n+41){display:none}
.pm-di-tool{display:flex;align-items:center;gap:10px}
.pm-di-tool img{width:30px;height:30px;border-radius:9px;flex-shrink:0}
.pm-di-tool b{display:block;font-family:var(--pm-fb);font-size:var(--pm-fs-ui);font-weight:700;letter-spacing:normal;color:#0F172A}
.pm-di-tool i{display:block;font-style:normal;font-size:var(--pm-fs-meta);color:var(--pm-ink-l3)}
.pm-di-sc{font-family:var(--pm-fb);font-size:var(--pm-fs-body);font-weight:700;letter-spacing:normal;color:#0F172A}
.pm-di-price b{display:block;font-family:var(--pm-fb);font-size:var(--pm-fs-ui);font-weight:700;color:#0F172A}
.pm-di-price i{display:block;font-style:normal;font-size:var(--pm-fs-meta);color:var(--pm-ink-l3)}
.pm-di-price em{display:inline-block;margin-top:3px;padding:1px 8px;border-radius:var(--pm-r-pill);
  background:rgba(21,128,61,.1);font-style:normal;font-size:var(--pm-fs-meta);font-weight:600;color:#15803D}
.pm-di-for{font-size:var(--pm-fs-meta);color:#1E293B}
.pm-di-act{display:flex;align-items:center;gap:6px;justify-content:flex-end;white-space:nowrap}
.pm-page-wrap .pm-card-l .pm-di-none{margin:14px 0 0;font-size:var(--pm-fs-ui);color:#92400E}
.pm-di-more{margin:14px 0 0;text-align:center}


/* ═══ 149. OU ALLER ENSUITE — liens compacts, une sorte par lien ═══════════ */
.pm-di-links{display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:10px;margin-top:18px}
.pm-di-link{display:grid;gap:3px;align-content:start;padding:12px 14px;border-radius:12px;background:#F7F8FF;
  border:1px solid rgba(99,102,241,.38);text-decoration:none;color:#1E2B4D;
  transition:border-color var(--pm-t1),transform var(--pm-t1)}
.pm-di-link:hover{border-color:rgba(99,102,241,.55);transform:translateY(-1px)}
.pm-di-link i{font-family:var(--pm-fm);font-style:normal;font-size:var(--pm-fs-xs);letter-spacing:.1em;text-transform:uppercase;color:#4338CA}
.pm-di-link b{font-size:var(--pm-fs-ui);font-weight:800;line-height:1.25;color:#0A1428}
.pm-di-link span{font-size:var(--pm-fs-meta);line-height:1.4;color:#2B3F63}


/* ═══ 150. RESPONSIVE DU TEMPLATE ══════════════════════════════════════════ */
@media (max-width:768px){
  .pm-di-top{flex-direction:column;align-items:stretch}
  .pm-di-groups{grid-template-columns:minmax(0,1fr)}
  .pm-di-links{grid-template-columns:minmax(0,1fr)}
}
/* Séance 246 : sous 768 px, la ligne du haut passe en colonne et la recherche y gardait sa base de 280 px, devenue une hauteur
   (le grand vide au-dessus et au-dessous du champ) : elle reprend sa hauteur. À 480 px et moins, le tri prend toute la largeur
   en segments égaux et les groupes de filtres se resserrent. Quand la liste ne tient plus (mécanique commune : socle, section
   192), chaque ligne devient une carte : logo, nom, catégorie et note ; prix, essai et plan gratuit (ils se disent eux-mêmes) ;
   « For » avec le libellé de sa colonne, lu à l'écran seulement ; les trois boutons sur une ligne. Une ligne filtrée
   (`hidden`) ou au-delà des quarante premières reste masquée. */
@media (max-width:768px){
  .pm-di-search{flex:0 0 auto}
}
@media (max-width:480px){
  .pm-di-filt{gap:12px;padding:16px 14px 14px}
  .pm-di-sort{display:grid;gap:7px}
  .pm-di-seg{display:flex;width:100%}
  .pm-di-so{flex:1 1 0;text-align:center}
  .pm-di-groups{gap:8px}
  .pm-di-fr{gap:8px;padding:10px 12px 12px}
  .pm-di-chips{gap:6px}
}
@container (max-width:879px){
  body .pm-wide .pm-di-tbl{margin-top:12px}
  body .pm-wide .pm-di-tbl tbody tr:not([hidden]){display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:center;gap:10px 12px;padding:14px 4px;border-bottom:1px solid #D9E0EC}
  body .pm-wide .pm-di-tbl tbody tr:last-child{border-bottom:none}
  body .pm-wide .pm-di-tbl tbody tr td:nth-child(n+3){grid-column:1/-1}
  body .pm-wide .pm-di-tbl tbody tr td:nth-child(4)::before{content:"For";content:"For" / "";margin:0 8px 0 0;font-family:var(--pm-fm);font-size:var(--pm-fs-xs);font-weight:500;letter-spacing:.1em;text-transform:uppercase;color:var(--pm-ink-l3)}
  body .pm-wide .pm-di-tbl tbody tr td:nth-child(4):has(.pm-di-for:empty){display:none}
  body .pm-wide .pm-di-price{display:flex;flex-wrap:wrap;align-items:baseline;gap:4px 10px}
  body .pm-wide .pm-di-price :is(b,i){display:inline}
  body .pm-wide .pm-di-tbl .pm-di-price em{margin-top:0}
  body .pm-wide .pm-di-sc{font-size:var(--pm-fs-lead)}
  body .pm-wide .pm-di-act{margin-top:2px}
}
/* une boîte assez large (560 px et plus, une tablette) : les boutons gardent leur taille, à gauche */
@container (min-width:560px) and (max-width:879px){
  body .pm-wide .pm-di-act{justify-content:flex-start}
  body .pm-wide .pm-di-act .pm-sm{flex:0 0 auto;padding-left:14px;padding-right:14px}
}
