/*
 * Fiche dossier v2 (Karim, 8 oct) : la maquette fiche-dossier-maquette.html, valeurs recopiées.
 * Accroche : `nbt-fiche-dossier` (ViewCase::getPageClasses), posée APRÈS `nbt-fiche-prospect` et
 * `nbt-fiche-contact`, dont la page reprend l'en-tête, les cartes, les tableaux et le téléphone.
 * Ce projet ne compile pas Tailwind (AucuneClasseFantomeTest) : chaque classe des vues
 * resources/views/filament/dossiers/ est ici ou dans nbt-brand.css.
 */

/* La bande (`.hl`) : cinq cases, quatre sans le droit de voir les factures ; deux par ligne sous 1 100 px. */
/* Interligne fixé : sans lui, l'espace fine des montants (police de secours à 200 %) double la hauteur d'une ligne. */
.nbt-bref-dossier { grid-template-columns: repeat(var(--nbt-cases, 5), 1fr); line-height: 1.4; }
.nbt-bref-dossier .nbt-bref-indice { margin-top: 2px; }
.nbt-bref-dossier .nbt-pastille { margin-bottom: 6px; }
@media (max-width: 1100px) { .nbt-bref-dossier { grid-template-columns: repeat(2, 1fr); } }

/* L'aperçu 👁 (fiche contact) suit la page : étapes et pièces sous « Karim — Permis de travail — Canada ». */
.nbt-ap-groupe { margin: 10px 0 2px; font-size: 13px; font-weight: 600; }

