/* ============================================================
   Recette V6 — audit final, lot documents / avoirs / numérotation.
   Fichier séparé d'app.css : il reprend les jetons Aurora (--grad,
   --v1…, --r-md…) sans toucher aux règles communes.
   ============================================================ */

/* ---------- Fiche client : état du bon de commande (A1) ---------- */
.client-bc {
    display: inline-flex; align-items: center; gap: .3rem;
    padding: .08rem .6rem; border-radius: 999px; font-size: .76rem; font-weight: 700;
}
.client-bc.is-ok { color: #047857; background: rgba(16,185,129,.13); }
.client-bc.is-ko { color: #b45309; background: rgba(245,158,11,.16); }

/* ---------- « Créer > Avoir » : choix de la facture d'origine (A4) ---------- */
.avoir-choix { display: grid; gap: .9rem; }
.avoir-choix__intro {
    display: flex; gap: .55rem; align-items: flex-start; margin: 0;
    padding: .7rem .9rem; border-radius: var(--r-md);
    background: var(--grad-soft); border: 1px solid rgba(124,92,255,.2);
    color: var(--ink-soft); font-size: .86rem;
}
.avoir-choix__intro > i { color: var(--v1); font-size: 1.15rem; line-height: 1.2; }
.avoir-choix__recherche { position: relative; }
.avoir-choix__recherche > i {
    position: absolute; left: .85rem; top: 50%; transform: translateY(-50%); color: var(--ink-faint); pointer-events: none;
}
.avoir-choix__recherche .form-control { padding-left: 2.3rem; border-radius: 999px; }
.avoir-choix__recherche .form-control:focus { box-shadow: var(--ring); border-color: rgba(124,92,255,.45); }
.avoir-choix__liste { display: grid; gap: .45rem; }
.avoir-choix__facture {
    /* Colonnes de largeur fixe hors client : chaque ligne est sa propre grille,
       une colonne « auto » décalait le client d'une ligne à l'autre. */
    display: grid; grid-template-columns: minmax(8rem, 12rem) minmax(0, 1fr) 15.5rem 1rem; align-items: center; gap: .8rem;
    padding: .65rem .9rem; border-radius: var(--r-md);
    background: var(--surface); border: 1px solid var(--line); box-shadow: var(--sh-sm);
    color: var(--ink); text-decoration: none;
    transition: border-color .15s, box-shadow .15s, transform .15s;
}
a.avoir-choix__facture:hover, a.avoir-choix__facture:focus-visible {
    color: var(--ink); border-color: rgba(124,92,255,.45); box-shadow: var(--sh-md), var(--ring); transform: translateY(-1px);
}
.avoir-choix__facture.is-epuisee { opacity: .62; background: var(--canvas); box-shadow: none; }
.avoir-choix__num { display: grid; line-height: 1.25; }
.avoir-choix__num strong { font-family: var(--font-display); font-variant-numeric: tabular-nums; }
.avoir-choix__type, .avoir-choix__societe { font-size: .76rem; color: var(--ink-faint); }
.avoir-choix__client { display: grid; line-height: 1.25; min-width: 0; overflow-wrap: anywhere; }
.avoir-choix__montants { display: grid; justify-items: end; gap: .1rem; text-align: right; white-space: nowrap; }
.avoir-choix__ttc { font-size: .78rem; color: var(--ink-soft); font-variant-numeric: tabular-nums; }
.avoir-choix__reste { font-size: .8rem; color: var(--ink-soft); }
.avoir-choix__reste strong { font-family: var(--font-display); color: var(--v1); font-variant-numeric: tabular-nums; }
.avoir-choix__reste.is-epuise { font-weight: 600; color: var(--ink-faint); }
.avoir-choix__go { color: var(--v1); }
.avoir-choix__vide {
    display: flex; gap: .5rem; align-items: center; padding: 1rem; border-radius: var(--r-md);
    border: 1px dashed var(--line); color: var(--ink-faint);
}
@media (max-width: 767.98px) {
    .avoir-choix__facture { grid-template-columns: minmax(0, 1fr) auto; }
    .avoir-choix__montants { white-space: normal; }
    .avoir-choix__client { grid-column: 1 / -1; grid-row: 2; }
    .avoir-choix__go { display: none; }
}

/* ---------- Fiche d'un avoir imputé : rien à rembourser (A5) ---------- */
.avoir-rembourser.is-rien { color: var(--ink-soft); font-weight: 500; }
.avoir-rembourser.is-rien > i { color: var(--v1); }

/* ---------- Fiche document : bandeau de 280 px (passe globale, U4) ----------
   Libellés et valeurs côte à côte laissaient ~95 px à la valeur, face à « Mode
   de règlement » : « D'ESCAMPE/TTE », « QUINCAILLE/RIE », le nom du client coupé
   au milieu d'un mot. Dans le bandeau étroit (≥ 1400 px), l'intitulé passe
   au-dessus de sa valeur, qui prend toute la largeur de la carte. En dessous,
   les cartes font au moins 360 px (app.css) et gardent les deux colonnes. */
@media (min-width: 1400px) {
    .doc-fiche__bandeau .detail-grid { grid-template-columns: minmax(0, 1fr); row-gap: 0; }
    .doc-fiche__bandeau .detail-grid dt {
        margin-top: .6rem; font-size: .7rem; letter-spacing: .06em; text-transform: uppercase;
    }
    .doc-fiche__bandeau .detail-grid dt:first-of-type { margin-top: 0; }
    .doc-fiche__bandeau .detail-grid dd { overflow-wrap: break-word; }
}

/* ---------- Numérotation : pièces fiscales partagées entre sociétés (A7) ---------- */
.v6-num-alerte {
    display: flex; gap: .4rem; align-items: flex-start; margin: .3rem 0 .15rem;
    padding: .4rem .65rem; border-radius: var(--r-sm);
    background: rgba(245,158,11,.13); border: 1px solid rgba(245,158,11,.4);
    color: #92400e; font-size: .8rem; font-weight: 600;
}
.v6-num-alerte > i { color: #d97706; line-height: 1.35; }
