/* ═══════════════════════════════════════════════════════════════════════════
   PORTEFEUILLES — créditer un dépôt constaté sur une puce.
   Reprend les variables et les blocs de admin.css ; rien de neuf côté couleurs.
   ═══════════════════════════════════════════════════════════════════════════ */

.pf-bloc {
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: 12px;
  padding: 20px;
  display: flex;
  flex-direction: column;
  gap: 8px;
}

.pf-etape {
  font-size: 15px;
  font-weight: 700;
  color: var(--primary);
  margin-bottom: 4px;
}

.pf-label {
  font-size: 13px;
  font-weight: 600;
  color: var(--text-muted);
  margin-top: 6px;
}

.pf-input {
  padding: 10px 12px;
  border: 1px solid var(--border);
  border-radius: 8px;
  font-size: 14px;
  font-family: inherit;
  background: #fff;
  color: inherit;
}
.pf-input:focus { outline: none; border-color: var(--primary); }

/* L'avertissement sur la référence porte la couleur d'alerte : c'est la seule
   consigne de cet écran dont l'oubli permet de créditer deux fois. */
.pf-avert { color: #9f1239; }

/* ── Résultats de recherche ── */

.pf-resultats { display: flex; flex-direction: column; gap: 4px; margin-top: 4px; }

.pf-resultat {
  display: flex;
  align-items: center;
  gap: 12px;
  width: 100%;
  text-align: left;
  padding: 10px 12px;
  border: 1px solid var(--border);
  border-radius: 8px;
  background: #fff;
  cursor: pointer;
  font-size: 14px;
  font-family: inherit;
}
.pf-resultat:hover { border-color: var(--primary); background: var(--primary-light, #faf5ff); }

.pf-resultat-nom { flex: 1; font-weight: 600; }
.pf-resultat-tel { color: var(--text-muted); font-size: 13px; }
.pf-resultat-solde { font-weight: 700; color: var(--primary); }

.pf-vide { color: var(--text-muted); font-size: 13px; padding: 8px 0; }

/* ── La gérante retenue ── */

.pf-choisie {
  display: flex;
  align-items: baseline;
  gap: 12px;
  flex-wrap: wrap;
  padding: 10px 12px;
  border-radius: 8px;
  background: var(--primary-light, #faf5ff);
  border: 1px solid var(--primary);
  font-size: 15px;
}
.pf-choisie-tel { color: var(--text-muted); font-size: 13px; }
.pf-choisie-solde { margin-left: auto; font-weight: 700; color: var(--primary); }

/* ── Le message après le crédit ── */

.pf-message { font-size: 14px; font-weight: 600; min-height: 20px; }
.pf-ok { color: #166534; }
/* « Déjà fait » et les refus partagent cette couleur : dans les deux cas, rien n'a
   été ajouté, et c'est ça que la personne doit comprendre du premier coup d'œil. */
.pf-ko { color: #9f1239; }

/* ── L'historique, pour le rapprochement ── */

.pf-total { font-size: 14px; margin-bottom: 10px; }

.pf-historique { overflow-x: auto; }

.pf-table { width: 100%; border-collapse: collapse; font-size: 13px; }
.pf-table th {
  text-align: left;
  padding: 8px 10px;
  border-bottom: 2px solid var(--border);
  color: var(--text-muted);
  font-weight: 600;
  white-space: nowrap;
}
.pf-table td { padding: 8px 10px; border-bottom: 1px solid var(--border); vertical-align: top; }
.pf-mnt { font-weight: 700; color: #166534; white-space: nowrap; }
.pf-ref { font-family: ui-monospace, SFMono-Regular, Menlo, monospace; font-size: 12px; }
.pf-tel-min { display: block; color: var(--text-muted); font-size: 12px; }