/**
 * Zone de notice — .form-notice
 *
 * SOURCE UNIQUE de l'encadré d'avertissement, pour les DEUX consommateurs :
 * les blocs du thème et le markup des outils. Chargée sans condition de page.
 *
 * POURQUOI CE FICHIER EXISTE (relevé FRT-24, 2026-09-24)
 * Six systèmes de notice coexistaient, et les notices RGPD sortaient en
 * RECTANGLE BLANC OPAQUE sur fond sombre. Trois causes, toutes mesurées :
 *
 *   1. `.form-notice--rgpd` appelait un SECOND dialecte de jetons —
 *      `--color-surface-muted`, `--color-text`, `--color-border`, `--radius-sm`,
 *      `--space-sm` — dont AUCUN n'est déclaré dans le thème. La notice rendait
 *      donc intégralement sur ses valeurs de repli, qui sont des couleurs claires
 *      en dur (#f6f7f8, #222, #e2e4e8). Elle ne gérait pas mal le mode sombre :
 *      elle ne le voyait pas. (`--space-md`, lui, n'est déclaré qu'une fois, à
 *      `0 !important` sous `.woocommerce-checkout` — d'où un rembourrage qui
 *      disparaissait dans le tunnel de commande.)
 *
 *   2. La classe de BASE `.form-notice` était définie dans `login.css`, enqueuée
 *      sur TROIS gabarits seulement. Le plugin émet pourtant
 *      `class="form-notice form-notice--rgpd"` sur les pages d'outil : le
 *      modificateur y portait toute la boîte, seul. Un BEM dont seule la
 *      variante est chargée.
 *
 *   3. Boîte dans une boîte : `.tool-form-footer` peint déjà une surface
 *      (`--bg-secondary`, bordure, rayon), et la notice en peignait une seconde
 *      par-dessus.
 *
 * LA RÈGLE QUI EN DÉCOULE : LA NOTICE SE TEINTE, ELLE NE SE PEINT PAS.
 * Le fond est dérivé du ton ET de la surface courante, jamais fixé. Posée sur
 * clair elle est claire, sur sombre elle est sombre, et dans un conteneur déjà
 * peint elle ne crée pas un second cadre.
 *
 * Conséquence : AUCUNE règle `[data-theme="dark"]` dans ce fichier. Si le mode
 * sombre en demandait une, ce serait le signe que la teinte n'est pas dérivée —
 * c'est le même test que pour `form-controls.css`.
 *
 * @package Toolbox
 * @since 3.0.0.137 (FRT-24)
 */

/* ==========================================================================
   La zone
   Markup canonique :

   <div class="form-notice">
     <span class="notice-icon" aria-hidden="true">ⓘ</span>
     <div class="notice-content">…</div>
   </div>

   Tons : rien (info), --success, --warning, --error.
   ========================================================================== */

.form-notice,
.form-notice--rgpd,
.form-consent--rgpd {
  --notice-tone: var(--primary-color);

  display: flex;
  gap: var(--spacing-sm, 0.5rem);
  align-items: flex-start;
  margin: 0;
  padding: var(--spacing-md, 1rem);
  font-size: var(--font-size-sm, 0.875rem);
  line-height: 1.5;
  color: var(--text-secondary);
  border-radius: var(--border-radius-md, 0.5rem);

  /*
   * Deux déclarations, volontairement. La première est le repli des navigateurs
   * sans `color-mix()` : un jeton du thème, donc déjà adaptatif — jamais un
   * blanc en dur. La seconde teinte réellement.
   */
  background-color: var(--bg-secondary);
  background-color: color-mix(in oklab, var(--notice-tone) 8%, transparent);
  border: 1px solid var(--border-color);
  border-color: color-mix(in oklab, var(--notice-tone) 24%, transparent);
}

.form-notice--success { --notice-tone: var(--success-color); }
.form-notice--warning { --notice-tone: var(--warning-color); }
.form-notice--error   { --notice-tone: var(--error-color); }

.notice-icon {
  flex-shrink: 0;
  font-size: var(--font-size-lg, 1.125rem);
  line-height: 1.3;
  color: var(--notice-tone);
}

.notice-content {
  flex: 1;
  min-width: 0;
}

.notice-content > :first-child { margin-top: 0; }
.notice-content > :last-child { margin-bottom: 0; }

/* ==========================================================================
   Adoption du markup existant — les selecteurs REJOIGNENT la definition
   ci-dessus (regle 1 de FRT-6). Aucun markup n'est modifie.
   ========================================================================== */

/*
 * Notice RGPD des outils. L'italique est conservé : c'est une mention légale,
 * pas un message système, et la distinction est voulue par le rédacteur.
 */
.form-notice--rgpd {
  font-style: italic;
}

/*
 * `.form-rgpd--notice` est un <div> qui n'existe que pour un `text-align: left`,
 * et qui enveloppe la notice — troisième niveau de l'empilement. On ne peut pas
 * le supprimer d'ici (markup du plugin), mais il ne peint rien : une fois la
 * notice teintée, il redevient invisible. Retrait demandé dans todo-plugin.md §12.
 */

/*
 * Bloc de consentement biométrique. C'est une notice QUI CONTIENT une case —
 * tranché avec rsuard le 2026-09-24 : la notice est une boîte à part entière, la
 * case vit dedans, elle ne définit pas la zone.
 *
 * Le markup actuel est un <label> qui englobe plusieurs <p>. On ne peut pas le
 * changer d'ici ; ce qu'on peut faire, c'est cesser de le peindre en blanc. La
 * bascule du consentement sur une phrase courte plutôt que sur tout le
 * paragraphe est demandée dans todo-plugin.md §12.
 */
.form-consent--rgpd {
  cursor: pointer;
}

.form-consent__text {
  flex: 1;
  min-width: 0;
  font-style: italic;
}

.form-consent__text p { margin: 0 0 0.5rem; }
.form-consent__text p:last-child { margin-bottom: 0; }

/* Plusieurs consentements empilés */
.form-rgpd--biometric {
  display: flex;
  flex-direction: column;
  gap: var(--spacing-sm, 0.5rem);
}