/* W3 Strang D: Ergänzungen zu Variante A (stil/basis.css) für die Abläufe beider Marken: Bewerbung, Personalanfrage, Rückruf, Wechsel,
   Schnellbewerbung, Stellenalarm, Kontaktformular, Logins und die kompakten Formulare der Landingpages.
   Nur Klassen mit Präfix w3d- und Zustände in Formularen mit data-w3d-form. Farben nur über die Variablen von basis.css (MediPersonal
   ohne Rot: --akzent ist dort Blau). Keine Inline-Stile, keine fremden Schriften. */

/* Auswahl-Knöpfe: zentral in stil/auswahl.css (Livetest 28.10.2026, gleich breit und hoch je Gruppe, Text mittig) */
[data-w3d-form] .gruppe{border:0;margin:0 0 24px;padding:0;min-width:0}
[data-w3d-form] .gruppe .wahl{margin-bottom:0}
[data-w3d-form] .feld__fehler{margin:2px 0 6px}

/* Livetest 28.10.2026 (Nachtrag 01:00 Punkt 3): jeder Abschnitt und jede Gruppe mit kräftiger, fetter Überschrift in Schwarz, gleiche
   Abstände, klare Trennung der Abschnitte durch eine Linie. Felder mit gleicher Beschriftung wie die Gruppen. */
[data-w3d-form] .formular__abschnitt,[data-w3d-form] h2.formular__abschnitt{margin:36px 0 20px;padding-top:30px;border-top:1px solid var(--linie);font-size:var(--h3);line-height:var(--h2k-z);font-weight:700;color:var(--tinte)}
[data-w3d-form] .w3d-teil>.formular__abschnitt:first-child,[data-w3d-form] .w3d-pflicht-hinweis+.formular__abschnitt,[data-w3d-form] .formular__fehler+.formular__abschnitt{margin-top:12px;padding-top:0;border-top:0}
/* Runde G1: die (meist verborgene) Liste der fehlenden Angaben steht jetzt vor dem ersten Abschnitt; der Abschnitt bleibt ohne Linie oben */
[data-w3d-form] .w3d-teil>.w3d-fehlerliste:first-child+.formular__abschnitt,[data-w3d-form] .w3d-pflicht-hinweis+.w3d-fehlerliste+.formular__abschnitt{margin-top:12px;padding-top:0;border-top:0}
[data-w3d-form] .formular__titel{font-weight:700;color:var(--tinte)}
[data-w3d-form] .gruppe__titel,[data-w3d-form] .gruppe>.feld__label{margin:0 0 12px;font-size:var(--fliess);line-height:22px;font-weight:700;color:var(--tinte)}
[data-w3d-form] .feld>label,[data-w3d-form] .w3d-datei .feld__label,[data-w3d-form] .w3d-datei .feld__label label{font-size:var(--fliess);line-height:22px;font-weight:700;color:var(--tinte)}
[data-w3d-form] .felder{gap:20px;margin:0 0 24px}
[data-w3d-form] .haken strong{color:var(--tinte)}
.w3d-pflicht-hinweis{margin:12px 0 18px;font-size:var(--klein);line-height:20px;color:var(--text2);text-align:right}
.w3d-pflicht-hinweis .pflicht{font-weight:700}
.formular-lead+.w3d-pflicht-hinweis,.formular-h2+.w3d-pflicht-hinweis,.formular__titel+.w3d-pflicht-hinweis{margin:-6px 0 18px}

