/* ═══════════════════════════════════════════════════════════════════
   Discuter avec mon arbre
   ═══════════════════════════════════════════════════════════════════ */

.arb { padding-block: var(--space-8, 2rem) var(--space-10, 2.5rem); }
.arb [hidden] { display: none !important; }
.arb h2 { font-size: var(--text-xl, 1.25rem); margin-bottom: var(--space-4, 1rem); }

.arb__solde {
  margin-bottom: var(--space-6, 1.5rem);
  font-size: var(--text-sm, 0.875rem);
  color: var(--clr-text-secondary, #52504C);
}

.arb__grille {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: var(--space-8, 2rem);
}

@media (min-width: 900px) {
  .arb__grille { grid-template-columns: 260px minmax(0, 1fr); align-items: start; }
}

.arb__carte {
  padding: var(--space-6, 1.5rem);
  background: var(--clr-bg-secondary, #fff);
  border: 1px solid var(--clr-border, #D4CCBF);
  border-radius: var(--radius-lg, 12px);
}

.arb__carte + .arb__carte { margin-top: var(--space-6, 1.5rem); }

/* ─── Historique ──────────────────────────────────────────────────── */

.arb__historique {
  display: flex;
  flex-direction: column;
  gap: var(--space-2, 0.5rem);
  margin-bottom: var(--space-4, 1rem);
}

.arb__vide { font-size: var(--text-sm, 0.875rem); color: var(--clr-text-muted, #8A7E73); }

.arb__item {
  display: flex;
  flex-direction: column;
  gap: 2px;
  width: 100%;
  padding: var(--space-2, 0.5rem) var(--space-3, 0.75rem);
  background: var(--clr-bg-secondary, #fff);
  border: 2px solid var(--clr-border, #D4CCBF);
  border-radius: var(--radius-base, 8px);
  font: inherit;
  color: var(--clr-text, #1A1A1A);
  text-align: left;
  cursor: pointer;
}

.arb__item.is-actif { border-color: var(--clr-accent, #C7901E); background: var(--clr-accent-light, rgba(199, 144, 30, 0.12)); }
.arb__item-titre { font-weight: 600; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.arb__item-infos { font-size: var(--text-xs, 0.75rem); color: var(--clr-text-muted, #8A7E73); }

/* ─── Import ──────────────────────────────────────────────────────── */

.arb__depot {
  display: flex;
  align-items: center;
  justify-content: center;
  min-height: 130px;
  padding: var(--space-6, 1.5rem);
  border: 2px dashed var(--clr-border-strong, #B8AFA3);
  border-radius: var(--radius-lg, 12px);
  background: var(--clr-bg, #F5F0E8);
  text-align: center;
  color: var(--clr-text-secondary, #52504C);
  font-size: var(--text-sm, 0.875rem);
  cursor: pointer;
}

.arb__depot:hover,
.arb__depot.is-survol { border-color: var(--clr-accent, #C7901E); }

.arb__resume { margin-top: var(--space-5, 1.25rem); }
.arb__resume > p { color: var(--clr-text, #1A1A1A); }

.arb__racine {
  display: flex;
  flex-direction: column;
  gap: var(--space-1, 0.25rem);
  margin-top: var(--space-4, 1rem);
  font-size: var(--text-sm, 0.875rem);
  font-weight: 600;
}

.arb__racine input,
.arb__saisie textarea {
  padding: var(--space-2, 0.5rem) var(--space-3, 0.75rem);
  border: 1px solid var(--clr-border-strong, #B8AFA3);
  border-radius: var(--radius-base, 8px);
  background: var(--clr-bg, #F5F0E8);
  color: var(--clr-text, #1A1A1A);
  font: inherit;
  font-weight: 400;
}

.arb__aide {
  margin-top: var(--space-1, 0.25rem);
  font-size: var(--text-xs, 0.75rem);
  color: var(--clr-text-muted, #8A7E73);
}

.arb__actions {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: var(--space-3, 0.75rem);
  margin-top: var(--space-4, 1rem);
}

.arb__actions--compact { margin-top: 0; }

.arb__message {
  min-height: 1.2em;
  margin-top: var(--space-2, 0.5rem);
  font-size: var(--text-sm, 0.875rem);
  color: var(--clr-text-secondary, #52504C);
}

.arb__message.is-erreur { color: var(--clr-error, #C0392B); }

.arb__lien {
  background: none;
  border: 0;
  padding: 0;
  font: inherit;
  font-size: var(--text-sm, 0.875rem);
  color: var(--clr-primary, #1B4332);
  text-decoration: underline;
  cursor: pointer;
}

.arb__lien--danger { color: var(--clr-error, #C0392B); }

/* ─── Conversation ────────────────────────────────────────────────── */

.arb__conv-tete {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  align-items: center;
  gap: var(--space-2, 0.5rem);
  margin-bottom: var(--space-4, 1rem);
  font-size: var(--text-sm, 0.875rem);
  color: var(--clr-text-secondary, #52504C);
}

.arb__chat {
  display: flex;
  flex-direction: column;
  gap: var(--space-3, 0.75rem);
  max-height: 560px;
  overflow-y: auto;
  padding-right: var(--space-1, 0.25rem);
}

.arb__bulle {
  max-width: 88%;
  padding: var(--space-3, 0.75rem) var(--space-4, 1rem);
  border-radius: var(--radius-lg, 12px);
  line-height: 1.6;
  white-space: pre-line;
}

.arb__bulle--ia {
  align-self: flex-start;
  background: var(--clr-bg-elevated, #EBE5D9);
  color: var(--clr-text, #1A1A1A);
  border-bottom-left-radius: 4px;
}

.arb__bulle--moi {
  align-self: flex-end;
  background: var(--clr-primary, #1B4332);
  color: var(--clr-text-inverse, #F5F0E8);
  border-bottom-right-radius: 4px;
}

.arb__bulle--attente { opacity: 0.7; font-style: italic; }

.arb__suggestions {
  display: flex;
  flex-wrap: wrap;
  gap: var(--space-2, 0.5rem);
  margin-top: var(--space-4, 1rem);
}

.arb__suggestion {
  padding: var(--space-1, 0.25rem) var(--space-3, 0.75rem);
  background: var(--clr-bg, #F5F0E8);
  border: 1px solid var(--clr-border-strong, #B8AFA3);
  border-radius: 999px;
  font: inherit;
  font-size: var(--text-xs, 0.75rem);
  color: var(--clr-text, #1A1A1A);
  cursor: pointer;
}

.arb__suggestion:hover { border-color: var(--clr-accent, #C7901E); }

.arb__saisie {
  display: flex;
  gap: var(--space-3, 0.75rem);
  align-items: flex-end;
  margin-top: var(--space-4, 1rem);
}

.arb__saisie textarea { flex: 1; min-height: 2.8rem; resize: vertical; }

.arb__restants {
  font-size: var(--text-xs, 0.75rem);
  color: var(--clr-text-muted, #8A7E73);
  text-align: right;
}

/* ─── Recherche de la personne de référence ───────────────────────── */

.arb__recherche { position: relative; display: block; }
.arb__recherche input { width: 100%; box-sizing: border-box; }

.arb__propositions {
  position: absolute;
  z-index: 20;
  top: calc(100% + 4px);
  left: 0;
  right: 0;
  max-height: 280px;
  overflow-y: auto;
  margin: 0;
  padding: var(--space-1, 0.25rem) 0;
  list-style: none;
  background: var(--clr-bg-elevated, #EBE5D9);
  border: 1px solid var(--clr-border-strong, #B8AFA3);
  border-radius: var(--radius-base, 8px);
  box-shadow: 0 8px 24px rgba(0, 0, 0, 0.12);
  font-weight: 400;
}

.arb__propositions li {
  padding: var(--space-2, 0.5rem) var(--space-3, 0.75rem);
  cursor: pointer;
}

.arb__propositions li:hover,
.arb__propositions li.is-actif { background: var(--clr-accent-light, rgba(199, 144, 30, 0.12)); }
.arb__propositions .arb__proposition-vide { cursor: default; color: var(--clr-text-muted, #8A7E73); }