/* ============================================================
   APP 0.6.7.4 — Zones d'action mises en évidence en mode SF
   Objectif : identifier immédiatement les zones où l'utilisateur
   doit produire du contenu, sans les confondre avec un état validé.
   ============================================================ */

body.visual-mode-immersive{
  --action-field:#77f0b0;
  --action-field-rgb:119,240,176;
  --action-field-text:#effff7;
  --action-field-placeholder:#92bbaa;
}

/* Tous les textarea réellement éditables deviennent des zones d'action. */
body.visual-mode-immersive textarea.form-control:not(:disabled):not([readonly]),
body.visual-mode-immersive textarea:not(.form-control):not(:disabled):not([readonly]){
  color:var(--action-field-text)!important;
  background:
    radial-gradient(circle at 100% 0,rgba(var(--action-field-rgb),.075),transparent 30%),
    linear-gradient(180deg,rgba(5,25,24,.88),rgba(2,15,20,.82))!important;
  border:1px solid rgba(var(--action-field-rgb),.46)!important;
  box-shadow:
    inset 3px 0 0 rgba(var(--action-field-rgb),.52),
    inset 0 0 30px rgba(var(--action-field-rgb),.025),
    0 0 0 1px rgba(0,0,0,.16)!important;
  caret-color:var(--action-field);
  transition:border-color .16s ease,box-shadow .16s ease,background .16s ease;
}

/* Le placeholder reste lisible mais moins fort que la réponse. */
body.visual-mode-immersive textarea.form-control:not(:disabled):not([readonly])::placeholder,
body.visual-mode-immersive textarea:not(.form-control):not(:disabled):not([readonly])::placeholder{
  color:var(--action-field-placeholder)!important;
  opacity:.82;
}

/* Survol : le champ se signale avant même le clic. */
body.visual-mode-immersive textarea.form-control:not(:disabled):not([readonly]):hover,
body.visual-mode-immersive textarea:not(.form-control):not(:disabled):not([readonly]):hover{
  border-color:rgba(var(--action-field-rgb),.64)!important;
  box-shadow:
    inset 3px 0 0 rgba(var(--action-field-rgb),.70),
    inset 0 0 34px rgba(var(--action-field-rgb),.035),
    0 0 18px rgba(var(--action-field-rgb),.045)!important;
}

/* Focus : signal d'action franc, mais distinct du vert "succès". */
body.visual-mode-immersive textarea.form-control:not(:disabled):not([readonly]):focus,
body.visual-mode-immersive textarea:not(.form-control):not(:disabled):not([readonly]):focus{
  color:#fff!important;
  background:
    radial-gradient(circle at 100% 0,rgba(var(--action-field-rgb),.12),transparent 34%),
    linear-gradient(180deg,rgba(5,31,27,.95),rgba(2,17,22,.93))!important;
  border-color:rgba(var(--action-field-rgb),.92)!important;
  box-shadow:
    inset 4px 0 0 var(--action-field),
    0 0 0 .20rem rgba(var(--action-field-rgb),.10),
    0 0 30px rgba(var(--action-field-rgb),.12)!important;
  outline:none;
}

/* Les textarea non éditables gardent le langage visuel neutre du cockpit. */
body.visual-mode-immersive textarea:disabled,
body.visual-mode-immersive textarea[readonly]{
  opacity:.70;
  cursor:not-allowed;
}

/* Petit renfort sur les labels qui annoncent explicitement une réponse/trace.
   On reste volontairement léger : le champ lui-même est le signal principal. */
body.visual-mode-immersive .response-panel label,
body.visual-mode-immersive .step-card label.form-label{
  color:#c9fbe1;
}

/* Modes Clair et Spectrum : aucun changement. */