/* Le formulaire et le suivi, habillés par le site qui les accueille.
 *
 * Chaque couleur passe par `var(--jeton, repli)` : la page qui définit ses
 * jetons sur `:root` habille le formulaire sans rien faire, et celle qui n'en
 * a pas obtient quelque chose de présentable. C'est le choix fait en
 * abandonnant l'iframe — on veut hériter, maintenant.
 *
 * Tout est préfixé `ideai-` : ces règles vivent dans le document de l'hôte, et
 * un sélecteur nu comme `input` y casserait sa page.
 *
 * Le coût, assumé : un CSS du site peut casser cette mise en page. Ce sont les
 * sites de Pierrick, et une apparence à réparer se voit, contrairement à un
 * rapport perdu. */

.ideai-bugs {
  --i-texte:  var(--text, #1a1a1a);
  --i-doux:   var(--text-muted, #5a5a5a);
  --i-bord:   var(--border, #d9d6d0);
  --i-accent: var(--accent, #1f4d4a);
  --i-fond:   var(--bg, #ffffff);
  --i-rayon:  var(--radius, 4px);

  max-width: var(--max-prose, 680px);
  color: var(--i-texte);
  font-family: var(--sans, system-ui, -apple-system, "Segoe UI", sans-serif);
}

.ideai-bugs label {
  display: block;
  margin: 1rem 0 .25rem;
  font-size: .9em;
}

.ideai-bugs select,
.ideai-bugs input[type="text"],
.ideai-bugs textarea {
  width: 100%;
  padding: .5rem .6rem;
  font: inherit;
  color: inherit;
  background: var(--i-fond);
  border: 1px solid var(--i-bord);
  border-radius: var(--i-rayon);
}

.ideai-bugs textarea { min-height: 9rem; resize: vertical; }

.ideai-bugs button {
  margin-top: 1.25rem;
  padding: .55rem 1.1rem;
  font: inherit;
  color: #fff;
  background: var(--i-accent);
  border: 0;
  border-radius: var(--i-rayon);
  cursor: pointer;
}

.ideai-bugs button[disabled] { opacity: .5; cursor: default; }

.ideai-bugs .ideai-aide,
.ideai-bugs .ideai-compteur {
  margin: .25rem 0 0;
  font-size: .85em;
  color: var(--i-doux);
}

.ideai-bugs .ideai-compteur.ideai-court { color: #a4291f; }

.ideai-bugs .ideai-message {
  margin-top: 1rem;
  padding: .75rem;
  border: 1px solid var(--i-bord);
  border-radius: var(--i-rayon);
}
.ideai-bugs .ideai-message.ideai-erreur  { border-color: #a4291f; color: #a4291f; }
.ideai-bugs .ideai-message.ideai-succes  { border-color: var(--i-accent); }

/* Le champ piège.
 *
 * Hors de l'écran plutôt que `display:none` : certains robots sautent ce qui
 * est explicitement caché, alors qu'un champ déplacé leur paraît ordinaire.
 * `aria-hidden` et `tabindex=-1`, dans le HTML, le retirent du lecteur d'écran
 * et du parcours clavier — un humain ne peut donc pas s'y faire refuser par
 * accident. */
.ideai-bugs .ideai-piege {
  position: absolute;
  left: -9999px;
  width: 1px;
  height: 1px;
  overflow: hidden;
}

/* Le suivi public. */
.ideai-bugs .ideai-bug {
  padding: .75rem 0;
  border-bottom: 1px solid var(--i-bord);
}
.ideai-bugs .ideai-bug:last-child { border-bottom: 0; }
.ideai-bugs .ideai-id {
  font-family: ui-monospace, SFMono-Regular, Menlo, monospace;
  font-size: .85em;
  color: var(--i-doux);
}
.ideai-bugs .ideai-etat {
  display: inline-block;
  margin-left: .5rem;
  padding: 0 .45rem;
  font-size: .75em;
  border: 1px solid var(--i-bord);
  border-radius: 999px;
  color: var(--i-doux);
}

/* Ajout du portail : le bouton « signaler un autre bogue », montré après un
   envoi réussi. Repris sur le bouton d'envoi du snippet pour rester de la même
   famille, en creux plutôt qu'en plein — c'est une issue, pas l'action
   principale de l'écran. */
.ideai-encore {
  appearance: none;
  margin-top: 14px;
  padding: 9px 16px;
  font: 500 15px var(--sans, system-ui, sans-serif);
  color: var(--i-accent);
  background: transparent;
  border: 1px solid var(--i-bord);
  border-radius: var(--i-rayon);
  cursor: pointer;
}
.ideai-encore:hover {
  border-color: var(--i-accent);
}
.ideai-encore[disabled] {
  opacity: 0.5;
  cursor: default;
}