/* =============================================================================
   PATCH — LISIBILITÉ des CONTRÔLES · thème dark + or (SITE PUBLIC + PORTAILS)
   Fichier d'inclusion : otoya_lisibilite_public.css  (chargé APRÈS le CSS du site)
   Date : 2026-08-08 · Même propriétaire que le fix Console (cohérence dark+or)
   -----------------------------------------------------------------------------
   SURFACES PUBLIQUES CONCERNÉES (fichiers RÉELS repérés dans 04_OTO) :

   • Site vente / accueil / pages légales — servi : /static/site/helios-site.css
       source : …/SITE_VENTE_OTOV7/build/assets/helios-site.css
       Cause : .hx-row input { accent-color: var(--hx-gold); … } (case native
       sur fond --hx-ink #0a0a12 → décoché quasi invisible). Tokens : --hx-gold
       #f0b429, --hx-ink #0a0a12, --hx-pearl #f5f2ea, --hx-muted rgba(245,242,234,.62).
   • Portails Frappe (auto-inscription intervenants / bibliothèque) — servis
       /inscription, /intervenants, /bibliotheque :
       otov7_platform/www/{inscription,intervenants,bibliotheque}/index.html
       Cause : <input type="checkbox" id="rgpd"> NON stylé sur fond #0a0a12
       (consentement RGPD illisible coché/décoché). Ces pages utilisent un
       <style> INLINE → coller le bloc « §1 CASES » ci-dessous dans leur <style>
       (voir runbook), OU lier ce fichier.
   • Frontends statiques (dashboards / compta / inventaire) :
       otov7/static/oto_unified.css (color-scheme:dark sur inputs, PAS sur cases),
       otov7/static/frontend/bi_dashboard/styles_dashboard.css (--c-text-muted
       #5d6677 ≈3:1, trop faible), immersif css/main.css (placeholder blanc .4).

   Palette conservée : NOIR #0a0a12  ·  OR #f0b429 / #ffd88a  ·  perle #f5f2ea.
   PORTÉE : états des contrôles uniquement. Ne modifie pas la mise en page.
   DÉPLOIEMENT + ROLLBACK : RUNBOOK_LISIBILITE_DARKOR_2026-08-08.md
   ========================================================================== */

/* --- §1 CASES À COCHER (bloc PORTABLE : réutilisable tel quel dans un <style> inline) ---
   décoché = contour or vide · coché = fond or plein + coche sombre nette */
