/**
 * Widget ALTCHA — habillage commun aux 3 thèmes.
 *
 * Le widget v1 rend en LIGHT DOM : le CSS global des formulaires s'applique à
 * ses éléments internes. La règle `input { width:100%; padding:… }` déforme la
 * case à cocher en « barre » (piège 4.2 de ALTCHA.md) → on la neutralise ici.
 */

altcha-widget.altcha {
  /* custom element = display:inline par défaut, les marges seraient ignorées */
  display: block;
  margin: 0 0 10px;
  max-width: 100%;

  /* Ne PAS définir --altcha-border-width en inline ni ici (piège 4.3) */
  --altcha-max-width: 100%;
  --altcha-color-base: transparent;
  --altcha-color-border: transparent;
  --altcha-color-text: var(--color-text-muted, #999999);
  --altcha-color-error-text: #c0392b;
}

/* Rendu discret : le proof-of-work se résout seul, le visiteur n'a jamais à
   cliquer. On retire donc l'encadré et la case à cocher pour ne garder qu'une
   mention de confiance — qui reste le point d'ancrage des messages d'erreur. */
altcha-widget.altcha .altcha {
  border: 0;
  background: transparent;
  padding: 0;
  box-shadow: none;
}

altcha-widget.altcha .altcha-main {
  gap: 0;
  padding: 0;          /* le widget applique 0.7em : inutile sans cadre */
  align-items: center;
}

/* La case à cocher n'apporte rien puisqu'elle n'est jamais actionnée */
altcha-widget.altcha input[type="checkbox"],
altcha-widget.altcha .altcha-checkbox {
  display: none !important;
}

altcha-widget.altcha .altcha-label {
  font-size: .7rem;
  line-height: 1.3;
  color: var(--color-text-muted, #999999);
  display: flex;
  align-items: center;
  gap: 5px;
}

/* Petit bouclier, aux couleurs du texte courant */
altcha-widget.altcha .altcha-label::before {
  content: "";
  width: 11px;
  height: 11px;
  flex-shrink: 0;
  background-color: currentColor;
  -webkit-mask: var(--altcha-shield) center / contain no-repeat;
  mask: var(--altcha-shield) center / contain no-repeat;
}

:root {
  --altcha-shield: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 22s8-4 8-10V5l-8-3-8 3v7c0 6 8 10 8 10z'/%3E%3C/svg%3E");
}

/* Le rendu étant sans cadre, chaque thème n'a plus qu'une couleur de texte
   à ajuster — pas de fond ni de bordure à réintroduire. */
.theme-v2 altcha-widget.altcha .altcha-label { color: #7d8a80; }
.theme-v4 altcha-widget.altcha .altcha-label { color: var(--v4-g3, #9aa79f); }

/* Newsletter des footers : le widget passe SOUS la ligne champ + bouton */
.v4-fnl-form altcha-widget.altcha,
.footer__newsletter-form altcha-widget.altcha {
  margin: 8px 0 0;
  --altcha-max-width: 100%;
}

/* Emplacements sombres (footers, sidebar blog) */
.v4-footer altcha-widget.altcha .altcha-label,
.footer altcha-widget.altcha .altcha-label,
.blog-sidebar__block--newsletter altcha-widget.altcha .altcha-label {
  color: rgba(255, 255, 255, 0.45);
}

/* ── État d'échec ──────────────────────────────────────────────────────────
   .altcha-error est un FRÈRE de .altcha-label, pas son parent : le message
   s'affiche sous la mention grise, qui reste inchangée. Placé en fin de
   fichier pour passer après les surcharges de thème. */
altcha-widget.altcha .altcha-error {
  font-size: .72rem;
  line-height: 1.35;
  color: #e05a4d;          /* lisible sur les fonds sombres des footers */
  margin-top: 4px;
}

.theme-v4 altcha-widget.altcha .altcha-error,
.theme-v2 altcha-widget.altcha .altcha-error {
  color: #c0392b;          /* rouge de la charte sur fond clair */
}

altcha-widget.altcha .altcha-error svg { width: 13px; height: 13px; flex-shrink: 0; }