/* =============================================================================
   FICHE FOURNISSEUR — la carte « Coordonnées », ÉDITABLE SUR PLACE (2026-09-14)
   =============================================================================
   Olivier : « je voudrais pouvoir le éditer directement sur la page ». Pas de
   modale : on clique une valeur, on tape, on sort du champ, c'est enregistré.

   Préfixe `sdc-` (supplier detail card). Aucune couleur en dur — tout vient de
   `tokens.css` : cette feuille vit dans `components/`, où un hex neuf est
   refusé par l'audit.

   ⚠ LA RANGÉE GARDE SA HAUTEUR ENTRE LES DEUX ÉTATS. La valeur et le champ qui
   la remplace ont le même `min-height` et le même pas vertical : sans ça, le
   clic fait SAUTER tout ce qui suit dans la carte — et on relit la ligne
   d'à côté, pas celle qu'on édite. */

.sdc-liste {
    display: flex;
    flex-direction: column;
}

.sdc-ligne {
    display: grid;
    grid-template-columns: 140px minmax(0, 1fr);
    align-items: center;
    gap: .75rem;
    min-height: 34px;
    border-bottom: 1px solid var(--border);
}
.sdc-ligne:last-child { border-bottom: 0; }

.sdc-libelle {
    font-size: .75rem;
    color: var(--text-muted);
}

/* La valeur EST le déclencheur : un bouton, pas un texte avec un crayon à côté.
   Toute la ligne se clique, donc la cible est large — et elle reste un contrôle
   pour le clavier (Tab l'atteint, Entrée l'ouvre). */
.sdc-valeur {
    display: block;
    width: 100%;
    min-height: 34px;
    padding: .25rem .4rem;
    margin: 0;
    border: 1px solid transparent;
    border-radius: var(--radius);
    background: none;
    font: inherit;
    font-size: .8125rem;
    color: var(--text);
    text-align: left;
    cursor: text;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}
.sdc-valeur:hover  { background: var(--color-surface-2); }
.sdc-valeur:focus-visible {
    outline: 2px solid var(--primary);
    outline-offset: -2px;
}

/* ⚠ UN CHAMP VIDE DOIT RESTER ATTEIGNABLE. La carte ne rendait QUE les valeurs
   renseignées : IBAN, BIC, SIREN et compte comptable n'y apparaissaient jamais,
   donc rien n'appelait à les remplir. Le vide se dit, et il se clique. */
.sdc-valeur.is-vide { color: var(--text-muted); }

/* En lecture seule (permission absente) la valeur n'est plus un bouton : pas
   d'affordance qui promette un geste refusé. */
.sdc-valeur[disabled] {
    cursor: default;
    background: none;
    opacity: 1;
}

/* Le champ ouvert prend EXACTEMENT la place de la valeur. */
.sdc-ligne .form-input {
    min-height: 34px;
    padding: .25rem .4rem;
    font-size: .8125rem;
}

/* L'état d'enregistrement, discret, à droite du libellé de la carte —
   même grammaire que les notes de la fiche client. */
/* `.card-header` est DÉJÀ un flex `space-between` (socle, cards.css) : l'état
   n'a rien à pousser, il a seulement à s'aligner sur le titre — l'en-tête cale
   ses enfants en `flex-start`. */
.sdc-etat {
    font-size: .75rem;
    color: var(--text-muted);
    align-self: center;
}
.sdc-etat.is-erreur { color: var(--error); }