/* Bewerbung in Teilen auf einer Seite (Punkt 9a): ohne Skript alle Teile sichtbar, die Zwischen-Knöpfe weg */
html:not(.js) .w3d-teil[hidden]{display:block}
html:not(.js) .w3d-teil__fuss--zwischen{display:none}
.formular--teile,.formular--teile [data-w3d-fortschritt]{scroll-margin-top:88px}
.fortschritt__nr .sym{display:none}
.ist-fertig .fortschritt__nr .sym{display:block}
.ist-fertig .fortschritt__zahl{display:none}
.w3d-teil .formular__abschnitt[tabindex]:focus{outline:none}
.w3d-cv{margin:4px 0 8px}
.w3d-cv--zuerst{margin:24px 0 8px}
.w3d-cv-stand{display:flex;gap:10px;align-items:center;margin:0 0 18px;padding:12px 16px;border:1px solid var(--linie);border-radius:var(--radius-feld);background:var(--grau2);font-size:var(--klein);line-height:22px;color:var(--text2)}
.w3d-cv-stand strong{color:var(--tinte);overflow-wrap:anywhere}
.w3d-ausland-haken{margin:0 0 18px}

/* Liste der fehlenden Angaben (Runde G1, Nachtrag 20:50 Punkt 7): oben im Formular bzw. Schritt, erst ab zwei Fehlern sichtbar */
.w3d-fehlerliste{margin:0 0 24px;padding:14px 16px;border:1px solid var(--akzent);border-radius:var(--radius-feld);background:var(--akzent-zart);scroll-margin-top:96px}
.w3d-fehlerliste[hidden]{display:none}
.w3d-fehlerliste__titel{display:flex;gap:8px;align-items:center;font-size:var(--klein);line-height:22px;font-weight:700;color:var(--akzent-text)}
.w3d-fehlerliste__liste{margin:8px 0 0;padding:0 0 0 28px;list-style:none;display:grid;gap:4px}
.w3d-fehlerliste__liste .w3d-link-knopf{padding:2px 0;font-size:var(--klein);line-height:21px;font-weight:400;text-align:left;color:var(--tinte);text-decoration:none}
.w3d-fehlerliste__liste .w3d-link-knopf:hover,.w3d-fehlerliste__liste .w3d-link-knopf:focus-visible{text-decoration:underline}
.w3d-fehlerliste__liste strong{font-weight:700}
/* Runde G1: erledigte Angaben bleiben in der Liste stehen (keine Verschiebung), nur zurückgenommen und durchgestrichen */
.w3d-fehlerliste__liste li.ist-erledigt .w3d-link-knopf{color:var(--text3);text-decoration:line-through}
.w3d-teil__fuss .formular__fuss{margin-top:22px}
/* Probelauf Runde 1: Sendestand (W11), Datei entfernen und Grenzen (W02), langer Dateiname (W09), Tippflächen (W20), feste Leisten (W21) */
.w3d-sende-stand{flex:1 1 100%;order:3;margin:4px 0 0;font-size:var(--klein);line-height:20px;color:var(--text2);text-align:right}
.ist-am-senden [data-w3d-zurueck-teil],.ist-am-senden [data-w3d-zurueck]{opacity:.5;pointer-events:none}
.ist-am-senden button[type=submit]{opacity:.8;cursor:progress}
.w3d-datei-weg{margin:6px 0 0}
.w3d-datei-weg .w3d-link-knopf{font-size:var(--klein)}
.w3d-datei-nochmals{margin-top:6px;color:var(--akzent-text)}
.w3d-grenzen{margin:0 0 16px}
.upload>span:not(.upload__symbol){min-width:0}
.upload__datei,.upload strong,.upload small,.w3d-datei-nochmals,[data-w3d-form] .feld__fehler,.w3d-fehlerliste,.w3d-sendefehler,.w3d-cv-stand,.w3d-mail-tipp,.w3d-danke-mail{overflow-wrap:anywhere}
[data-w3d-form] .haken--klein{min-height:44px;align-items:center}
@media (max-width:700px){html{scroll-padding-top:84px;scroll-padding-bottom:96px}}