/* « Services vendus » : la ligne vendue après la signature, hors de tout contrat signé (`.mq-row-red`). */
.fi-ta-row.nbt-ligne-hors-contrat > td { background: #FFF8F7; }
.dark .fi-ta-row.nbt-ligne-hors-contrat > td { background: color-mix(in oklab, var(--danger-500) 10%, transparent); }

/* Les gestes d'une ligne (Corriger le prix · Pour · Retirer) serrés : « Services vendus » tient dans ses deux tiers. */
.nbt-fiche-dossier .fi-ta-cell .fi-ta-actions { gap: 0; }

/* « Pièces exigées » : « Reçue » attend d'être validée (l'orange des badges Filament). */
.nbt-pastille-attente { background: #FFF7E6; color: #B45309; }
.nbt-fiche-dossier .fi-ta-text .nbt-pastille { margin-top: 4px; }

/* Téléphone : nbt-brand.css garde 15rem à un texte qui passe à la ligne (pour les tableaux qui défilent) ; ici rien ne défile. */
@media (max-width: 767px) { .nbt-fiche-dossier .fi-ta-text.fi-wrapped { min-width: 0; } }

/*
 * A+ dossier guidé (PM, 10 oct — B2) : la carte d'un contrat, valeurs recopiées de
 * maquettes-workflow/a-plus.html (bloc « NOUVEAU · A+ »). Classes `ap-*` des vues dossiers/.
 */
.ap-muted { margin: 0; color: #6B6875; font-size: 13px; line-height: 1.5; }
.ap-help { margin: 0; font-size: 12.5px; color: #6B6875; line-height: 1.45; }
.ap-red { color: #B42318; }
.ap-orange { color: #B45309; }
.ap-ok { color: #15803D; }
.ap-flush .fi-section-content { padding: 0 !important; }
/* La barre d'un contrat (valeurs de barre-du-contrat.blade.php) ; repliée sur un téléphone. */
.ap-steps .nbt-etape { padding: 7px 11px 7px 13px; line-height: 1.25; }
@media (max-width: 640px) {
    .ap-steps .nbt-etape { flex: 1; min-width: 0; font-size: 0; padding: 7px 2px 7px 14px; }
    .ap-steps .nbt-etape::before { content: attr(data-n); font-size: 12px; }
    .ap-steps .nbt-etape-en-cours { flex: 4; font-size: 12px; }
    .ap-steps .nbt-etape-en-cours::before { content: none; }
    .ap-steps .nbt-etape:not(:last-child)::after { right: -8px; width: 16px; }
}
/* « Prochaine étape » */
.ap-next { display: flex; flex-wrap: wrap; gap: 12px 16px; align-items: center; justify-content: space-between; margin-top: 12px; padding: 14px 16px; border: 1px solid #F3D6DB; border-radius: 12px; background: #FFF8F9; box-shadow: inset 3px 0 0 #C8102E; }
.ap-next-t { flex: 1 1 17rem; min-width: 0; display: flex; flex-direction: column; gap: 3px; }
.ap-next-k { font-size: 11.5px; font-weight: 600; letter-spacing: .06em; text-transform: uppercase; color: #6B6875; }
.ap-next-h { font-size: 16px; font-weight: 700; line-height: 1.3; color: #14121A; }
.ap-next-s { font-size: 13px; line-height: 1.45; color: #3b3843; }
.ap-next-acts { display: flex; gap: 8px; align-items: center; }
.ap-next-acts .fi-sc, .ap-next-acts .fi-ac { display: flex; flex-wrap: nowrap; gap: 8px; align-items: center; }
.ap-next.ap-wait { border-color: #FCE3BF; background: #FFFBF3; box-shadow: inset 3px 0 0 #D97706; }
.ap-next.ap-done { border-color: #CDEFD9; background: #F4FBF7; box-shadow: inset 3px 0 0 #15803D; }
.ap-next.ap-warn { border-color: #FECDCA; background: #FFF5F4; box-shadow: inset 3px 0 0 #B42318; }
.ap-tag { display: inline-block; margin-left: 6px; border-radius: 999px; padding: 1px 8px; font-size: 11.5px; font-weight: 600; background: #F2F4F7; color: #344054; vertical-align: 2px; white-space: nowrap; }
/* Téléphone : le geste principal sur toute la largeur, les autres dessous — le « ⋯ » ne sort plus de la carte (Karim, 14 oct). */
@media (max-width: 640px) { .ap-next-acts, .ap-next-acts .fi-sc, .ap-next-acts .fi-ac { width: 100%; } .ap-next-acts .fi-ac { flex-wrap: wrap; } .ap-next-acts .ap-main { flex: 1 1 100%; } }
/* La carte du contrat */
.ap-kv { display: grid; grid-template-columns: 7rem minmax(0, 1fr); gap: 8px 14px; margin-top: 14px; font-size: 14px; line-height: 1.45; }
.ap-k { font-size: 12.5px; color: #6B6875; padding-top: 1px; }
@media (max-width: 480px) { .ap-kv { grid-template-columns: minmax(0, 1fr); gap: 1px; } .ap-kv .ap-k { margin-top: 8px; } }
.ap-pdf, .ap-pdf .fi-sc, .ap-pdf .fi-ac { display: inline-flex; vertical-align: baseline; }
.ap-auto { display: flex; gap: 8px; align-items: flex-start; margin-top: 12px; padding: 9px 12px; border: 1px dashed #D0D5DD; border-radius: 10px; background: #FAFAFB; font-size: 13px; line-height: 1.45; color: #3b3843; }
.ap-auto .fi-icon { flex: none; margin-top: 1px; color: #6B6875; }
.ap-auto b { color: #14121A; font-weight: 600; }
.ap-family { margin-top: 14px; padding: 12px 14px; border: 1px solid #E7E5EA; border-radius: 10px; }
.ap-ech { margin: 14px -18px -14px; border-top: 1px solid #E7E5EA; }
.ap-ech-h { padding: 10px 18px 0; font-size: 14px; font-weight: 600; }
.ap-ta-foot { padding: .625rem 1rem; border-top: 1px solid #F0EFF2; font-size: 13px; line-height: 1.5; color: #6B6875; font-variant-numeric: tabular-nums; }
.ap-ta-foot b { color: #14121A; }
.ap-ech .fi-ta-actions .fi-sc, .ap-ech .fi-ta-actions .fi-ac { display: flex; }
.ap-empty { display: flex; flex-wrap: wrap; gap: 4px 12px; padding: 12px 20px; font-size: 14px; color: #6B6875; }
.ap-empty span { font-size: 12.5px; }
.ap-badges { display: flex; flex-wrap: wrap; gap: 4px; }
.nbt-ph-only.ap-badges { display: none; margin-top: 6px; }
/* « Encaissements du dossier », téléphone : « date · Chèque n°… · banque » passe à la ligne sous le reçu (contrôle A+ final n°1). */
.nbt-fiche-dossier .fi-ta-text-description .nbt-ph-only { white-space: normal; }
@media (max-width: 767px) { .ap-md { display: none !important; } .nbt-ph-only.ap-badges { display: flex; } }
/* La carte « Facture » (A+, B4) */
.ap-side-card { display: flex; flex-direction: column; gap: 6px; }
.ap-fact { display: flex; flex-direction: column; gap: 4px; padding-bottom: 12px; margin-bottom: 12px; border-bottom: 1px solid #E7E5EA; }
.ap-fact:last-of-type { border-bottom: 0; margin-bottom: 6px; padding-bottom: 0; }
.ap-fact-h { display: flex; gap: 8px; align-items: center; flex-wrap: wrap; font-size: 14px; }
.ap-links, .ap-links .fi-sc, .ap-links .fi-ac { display: flex; flex-wrap: wrap; gap: 4px 14px; margin-top: 2px; }
.ap-signal { margin-top: 6px; align-self: flex-start; }
/* « À valider » (A+, B4) */
.ap-count { display: inline-grid; place-items: center; min-width: 22px; height: 22px; padding: 0 7px; border-radius: 999px; background: #C8102E; color: #fff; font-size: 12px; font-weight: 700; margin-left: 8px; vertical-align: 1px; }
/* « Journal » de la barre du haut (maquette `.bell`) : le propriétaire seul. */
.ap-bell { display: inline-flex; align-items: center; gap: 6px; border: 1px solid #E7E5EA; border-radius: 999px; padding: 3px 4px 3px 10px; font-size: 13px; color: inherit; text-decoration: none; white-space: nowrap; }
.ap-bell .ap-count { margin: 0; }
.dark .ap-bell { border-color: rgb(255 255 255 / .1); }
.ap-aval-items { display: flex; flex-direction: column; gap: 12px; }
/* Les lignes faites sous « À valider » (`S.log` de la maquette, contrôle A+ final n°3). */
.ap-done-line { display: flex; gap: 6px; align-items: flex-start; font-size: 13px; line-height: 1.45; color: #15803D; }
.ap-done-line .fi-icon { flex: none; margin-top: 2px; }
.ap-item { border: 1px solid #E7E5EA; border-radius: 12px; padding: 14px; display: flex; flex-direction: column; gap: 12px; }
.ap-item-h { display: flex; flex-wrap: wrap; gap: 6px 8px; align-items: center; font-size: 14px; line-height: 1.4; }
.ap-item-h b { font-weight: 700; }
.ap-item-grid { display: grid; grid-template-columns: minmax(0, 190px) minmax(0, 1fr); gap: 16px; align-items: start; }
@media (max-width: 640px) { .ap-item-grid { grid-template-columns: minmax(0, 1fr); } .ap-item-grid .ap-scan { max-width: 220px; } }
.ap-scan { margin: 0; }
.ap-scan figcaption { font-size: 12px; color: #6B6875; margin-top: 6px; overflow-wrap: anywhere; }
.ap-svg { display: block; width: 100%; height: auto; border-radius: 8px; }
.ap-inv { font-size: 13px; line-height: 1.45; min-width: 0; }
.ap-inv-h { font-size: 12px; font-weight: 600; letter-spacing: .06em; text-transform: uppercase; color: #6B6875; margin-bottom: 6px; }
.ap-inv table { width: 100%; border-collapse: collapse; font-variant-numeric: tabular-nums; }
.ap-inv td { padding: 5px 0; border-bottom: 1px solid #EEECF1; vertical-align: top; }
.ap-inv td.r { text-align: right; white-space: nowrap; padding-left: 10px; }
.ap-inv td.ap-k { width: 38%; padding-right: 10px; }
.ap-inv p { margin: 0 0 10px; }
.ap-acts, .ap-acts .fi-sc, .ap-acts .fi-ac { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; }
/* « Payer séparément » (A+, B3) */
.ap-switch { display: inline-flex; align-items: center; gap: 10px; font-weight: 600; font-size: 14px; cursor: pointer; }
.ap-switch input { appearance: none; -webkit-appearance: none; width: 36px; height: 20px; border-radius: 999px; background: #D0D5DD; position: relative; cursor: pointer; margin: 0; flex: none; transition: background-color .15s ease-out; }
.ap-switch input::after { content: ""; position: absolute; top: 2px; left: 2px; width: 16px; height: 16px; border-radius: 50%; background: #fff; box-shadow: 0 1px 2px rgba(0, 0, 0, .2); transition: transform .15s ease-out; }
.ap-switch input:checked { background: #C8102E; }
.ap-switch input:checked::after { transform: translateX(16px); }
.ap-switch input:focus-visible { outline: 2px solid #C8102E; outline-offset: 2px; }
@media (prefers-reduced-motion: reduce) { .ap-switch input, .ap-switch input::after { transition: none; } }
/* Fiche contact, « À faire pour ce client » et « Reçus » (A+, B5) */
.ap-todo { list-style: none; margin: 0; padding: 0; }
.ap-todo > li { display: flex; flex-wrap: wrap; gap: 10px 16px; justify-content: space-between; align-items: center; padding: 14px 18px; border-top: 1px solid #E7E5EA; }
.ap-todo > li:first-child { border-top: 0; }
.ap-todo-m { flex: 1 1 17rem; min-width: 0; display: flex; flex-direction: column; gap: 4px; }
.ap-todo-ref { font-size: 12.5px; color: #6B6875; }
.ap-todo-next { font-size: 15px; font-weight: 700; }
.ap-facts { display: flex; flex-wrap: wrap; gap: 3px 14px; font-size: 13px; line-height: 1.45; color: #3b3843; }
.ap-facts b { font-weight: 600; }
.ap-todo-acts, .ap-todo-acts .fi-sc, .ap-todo-acts .fi-ac { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; }
.ap-recus { list-style: none; margin: 0; padding: 0; }
.ap-recus li { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: center; gap: 6px 12px; padding: 11px 18px; border-top: 1px solid #E7E5EA; font-size: 13.5px; }
.ap-recus li:first-child { border-top: 0; }
.ap-recus li > span:first-child { display: flex; flex-direction: column; gap: 2px; min-width: 0; }
.ap-recus small { color: #6B6875; font-size: 12.5px; }
.ap-recus li > span:last-child, .ap-recus li > span:last-child .fi-sc, .ap-recus li > span:last-child .fi-ac { display: flex; align-items: center; gap: 4px; }

/* « Photographier le contrat signé » (contrôle A+ F1) : la vignette et le bouton de la maquette (`.ap-photo`, `.ap-thumb`). */
.ap-photo { display: flex; gap: 12px; align-items: center; flex-wrap: wrap; }
.ap-thumb { display: block; width: 84px; flex: none; border: 1px solid #E7E5EA; border-radius: 9px; overflow: hidden; background: #fff; }
.ap-thumb img { display: block; width: 100%; height: auto; }

/* « Documents » (contrôle A+ F1) : la liste de la maquette (`.ap-docs`) ; un nom qui s'ouvre garde l'allure du texte. */
.ap-docs { list-style: none; margin: 0; padding: 0; font-size: 13.5px; }
.ap-docs li { display: flex; justify-content: space-between; gap: 10px; padding: 7px 0; border-bottom: 1px solid #F0EFF2; }
.ap-docs li:last-child { border-bottom: 0; }
.ap-docs span:last-child { color: #6B6875; font-size: 12.5px; white-space: nowrap; }
.ap-docs button { padding: 0; border: 0; background: none; font: inherit; color: inherit; text-align: left; cursor: pointer; overflow-wrap: anywhere; }
.ap-docs button:hover { text-decoration: underline; }
.ap-docs button:focus-visible { outline: 2px solid var(--primary-600); outline-offset: 2px; border-radius: 2px; }