/* controls.css — iOS-Toggle-Switches + CI-Modal-Button-Overrides.
   (Die frühere .contact-badge war eine fehlplatzierte, nur im Kitchen-Sink genutzte Eigen-Komponente —
   entfernt; geteilte Plaketten kommen aus dem badges-Kernmodul via Design::badge/chip.) */

/* =============================================
   iOS Toggle Switch (.mage-toggle)
   ============================================= */
.mage-toggle {
    position: relative;
    display: inline-block;
    width:var(--sz-44);
    height:var(--sz-24);
    cursor: pointer;
    vertical-align: middle;
}
.mage-toggle input {
    opacity: 0;
    width: 0;
    height: 0;
    position: absolute;
}
.mage-toggle-slider {
    position: absolute;
    top: 0; left: 0; right: 0; bottom: 0;
    background-color: var(--grey-300);
    border-radius:var(--radius);
    transition: background-color var(--dur) ease;
}
.mage-toggle-slider::before {
    content: '';
    position: absolute;
    height:var(--sz-18);
    width:var(--sz-18);
    left: 3px;
    bottom: 3px;
    background-color: var(--surface);
    border-radius: 50%;
    transition: transform var(--dur) ease;
    box-shadow:var(--shadow-md);
}
.mage-toggle input:checked + .mage-toggle-slider {
    background-color: var(--ok);
}
.mage-toggle input:checked + .mage-toggle-slider::before {
    transform: translateX(20px);
}

/* Kleine Variante (36×20) — explizit via .mage-toggle-sm ODER kontextbestimmt in jeder .mage-table (Tabellenzeile). Kein per-Aufruf-Flag mehr noetig -> keine zwei Groessen desselben Elements durch Vergessen. */
.mage-toggle.mage-toggle-sm,
.mage-table .mage-toggle {
    width:var(--sz-36);
    height:var(--sz-20);
}
.mage-toggle-sm .mage-toggle-slider,
.mage-table .mage-toggle-slider {
    border-radius:var(--radius);
}
.mage-toggle-sm .mage-toggle-slider::before,
.mage-table .mage-toggle-slider::before {
    height:var(--sz-14);
    width:var(--sz-14);
}
.mage-toggle-sm input:checked + .mage-toggle-slider::before,
.mage-table .mage-toggle input:checked + .mage-toggle-slider::before {
    transform: translateX(16px);
}
.mage-toggle-sm input:disabled + .mage-toggle-slider,
.mage-table .mage-toggle input:disabled + .mage-toggle-slider {
    opacity:var(--op-half);
    cursor: default;
}

/* =============================================
   Edit/Delete Action Icons - keine Unterstreichung
   ============================================= */
a.ac-btn-action { text-decoration: none !important; }

/* =============================================
   CI: Alle Modal Speichern-Buttons orange
   ============================================= */