/* Interrupteurs façon iOS à la place des cases à cocher, dans tout l'outil.
   Couleur « activé » : --switch-on (vert iOS par défaut ; les pages publiques
   prennent la couleur de l'organisateur). Clavier, focus et lecteurs d'écran
   restent ceux d'une case à cocher native. */
input[type=checkbox] {
  -webkit-appearance: none; appearance: none; position: relative; flex: none; display: inline-block; vertical-align: middle;
  width: 46px !important; height: 28px !important; margin: 0; padding: 0; border: 0; border-radius: 999px; cursor: pointer;
  background: var(--switch-off, #D1D1D6); transition: background-color .25s ease;
}
input[type=checkbox]::before {
  content: ''; position: absolute; top: 2px; left: 2px; width: 24px; height: 24px; border-radius: 50%; background: #fff;
  box-shadow: 0 3px 8px rgba(0, 0, 0, .15), 0 1px 1px rgba(0, 0, 0, .16), 0 3px 1px rgba(0, 0, 0, .1);
  transition: transform .25s cubic-bezier(.3, 1.4, .5, 1), width .15s ease;
}
input[type=checkbox]:active:not(:disabled)::before { width: 30px; }
input[type=checkbox]:checked { background: var(--switch-on, #34C759); }
input[type=checkbox]:checked::before { transform: translateX(18px); }
input[type=checkbox]:checked:active:not(:disabled)::before { transform: translateX(12px); }
input[type=checkbox]:focus-visible { outline: 2px solid var(--focus, #0A84FF); outline-offset: 2px; }
input[type=checkbox]:disabled { opacity: .45; cursor: not-allowed; }
:root[data-theme="dark"] input[type=checkbox]:not(:checked) { background: var(--switch-off-dark, #39393D); }
@media (prefers-color-scheme: dark) { :root:not([data-theme="light"]) input[type=checkbox]:not(:checked) { background: var(--switch-off-dark, #39393D); } }
@media (prefers-reduced-motion: reduce) { input[type=checkbox], input[type=checkbox]::before { transition: none; } }