/* Auftrag DEMO: Demo-Knopf am Login, Seiten des Demo-Zugangs, Demo-Band */
.demo-einstieg { max-width: 380px; margin: -6vh auto 2rem; display: flex; flex-direction: column; align-items: center; gap: .4rem; text-align: center; }
.demo-einstieg .knopf { width: 100%; text-align: center; }
.demo-seite { max-width: 520px; margin: 6vh auto; }
.demo-hinweis { background: #fff6dd; color: var(--warnung); border: 1px solid #f2dc9b; border-radius: 6px; padding: .5rem .7rem; }
.demo-falle { position: absolute; left: -10000px; width: 1px; height: 1px; overflow: hidden; }
.demo-start .feld { display: flex; flex-direction: column; gap: .3rem; margin: .8rem 0; }
.demo-start img.captcha { display: block; width: 200px; max-width: 100%; height: auto; margin-bottom: .4rem; border: 1px solid var(--linie); border-radius: 6px; }
.demo-klein { font-size: .9rem; margin-top: 1rem; }
.demo-links { justify-content: flex-start; }
.demo-band { display: flex; flex-wrap: wrap; align-items: center; gap: .4rem 1.2rem; padding: .45rem 1.2rem; background: #1d2327; color: #fff; font-size: .9rem; }
.demo-band form { margin: 0; }
.demo-band button.link, .demo-band a { color: #ffd9d6; }
.demo-band .demo-testen { margin-left: auto; font-weight: 600; color: #fff; background: var(--akzent); padding: .2rem .7rem; border-radius: 99px; text-decoration: none; }
.demo-band .demo-rest { color: #c9ced6; }
.demo-warnung { padding: .45rem 1.2rem; background: #fff6dd; color: var(--warnung); border-bottom: 1px solid #f2dc9b; font-size: .9rem; }
@media (max-width: 600px) { .demo-band .demo-testen { margin-left: 0; } }
/* Umschalter Chef | Mechaniker im Demo-Band (Entscheid Böhringer 08.11.2026) */
.demo-rollen-schalter { display: inline-flex; border: 1px solid #5b636e; border-radius: 99px; overflow: hidden; }
.demo-rollen-schalter button { background: transparent; color: #e5e7eb; border: 0; border-radius: 0; min-height: 2.25rem; padding: .25rem .9rem; font-size: .9rem; cursor: pointer; }
.demo-rollen-schalter button:hover:not([disabled]) { background: #343b44; }
.demo-rollen-schalter button[aria-pressed="true"] { background: #fff; color: var(--text); font-weight: 600; cursor: default; opacity: 1; }
.demo-starten { width: 100%; min-height: 2.75rem; font-weight: 600; }