/* ============================================================================
   LA FENÊTRE À DEUX VOLETS D'UN SÉLECTEUR D'ENTITÉ — chercher, puis créer.
   Préfixe `.epk-` (entity picker) : ces règles ne décrivent ni un fournisseur
   ni un client, elles décrivent la FENÊTRE. Deux la portent aujourd'hui :

     · #supplierPickerModal — modules/supplier-picker.js,
       src/Modules/Suppliers/Views/_supplier_picker_modal.php
     · #clientPickerModal   — modules/client-picker.js,
       src/Modules/Clients/Views/_client_picker_modal.php

   ⚠ ELLES SE PARTAGENT LA FEUILLE, PAS LEUR CÂBLAGE. Les identifiants
   (`spk…` / `cpk…`) et les attributs de données restent propres à chaque
   fenêtre : c'est le LOOK qui est commun, et le recopier dans un second
   fichier le ferait diverger au premier réglage (« Deux écrans ne se
   ressemblent que s'ils passent par le MÊME code »).
   ============================================================================ */

.epk-lead {
  margin: 0 0 var(--space-4);
  color: var(--text-secondary);
}

/* La même note, mais SOUS ce qu'elle commente : elle ferme le volet, donc pas
   de marge basse. Sans ce cran, le seul recours serait un `style="margin:0"` —
   un second endroit où la valeur se déciderait. */
.epk-lead--nu {
  margin: var(--space-3) 0 0;
  font-size: 0.8125rem;
}

/* ⚠ UNE HAUTEUR PLAFONNÉE, ET ELLE DOIT DÉFILER. Le répertoire de Feralu
   compte 233 fiches : sans ce plafond, une recherche vide pousse le pied de la
   modale (« Nouveau fournisseur ») hors de l'écran — c'est-à-dire qu'elle cache
   la porte même qu'on vient d'ouvrir cette fenêtre pour atteindre. */
.epk-results {
  max-height: 45vh;
  overflow-y: auto;
  border: 1px solid var(--border);
  border-radius: var(--radius);
  background: var(--surface);
}

.epk-result {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 0.125rem;
  width: 100%;
  padding: var(--space-3) var(--space-4);
  border: 0;
  border-bottom: 1px solid var(--border);
  background: transparent;
  text-align: left;
  cursor: pointer;
  color: var(--text);
}

.epk-result:last-child { border-bottom: 0; }

.epk-result:hover,
.epk-result:focus-visible {
  background: var(--gray-50);
  outline: none;
}

.epk-result-name { font-weight: 600; }

.epk-result-sub {
  font-size: 0.8125rem;
  color: var(--text-muted);
}

.epk-empty {
  margin: 0;
  padding: var(--space-4);
  color: var(--text-muted);
  text-align: center;
}

/* Les deux réponses possibles au doublon PROPOSÉ (#cpkDoublon) : elles vivent
   DANS le bandeau, sous la fiche qu'elles désignent — une rangée de boutons
   posée ailleurs demanderait de relire de quoi on parle. */
.epk-doublon-gestes {
  display: flex;
  gap: var(--space-2);
  margin-top: var(--space-3);
  flex-wrap: wrap;
}