/* einstellungen – Schalterzeile im iOS-Stil (echte Checkbox mit role="switch", damit VoiceOver sie als Schalter ansagt) */
@layer module {
  .schalter-zeile { display: flex; align-items: center; justify-content: space-between; gap: var(--a4); min-height: var(--tipp); }
  .schalter-zeile input {
    appearance: none; flex: none;
    inline-size: 51px; block-size: 31px; border-radius: 999px;
    background: var(--schalter-aus);
    position: relative; cursor: pointer;
    transition: background-color var(--dauer) var(--kurve);
  }
  .schalter-zeile input::after {
    content: ""; position: absolute; inset-block-start: 2px; inset-inline-start: 2px;
    inline-size: 27px; block-size: 27px; border-radius: 50%;
    background: var(--schalter-knopf); box-shadow: 0 2px 6px rgb(0 0 0 / .2);
    transition: transform var(--dauer) var(--kurve);
  }
  .schalter-zeile input:checked { background: var(--gruen); }
  .schalter-zeile input:checked::after { transform: translateX(20px); }
}
