/* Sous-onglet « Échanges » de la fiche opérateur (voir admin-echanges.js). Réutilise le gabarit de admin-shell.css (filtres, tableau,
   étiquettes .ka-tag, panneau de droite) ; seulement les détails propres au courrier. */
.kx-wrap { display: flex; flex-direction: column; gap: 12px; min-width: 0; }
.kx-wrap .ka-filters { margin: 0; }
.kx-table { width: 100%; table-layout: fixed; }
.kx-table th, .kx-table td { vertical-align: middle; }
.kx-table tbody tr { height: 46px; }
.kx-table .kx-c-date { width: 104px; }
.kx-table .kx-c-dir { width: 82px; }
.kx-table .kx-c-peer { width: 24%; }
.kx-table .kx-c-pj { width: 38px; text-align: center; }
.kx-table td.kx-subject { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.kx-table .kx-c-peer .ka-2l { min-width: 0; }
.kx-clip { color: #6F675E; vertical-align: middle; flex: 0 0 auto; }
.kx-more { display: flex; align-items: center; gap: 12px; }
.kx-more[hidden] { display: none; }

/* panneau de droite */
.kx-heads { display: flex; flex-direction: column; gap: 6px; padding: 12px; border-radius: 11px; background: #F4F1EC; font-size: 12.5px; color: #4E4740; }
.kx-h { display: grid; grid-template-columns: 96px 1fr; gap: 8px; }
.kx-hk { color: #6F675E; font-weight: 700; }
.kx-hv { overflow-wrap: anywhere; word-break: break-word; min-width: 0; }
.kx-text { margin: 0; white-space: pre-wrap; overflow-wrap: anywhere; word-break: break-word; font: 400 13.5px/1.5 Archivo, sans-serif; color: #221E1A; }
.kx-atts { display: flex; flex-direction: column; gap: 6px; }
.kx-att { display: flex; align-items: center; gap: 8px; min-width: 0; padding: 8px 10px; border: 1px solid #E2DBD1; border-radius: 10px; background: #fff; color: #221E1A; text-decoration: none; font-size: 13px; }
a.kx-att:hover { border-color: #0B5C6B; color: #0B5C6B; }
.kx-att.off { color: #8A8178; background: #F8F6F2; }
.kx-an { flex: 1 1 auto; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-weight: 700; }
.kx-hv { max-height: 6.6em; overflow-y: auto; }
/* petit écran : le tableau défile à l'horizontale plutôt que d'écraser la colonne Objet */
.kx-wrap .table-wrap { overflow-x: auto; }
.kx-table { min-width: 680px; }