input[type="checkbox"]{
  -webkit-appearance: none; appearance: none;
  width: 18px; height: 18px; margin: 0 8px 0 0; padding: 0;
  border: 2px solid var(--hx-gold, var(--gold, #f0b429));      /* contour OR plein à vide */
  border-radius: 4px;
  background: rgba(255,255,255,.06) no-repeat center;           /* boîte vide éclaircie */
  background-size: 13px 13px;
  vertical-align: middle; cursor: pointer; box-sizing: border-box;
  transition: background-color .12s ease, border-color .12s ease, box-shadow .12s ease;
  flex: 0 0 auto;
}
/* COCHÉ = fond or plein + coche sombre (SVG en background : robuste, glanceable) */
input[type="checkbox"]:checked{
  background: var(--hx-gold, var(--gold, #f0b429))
    url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath fill='none' stroke='%230a0a12' stroke-width='2.6' stroke-linecap='round' stroke-linejoin='round' d='M3.5 8.4l3 3 6-6.9'/%3E%3C/svg%3E")
    no-repeat center;
  background-size: 13px 13px;
  border-color: var(--hx-gold, var(--gold, #f0b429));
}
input[type="checkbox"]:indeterminate{
  background: var(--hx-gold, var(--gold, #f0b429))
    url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Crect x='3' y='7' width='10' height='2.4' rx='1' fill='%230a0a12'/%3E%3C/svg%3E")
    no-repeat center;
  background-size: 13px 13px;
  border-color: var(--hx-gold, var(--gold, #f0b429));
}
input[type="checkbox"]:disabled{ opacity:.5; cursor:not-allowed; }

/* --- §2 BOUTONS RADIO --- */
input[type="radio"]{
  -webkit-appearance: none; appearance: none;
  width: 18px; height: 18px; margin: 0 8px 0 0;
  border: 2px solid var(--hx-gold, var(--gold, #f0b429));
  border-radius: 50%;
  background: rgba(255,255,255,.06);
  vertical-align: middle; cursor: pointer; box-sizing: border-box;
  transition: background .12s ease, box-shadow .12s ease;
}
input[type="radio"]:checked{
  background: radial-gradient(circle at 50% 50%,
    var(--hx-gold, var(--gold, #f0b429)) 0 4.5px, transparent 5.5px) no-repeat center,
    rgba(240,180,41,.14);
  border-color: var(--hx-gold, var(--gold, #f0b429));
}
input[type="radio"]:disabled{ opacity:.5; cursor:not-allowed; }

/* --- §3 TOGGLES / INTERRUPTEURS (défensif : agit seulement si le balisage existe)
   OFF = piste grise, bouton à gauche · ON = piste or, bouton à droite --- */
[role="switch"],
.switch input[type="checkbox"],
.toggle input[type="checkbox"]{
  -webkit-appearance:none; appearance:none;
  width:42px; height:24px; border-radius:999px;
  border:1px solid rgba(245,176,74,.35);
  background:#2a2a38; position:relative; display:inline-block;
  cursor:pointer; transition: background .15s ease, border-color .15s ease;
}
[role="switch"]::after,
.switch input[type="checkbox"]::after,
.toggle input[type="checkbox"]::after{
  content:""; position:absolute; top:2px; left:2px;
  width:18px; height:18px; border-radius:50%;
  background:#f5f2ea; transform:none;
  transition:left .15s ease, background .15s ease;
}
[role="switch"][aria-checked="true"],
.switch input[type="checkbox"]:checked,
.toggle input[type="checkbox"]:checked{
  background: var(--hx-gold, var(--gold, #f0b429));
  border-color: var(--hx-gold, var(--gold, #f0b429));
}
[role="switch"][aria-checked="true"]::after,
.switch input[type="checkbox"]:checked::after,
.toggle input[type="checkbox"]:checked::after{ left:22px; background:#0a0a12; }

/* --- §4 FOCUS : anneau or visible partout (accessibilité clavier) --- */
input:focus-visible,
textarea:focus-visible,
select:focus-visible,
button:focus-visible,
a:focus-visible,
[role="switch"]:focus-visible,
[tabindex]:focus-visible{
  outline: 2px solid var(--hx-gold, var(--gold, #f0b429));
  outline-offset: 2px;
  box-shadow: 0 0 0 3px rgba(240,180,41,.30);
}

/* --- §5 PLACEHOLDERS remontés au-dessus du seuil de lisibilité --- */
input::placeholder,
textarea::placeholder,
.hx-field input::placeholder,
.signup-input::placeholder{
  color: rgba(245,242,234,.72) !important;   /* .40/.62 -> .72 : lisible, reste discret */
  -webkit-text-fill-color: rgba(245,242,234,.72) !important;
  opacity: 1 !important;
}

/* --- §6 TEXTE « muted » faible contraste (dashboards / tagline / sous-titres) ---
   Ne s'applique qu'aux tokens muted trop sombres ; garde l'esprit discret.  */
:root{
  --hx-muted: rgba(245,242,234,.78);   /* .62 -> .78 */
  --c-text-muted: #97a0b2;             /* dashboards : #5d6677 -> #97a0b2 (≈6:1) */
}

/* --- §7 LIENS de contenu : contraste + soulignement au survol --- */
.hx-legal a, .legal a, main a, article a, .content a{
  color: var(--hx-gold-soft, #f5c65e);
  text-underline-offset: 2px;
}

/* =============================================================================
   FIN DU PATCH LISIBILITÉ (public). Réversible : retirer l'inclusion = origine.
   ========================================================================== */