/* ═══════════════════════════════════════════════════════════
   DTISoft — Rapprochement / lettrage — namespace `let-` (bleu DTI)
   z-index 9800 : au-dessus de la fiche tiers (td 9600).
   ═══════════════════════════════════════════════════════════ */
.let-overlay {
    position: fixed; inset: 0; z-index: 9800;
    display: flex; align-items: center; justify-content: center;
    background: rgba(15, 23, 42, .5);
}
.let-panel {
    display: flex; flex-direction: column;
    width: 900px; max-width: calc(100% - 32px); height: 82vh; max-height: 82vh;
    background: #fff; border-radius: 10px; overflow: hidden;
    box-shadow: 0 24px 64px rgba(0, 0, 0, .4);
    font-size: 13px; color: #1e293b;
}
.let-header {
    display: flex; align-items: center; gap: 8px;
    padding: 9px 12px; background: #2563eb; color: #fff; flex: 0 0 auto;
}
.let-title { flex: 1 1 auto; font-weight: 600; font-size: 14px; min-width: 0; display: flex; align-items: center; gap: 8px; }
.let-title-txt { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.let-close { background: rgba(255,255,255,.15); color: #fff; border: none; cursor: pointer; width: 28px; height: 26px; border-radius: 5px; }
.let-close:hover { background: rgba(255,255,255,.3); }

.let-body { flex: 1 1 auto; overflow: hidden; padding: 12px; }
.let-loading { padding: 30px; text-align: center; color: #64748b; }

.let-cols { display: flex; gap: 14px; height: 100%; }
.let-col { flex: 1 1 50%; min-width: 0; display: flex; flex-direction: column; border: 1px solid #e2e8f0; border-radius: 8px; overflow: hidden; }
.let-col-head { padding: 7px 10px; background: #eff6ff; color: #1d4ed8; font-weight: 700; font-size: 12px; border-bottom: 1px solid #dbeafe; flex: 0 0 auto; }
.let-list { flex: 1 1 auto; overflow: auto; }
.let-empty { padding: 20px; text-align: center; color: #94a3b8; }

/* Tiers suivi dans Horus (2026-10-13) : bandeau au-dessus des deux colonnes. `let-body--suivi` n'est posée QUE dans ce
   cas (bandeau + colonnes empilés, les colonnes prennent la hauteur restante) ; sans elle, rien ne change. */
.let-body--suivi { display: flex; flex-direction: column; gap: 10px; }
.let-body--suivi .let-cols { flex: 1 1 auto; min-height: 0; height: auto; }
.let-suivi {
    flex: 0 0 auto; display: flex; align-items: flex-start; gap: 8px;
    padding: 8px 12px; background: #eff6ff; border: 1px solid #bfdbfe; border-radius: 8px;
    color: #1e3a8a; font-size: 12.5px; line-height: 1.45;
}
.let-suivi i { margin-top: 2px; color: #2563eb; flex: 0 0 auto; }
.let-suivi-txt { flex: 1 1 auto; min-width: 0; }
.let-suivi-solde { flex: 0 0 auto; white-space: nowrap; font-weight: 700; padding-left: 12px; }

.let-row { padding: 7px 10px; border-bottom: 1px solid #f1f5f9; cursor: pointer; display: grid; grid-template-columns: 1fr auto; gap: 4px 10px; align-items: center; }
.let-row:hover { background: #f8fafc; }
.let-row.let-sel { background: #dbeafe; box-shadow: inset 3px 0 0 #2563eb; }
.let-row-main { font-weight: 600; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.let-row-date { font-weight: 400; color: #94a3b8; margin-left: 8px; font-size: 12px; }
.let-row-amt { text-align: right; font-weight: 700; color: #1d4ed8; white-space: nowrap; }
.let-row-amt small { color: #94a3b8; font-weight: 400; margin-left: 4px; }

.let-chips { grid-column: 1 / -1; display: flex; flex-wrap: wrap; gap: 4px; margin-top: 2px; }
.let-chip { background: #eef2f7; border: 1px solid #e2e8f0; border-radius: 12px; padding: 1px 8px; font-size: 11.5px; display: inline-flex; align-items: center; gap: 5px; }
.let-unlink { cursor: pointer; color: #94a3b8; }
.let-unlink:hover { color: #dc2626; }

.let-foot { display: flex; align-items: center; justify-content: space-between; gap: 10px; padding: 10px 14px; border-top: 1px solid #eef2f7; flex: 0 0 auto; }
.let-hint { color: #64748b; font-size: 12px; }
.let-link-btn { background: #2563eb; color: #fff; border: none; border-radius: 7px; padding: 7px 16px; font-size: 13px; font-weight: 600; cursor: pointer; }
.let-link-btn:hover:not(:disabled) { background: #1d4ed8; }
.let-link-btn:disabled { opacity: .5; cursor: default; }