/* Telefon und E-Mail (Nachtrag 01:00 Punkt 5): erkannte Nummer unter dem Feld */
.w3d-tel-anzeige{display:flex;gap:8px;align-items:center;margin-top:2px;font-size:var(--klein);line-height:20px;color:var(--text2)}
.w3d-tel-anzeige[hidden]{display:none}
.w3d-tel-anzeige strong{color:var(--tinte);font-weight:700;letter-spacing:.01em}
.w3d-ok{position:relative;flex:none;width:18px;height:18px;border-radius:50%;background:var(--logo-gruen)}
.w3d-ok::after{content:"";position:absolute;left:6px;top:3px;width:5px;height:9px;border:solid #fff;border-width:0 2px 2px 0;transform:rotate(45deg)}
.w3d-mail-tipp{margin-top:2px}

/* Zähler der Möglichkeiten (Punkt 9f, Nachtrag 01:00 Punkt 6): ruhig unter dem Berufsfeld */
.w3d-moeglich{margin:-4px 0 24px;padding:14px 18px;border:1px solid var(--linie);border-radius:var(--radius);background:var(--grau2)}
.w3d-moeglich[hidden]{display:none}
.w3d-moeglich__text{font-size:var(--fliess);line-height:26px;color:var(--text)}
.w3d-moeglich__zahl{font-size:var(--h3);font-weight:700;color:var(--tinte);font-variant-numeric:tabular-nums}
.w3d-moeglich__umkreis{display:grid;grid-template-columns:auto repeat(3,minmax(0,96px));align-items:center;gap:8px;margin-top:12px}
.w3d-moeglich__umkreis[hidden]{display:none}
.w3d-moeglich__etikett{margin-right:4px;font-size:var(--klein);font-weight:700;color:var(--tinte)}
.w3d-moeglich__km{min-height:40px;padding:0 12px;border:1px solid var(--linie2);border-radius:10px;background:#fff;font:inherit;font-size:var(--klein);font-weight:500;color:var(--tinte);cursor:pointer}
.w3d-moeglich__km[aria-pressed=true]{background:var(--zweit);border-color:var(--zweit);color:#fff}
.w3d-moeglich__km:focus-visible{outline:3px solid var(--akzent);outline-offset:2px}
.w3d-moeglich__quelle{margin-top:8px;font-size:var(--klein);line-height:18px;color:var(--text3)}

/* Ihr persönlicher Bereich (Punkt 9g, g2, g4): Haken mit kleinem Bild der Desktop-Fassung, gross im Fenster */
/* Nachtrag des Inhabers 28.10. ca. 06:15: Haken «Zugang aktivieren» mit Satz und feinem Knopf «Vorschau» (Bewerbung, Notfallpool, Personalanfrage) */
.w3d-zugang{display:flex;flex-wrap:wrap;align-items:center;gap:10px 18px;margin:22px 0 14px;padding:16px 20px;border:1px solid var(--linie2);border-radius:var(--radius);background:var(--grau2)}
.w3d-zugang .haken{flex:1 1 300px;min-width:0;margin:0}
.w3d-zugang .haken strong{font-weight:700;color:var(--tinte)}
.w3d-zugang__vorschau{flex:none}
.w3d-zugang .vorschau-knopf{margin:0;min-height:44px;padding:4px 16px}
/* Runde F1 (Nachtrag 11:40): «Ihre früheren und heutigen Arbeitgeber sehen Ihr Profil nicht.» als eigene ruhige Zeile im Kasten */
.w3d-zugang__schutz{flex:1 1 100%;display:flex;gap:8px;align-items:flex-start;margin:0;padding-top:10px;border-top:1px solid var(--linie2);font-size:var(--klein);line-height:22px;font-weight:700;color:var(--tinte)}
.w3d-zugang__schutz .sym{flex:none;margin-top:2px;color:var(--akzent-text)}
/* Runde F1 (Hausregel 12:35, Punkt 11): Erklärsatz zum Pflicht-Lebenslauf direkt unter der Beschriftung */
.w3d-datei__warum{margin:-2px 0 10px;font-size:var(--klein);line-height:20px;color:var(--text2)}
.w3d-danke-mail{margin-bottom:20px}
.w3d-danke-mail strong{overflow-wrap:anywhere}
[data-w3d-form] .ist-fehler input,[data-w3d-form] .ist-fehler select,[data-w3d-form] .ist-fehler textarea,[data-w3d-form] input.ist-fehler{border-color:var(--akzent-text);box-shadow:0 0 0 3px var(--akzent-zart)}
[data-w3d-form] .gruppe.ist-fehler .wahl__punkt span{border-color:var(--akzent-text)}
/* Runde F1 (Punkt 11): Meldung am Datei-Feld («Bitte laden Sie Ihren Lebenslauf hoch …») ganz unter dem Ablagefeld. Die Regel der Auswahl-Gruppen
   (basis.css, margin-top -6px) zog sie unter den Rand des Ablagefelds, das mit position:relative darüber liegt (obere Zeile halb verdeckt).
   Der Rand des Ablagefelds ist markiert wie bei den übrigen Feldern. */
[data-w3d-form] .gruppe.w3d-datei.ist-fehler>.feld__fehler{margin:8px 0 0}
[data-w3d-form] .gruppe.w3d-datei.ist-fehler .upload:not(.hat-datei){border-color:var(--akzent-text);box-shadow:0 0 0 3px var(--akzent-zart)}

/* Runde G1 (Nachträge 16:20, 16:45/16:50, 21:45 Punkte 2 und 8, Massstab 2.5 und 3.5) */
/* Zeugnisse und Diplome bzw. Foto: Pflicht mit Ausweg (Haken «nachreichen» bzw. «später»), Foto-Satz unter dem Ablagefeld */
.w3d-unterlagen{margin:24px 0 32px}
.w3d-unterlagen>.gruppe__titel{margin-bottom:8px}
.w3d-unterlagen__warum{margin:0 0 16px;font-size:var(--klein);line-height:22px;color:var(--text2)}
.w3d-unterlagen .w3d-datei{margin-bottom:16px}
.w3d-unterlagen__spaeter{margin:0}
.w3d-datei__hilfe{margin:8px 0 0;font-size:var(--klein);line-height:20px;color:var(--text2)}
[data-w3d-form] .w3d-unterlagen.ist-fehler .upload:not(.hat-datei){border-color:var(--akzent-text);box-shadow:0 0 0 3px var(--akzent-zart)}
[data-w3d-form] .w3d-unterlagen.ist-fehler>.feld__fehler{margin:8px 0 0}
/* Telefon und Handy, eines Pflicht */
.w3d-tel-paar__hilfe{margin:-8px 0 12px}
[data-w3d-form] .w3d-tel-paar .felder{margin-bottom:0}
[data-w3d-form] .w3d-tel-paar.ist-fehler>.feld__fehler{margin:8px 0 0}
/* Satz am Feld bei Auswahl-Gruppen ganz unter den Knöpfen (basis.css zieht ihn mit -6px in die Knöpfe, weil .wahl hier keinen unteren Abstand hat) */
[data-w3d-form] .gruppe.ist-fehler>.feld__fehler{margin:8px 0 0}
/* Lohnvorstellung: Fehlerzeile direkt am Betrag */
[data-w3d-form] .w3d-lohn .felder{margin-bottom:12px}
/* Absende- und Weiter-Knöpfe 48 px hoch (Massstab 3.5, vorher 56 px) */
[data-w3d-form] .knopf--gross{min-height:48px;padding:0 24px}

/* Berufsfeld mit Vorschlägen (Kategorie zuerst, Alltagsnamen, Fachrichtung bei Ärztinnen und Ärzten) */
.w3d-cb{position:relative}
.w3d-cb .vorschlaege{top:100%;margin-top:6px}
.vorschlaege .w3d-vor__name{font-weight:500;color:var(--tinte)}
.vorschlaege .w3d-vor__zusatz{font-size:var(--klein);color:var(--text3);text-align:right}
.vorschlaege .w3d-vor__kopf{cursor:default;font-size:var(--klein);font-weight:500;color:var(--text3);text-transform:none;padding:8px 12px 4px}
.vorschlaege .w3d-vor__kopf:hover{background:transparent}
.vorschlaege .w3d-vor__zurueck{color:var(--tinte);font-weight:500}
.w3d-pille{display:flex;gap:10px;align-items:center;margin:8px 0 0;padding:10px 14px;border-radius:var(--rund);background:var(--grau2);border:1px solid var(--linie);font-size:var(--klein);line-height:20px}
.w3d-pille a{font-weight:500;color:var(--tinte)}
.w3d-pille .w3d-pille__punkt{width:10px;height:10px;border-radius:50%;background:var(--med-blau,#0A9BD9);flex:none}
.w3d-fach{display:grid;gap:12px;margin-top:12px;padding:14px 16px;border:1px solid var(--linie);border-radius:var(--radius);background:var(--grau2)}
.w3d-fach .feld{margin:0}
.w3d-links{display:flex;flex-wrap:wrap;gap:6px 18px;margin:-6px 0 14px}
.w3d-link-knopf{padding:4px 0;border:0;background:none;font:inherit;font-size:var(--klein);font-weight:500;color:var(--tinte);text-decoration:underline;text-underline-offset:3px;cursor:pointer}
.w3d-link-knopf[aria-pressed=true]{color:var(--akzent-text)}

/* Kantone: «Überall in der Schweiz» oder bestimmte Kantone zum Aufklappen */
.w3d-kantone__mehr{margin:2px 0 6px}
.w3d-kantone__mehr>summary{display:inline-flex;align-items:center;gap:6px;cursor:pointer;font-size:var(--klein);font-weight:500;color:var(--tinte);list-style:none;padding:6px 0}
.w3d-kantone__mehr>summary::-webkit-details-marker{display:none}
.w3d-kantone__mehr[open]>summary .sym{transform:rotate(180deg)}
.w3d-kantone__liste{margin-top:8px}

/* Unterlagen: weitere Dateien zum Aufklappen */
.w3d-datei{margin-bottom:12px}
.upload.hat-datei .upload__datei{display:block}
.w3d-mehr-dateien{margin:4px 0 16px;border:1px solid var(--linie);border-radius:var(--radius);background:#fff}
.w3d-mehr-dateien>summary{display:flex;gap:10px;align-items:center;padding:14px 18px;cursor:pointer;font-weight:500;color:var(--tinte);list-style:none}
.w3d-mehr-dateien>summary::-webkit-details-marker{display:none}
.w3d-mehr-dateien[open]>summary{border-bottom:1px solid var(--linie)}
.w3d-mehr-dateien>.w3d-datei{margin:14px 18px}
.w3d-haken-feld .feld__fehler{margin-left:36px}
.w3d-rav-hilfe{margin:-4px 0 14px}

/* Hinweise und Fehler */
.w3d-sendefehler a,.formular__fehler a{color:inherit;font-weight:500;text-decoration:underline}
.w3d-vorschau-hinweis{margin-bottom:20px}
.w3d-danke-stelle{margin:0 0 20px}
.w3d-quelle{margin-top:14px;font-size:var(--klein);color:var(--text2)}
.w3d-quelle a{color:var(--tinte)}
.w3d-login-live{display:flex;gap:8px;align-items:flex-start;margin-top:14px}
.w3d-login-live a{font-weight:500;color:var(--tinte)}

/* Schritte (Wechsel für Institutionen) */
.w3d-ablauf-4{grid-template-columns:repeat(4,1fr);margin:6px 0 10px}
@media (max-width:900px){.w3d-ablauf-4{grid-template-columns:1fr 1fr}}
@media (max-width:560px){.w3d-ablauf-4{grid-template-columns:1fr}}

/* Kompakte Formulare auf Landingpages: zwei Formulare nebeneinander (Lebenslauf und Stellenalarm) */
.w3d-kompakt .formular h2{margin-top:0}
.w3d-kompakt-zwei{align-items:start}
.w3d-kompakt-zwei .formular{padding:26px 28px 22px}
.w3d-kompakt-zwei .formular__titel{margin:0 0 14px;font-size:var(--h3);line-height:var(--h3-z)}
.w3d-kompakt-zwei .felder{grid-template-columns:1fr}
@media (min-width:1100px){.w3d-kompakt-zwei .felder{grid-template-columns:1fr 1fr}.w3d-kompakt-zwei .feld--breit{grid-column:1/-1}}
.w3d-baustein .formular-raster{grid-template-columns:1fr}

/* Handy */
@media (max-width:700px){
  [data-w3d-form] .formular__abschnitt,[data-w3d-form] h2.formular__abschnitt{margin:28px 0 16px;padding-top:24px}
  .w3d-zugang{padding:14px 16px}
  .w3d-zugang__vorschau{margin-left:36px}
  .w3d-moeglich__umkreis{grid-template-columns:repeat(3,minmax(0,1fr))}
  .w3d-moeglich__etikett{grid-column:1/-1}
  .w3d-moeglich{padding:12px 14px}
  .w3d-pflicht-hinweis{text-align:left}
  [data-w3d-form] .felder{grid-template-columns:1fr}
  [data-w3d-form] .feld--breit{grid-column:auto}
  .w3d-links{gap:4px 14px}
  .w3d-fach{padding:12px}
}
/* Korrektur Tor D-2 (Massstab 0.14 und 3.3, Befund «Fehlerzeile ohne Symbol», iPersonal «Titel der Fehlerliste in Rot»): der Satz am Feld
   mit einem Symbol von 16 px in der Farbe der Meldung; bei iPersonal steht der Titel der Liste in Textfarbe wie die Sätze am Feld */
[data-w3d-form] .feld__fehler:not([hidden])::before{content:"";flex:none;width:16px;height:16px;margin-top:2px;background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Ccircle cx='8' cy='8' r='8' fill='%23055F88'/%3E%3Cpath d='M8 4v5' stroke='%23fff' stroke-width='2' stroke-linecap='round'/%3E%3Ccircle cx='8' cy='12' r='1.2' fill='%23fff'/%3E%3C/svg%3E") no-repeat center/16px 16px}
.marke-ipersonal [data-w3d-form] .feld__fehler:not([hidden])::before{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Ccircle cx='8' cy='8' r='8' fill='%23B0000E'/%3E%3Cpath d='M8 4v5' stroke='%23fff' stroke-width='2' stroke-linecap='round'/%3E%3Ccircle cx='8' cy='12' r='1.2' fill='%23fff'/%3E%3C/svg%3E")}
.marke-ipersonal .w3d-fehlerliste__titel{color:var(--anthrazit)}
.marke-ipersonal .w3d-fehlerliste__titel .sym{color:var(--akzent-text)}
/* Abschluss 30.10.2026 (Punkt 11, EINWILLIGUNG-RECHT.md 2.1): Haken «Ja, ich möchte vermittelt werden» direkt über dem Knopf; fehlt er, ein ruhiger
   Satz am Haken in Textfarbe mit Symbol, kein rotes Fehlerfeld. Hinweis darunter klein mit Link auf die Datenschutzerklärung. */
[data-w3d-form] .w3d-einwilligung{margin:24px 0 0;padding:16px;border:1px solid var(--linie);border-radius:10px;background:var(--grau2,#fafafa)}
[data-w3d-form] .haken--einwilligung{margin:0}
[data-w3d-form] .haken--einwilligung span{font-size:var(--klein);line-height:22px;color:var(--text)}
[data-w3d-form] .haken--einwilligung strong{color:var(--tinte)}
[data-w3d-form] .w3d-einwilligung__hinweis{margin:8px 0 0 36px;font-size:var(--etikett);line-height:18px;color:var(--text2)}
[data-w3d-form] .w3d-einwilligung.ist-fehler{border-color:var(--linie2);box-shadow:none}
[data-w3d-form] .w3d-einwilligung.ist-fehler input,[data-w3d-form] .w3d-einwilligung input.ist-fehler{border-color:var(--linie2);box-shadow:none}
[data-w3d-form] .w3d-einwilligung .feld__fehler{color:var(--tinte);font-weight:500}
@media (max-width:700px){ [data-w3d-form] .w3d-einwilligung__hinweis{margin-left:0} }

