
.srf{--srf-accent:var(--srf-accent-color,#185FA5);--srf-radius:10px;font:inherit;width:100%;min-width:0;max-width:100%;box-sizing:border-box;container-type:inline-size}
/* 1.58.18 (Alex 30.08., kibopal Handy): keine erzwungene Mindestbreite mehr — im Divi-Popup wird stattdessen der Popup-Wrapper auf Mobil fullwidth, damit das Formular nie rechts abgeschnitten wird */
.dipi-popup-wrapper .srf,.dipi_popup .srf{min-width:0!important;width:100%!important;max-width:100%!important}
.dipi_popup .et_pb_section:has(form.srf),.dipi_popup .et_pb_row:has(form.srf),.dipi_popup .et_pb_column:has(form.srf),.dipi_popup .et_pb_code:has(form.srf),.dipi_popup .et_pb_code_inner:has(form.srf){width:100%!important;max-width:100%!important;min-width:0!important;box-sizing:border-box}
/* 1.58.30 (Alex 31.08., DESKTOP-Bug „leeres Popup"): DiviPixels-Popup-Wrapper ist flex align-items:center → die AEUSSEREN Divi-Wrapper (#et-boc/.et-l) werden NICHT auf volle Breite gestreckt, dadurch kollabiert die ganze Form auf Breite 0 (unsichtbar). Wrapper auf stretch + aeussere Wrapper voll. */
.dipi-popup-wrapper:has(form.srf){align-items:stretch!important}
/* 1.58.33 (Alex 31.08., kibopal „X ist eine Ellipse mittig oben"): der Schliessen-Button ist DIREKTES Kind des Wrappers und bekam durch >* ebenfalls width:100% → 1152px breit + border-radius:50% = Ellipse. Buttons/Close ausnehmen. */
.dipi_popup:has(form.srf) #et-boc,.dipi_popup:has(form.srf) .et-l,.dipi-popup-wrapper:has(form.srf)>*:not(.dipi_popup-close):not(button){width:100%!important;max-width:100%!important;min-width:0!important;box-sizing:border-box}
/* 1.58.35 (Alex 31.08., kibopal: im Popup links und rechts 0 Abstand): Der WEISSE Kasten ist die Divi-Sektion (padding 26px 0), Row/Column stehen per srf-css auf 100% -> Felder klebten an der weissen Kante. Der 34px-Wrapper-Abstand liegt AUSSERHALB des weissen Kastens (transparent) und half optisch nicht. */
.dipi_popup .et_pb_section:has(form.srf){padding:26px 30px!important;box-sizing:border-box!important}
@media(max-width:767px){.dipi_popup .et_pb_section:has(form.srf){padding:20px 16px!important}}
/* 1.58.30: Innenabstand, damit die Form nicht am Popup-Rand klebt (Alex: „zu nah am Rand links/rechts/oben/unten") */
.dipi_popup:has(form.srf) .dipi-popup-wrapper{padding:30px 34px!important;box-sizing:border-box!important}
@media(max-width:767px){
.dipi_popup:has(form.srf) .dipi-popup-wrapper{padding:18px 14px!important}.dipi_popup:has(form.srf) .dipi-popup-wrapper,.dipi_popup:has(form.srf) .dipi-popup-container,.dipi_popup:has(form.srf) .dipi_popup-content{width:100%!important;max-width:100%!important;min-width:0!important;margin-left:0!important;margin-right:0!important;left:0!important;right:0!important;box-sizing:border-box}
.dipi_popup:has(form.srf) .et_pb_section{padding-left:14px!important;padding-right:14px!important}.dipi_popup:has(form.srf) .et_pb_row{width:100%!important;max-width:100%!important;padding-left:0!important;padding-right:0!important}
.dipi_popup:has(form.srf){overflow-x:hidden}.srf-grid{grid-template-columns:1fr!important}.srf-field.srf-half{grid-column:1/-1!important}}
.dipi-popup-wrapper>.et_pb_section:has(form.srf){width:100%;box-sizing:border-box}
.srf-grid{display:grid;grid-template-columns:1fr 1fr;gap:14px 16px}
.srf-field{grid-column:1/-1;min-width:0}.srf-field.srf-half{grid-column:auto}
@media(max-width:640px){.srf-grid{gap:12px 10px}}
@container(max-width:520px){.srf-options-grid{grid-template-columns:1fr}.srf-grid{grid-template-columns:1fr}.srf-field.srf-half{grid-column:1/-1}}/* 1.58.17: halbe Felder untereinander, sobald das Formular schmal ist (Handy, schmale Spalten) */
.srf-options-grid{display:grid;grid-template-columns:1fr 1fr;gap:8px 16px}
.srf-field[hidden]{display:none!important}
.srf-label{display:block;font-weight:600;font-size:.95em;margin:0 0 6px}.srf-req{color:#B91C1C}
.srf input[type=text],.srf input[type=email],.srf input[type=tel],.srf input[type=date],.srf select,.srf textarea{width:100%;box-sizing:border-box;border:1px solid rgba(0,0,0,.18);border-radius:var(--srf-radius);padding:12px 14px;font:inherit;font-size:1em;background:#fff;color:inherit;transition:border-color .15s,box-shadow .15s}
.srf input:focus,.srf select:focus,.srf textarea:focus{outline:none;border-color:var(--srf-accent);box-shadow:0 0 0 3px color-mix(in srgb,var(--srf-accent) 18%,transparent)}
.srf .is-invalid{border-color:#B91C1C!important}
.srf-field.has-error .srf-label,.srf-field.has-error > .srf-opt.srf-gdpr,.srf-field.has-error > .srf-opt.srf-gdpr span{color:#B91C1C}
.srf-field.has-error .srf-opt.srf-gdpr{padding:10px 12px;margin:0 -12px;border:1px solid #B91C1C;border-radius:var(--srf-radius);background:#FDE8E8}
.srf-field.has-error input[type=checkbox],.srf-field.has-error input[type=radio]{outline:2px solid #B91C1C;outline-offset:2px;accent-color:#B91C1C}
.srf-field.has-error .srf-file{border-color:#B91C1C;border-style:solid;background:#FDE8E8}
.srf-field.has-error .srf-chips-list{outline:1px solid #B91C1C;outline-offset:6px;border-radius:12px}
.srf-field.has-error .srf-cc,.srf-field.has-error .srf-phone input,.srf-field.has-error .srf-date input,.srf-field.has-error select,.srf-field.has-error textarea{border-color:#B91C1C!important}
.srf-field.has-error .srf-options{padding:8px 10px;border:1px solid #B91C1C;border-radius:var(--srf-radius);background:#FDE8E8}
.srf-options{display:flex;flex-direction:column;gap:8px}.srf-opt{display:flex;gap:10px;align-items:flex-start;cursor:pointer;font-weight:400;line-height:1.5}.srf-opt input{margin-top:.3em;flex:0 0 auto}
.srf-gdpr span a{text-decoration:underline}
.srf-phone{position:relative;display:flex;align-items:stretch;min-width:0}.srf-phone input[type=tel]{border-top-left-radius:0!important;border-bottom-left-radius:0!important;flex:1;min-width:0}
.srf-cc{display:flex;align-items:center;gap:7px;padding:0 10px 0 12px;border:1px solid rgba(0,0,0,.18);border-right:0;border-radius:var(--srf-radius) 0 0 var(--srf-radius);background:#f7f7f5;cursor:pointer;font:inherit;font-size:.95em;color:#333;white-space:nowrap}.srf-cc:hover{background:#eff3f8}.srf-cc .ar{font-size:10px;color:#777}
.srf-flag{width:20px;height:14px;border-radius:2px;box-shadow:0 0 0 1px rgba(0,0,0,.12);object-fit:cover;flex:0 0 auto}
.srf-cc-dd{position:absolute;left:0;top:calc(100% + 4px);width:340px;max-width:calc(100vw - 24px);background:#fff;border:1px solid rgba(0,0,0,.15);border-radius:10px;box-shadow:0 12px 30px rgba(0,0,0,.16);z-index:40;padding:6px;color:#1a1a1a}
.srf-cc-q{width:100%!important;box-sizing:border-box;height:36px;border:1px solid rgba(0,0,0,.15)!important;border-radius:8px!important;padding:0 10px!important;font:inherit;font-size:.95em!important;margin-bottom:4px}.srf-cc-list{max-height:230px;overflow:auto}
.srf-cc-item{display:flex;align-items:center;gap:9px;width:100%;border:0;background:none;padding:8px 8px;border-radius:8px;cursor:pointer;font:inherit;font-size:.95em;text-align:left;color:inherit}.srf-cc-item:hover,.srf-cc-item.is-act{background:#eef5fc}.srf-cc-item .px{margin-left:auto;color:#6b6b6b;font-variant-numeric:tabular-nums}
.srf-date{position:relative}.srf-date.srf-date-js input{padding-right:40px;cursor:pointer}.srf-date-btn{position:absolute;right:6px;top:50%;transform:translateY(-50%);width:32px;height:32px;border:0;background:transparent;cursor:pointer;font-size:18px;line-height:1;color:#555}
.srf-cal{position:absolute;left:0;top:calc(100% + 4px);width:300px;max-width:100%;background:#fff;border:1px solid rgba(0,0,0,.15);border-radius:12px;box-shadow:0 12px 30px rgba(0,0,0,.16);z-index:40;padding:10px;color:#1a1a1a;font-size:.95em}
.srf-cal-h{display:flex;align-items:center;justify-content:space-between;margin-bottom:8px;font-weight:600}.srf-cal-h button{border:1px solid rgba(0,0,0,.12);background:#fff;border-radius:8px;width:32px;height:32px;cursor:pointer;font-size:14px}
.srf-cal-g{display:grid;grid-template-columns:repeat(7,1fr);gap:2px;text-align:center}.srf-cal-g .wd{font-size:.8em;color:#777;padding:4px 0}.srf-cal-g button{border:0;background:transparent;border-radius:8px;height:36px;cursor:pointer;font:inherit}.srf-cal-g button:hover{background:#eef5fc}.srf-cal-g button.o{color:#aaa}.srf-cal-g button.t{box-shadow:inset 0 0 0 1px var(--srf-accent)}.srf-cal-g button.s{background:var(--srf-accent);color:#fff}.srf-cal-g button:disabled{color:#ccc;cursor:default;background:transparent}
.srf-cal-f{display:flex;justify-content:space-between;margin-top:8px}.srf-cal-f button{border:0;background:transparent;color:var(--srf-accent);cursor:pointer;font:inherit;font-size:.9em;padding:4px 6px}
@media(max-width:640px){.srf-cc{padding:0 8px 0 9px;gap:5px}.srf-cc-dd,.srf-cal{position:fixed;left:12px;right:12px;top:auto;bottom:calc(12px + env(safe-area-inset-bottom,0px));width:auto;max-width:none;max-height:60vh;overflow:auto;box-shadow:0 -10px 40px rgba(15,23,42,.3)}.srf-cc-list{max-height:none}.srf-cc-item{min-height:44px}}
.srf-chips{display:block}.srf-chips-list{display:flex;flex-wrap:wrap;gap:8px}
.srf-chip{position:relative;display:inline-flex;align-items:center;gap:7px;padding:8px 12px;border:1px solid rgba(0,0,0,.18);border-radius:999px;background:#fff;cursor:pointer;font-weight:500;font-size:.95em;line-height:1.2;user-select:none;transition:border-color .15s,background .15s,box-shadow .15s;max-width:100%}
.srf-chip input{position:absolute;opacity:0;width:1px;height:1px;margin:0;pointer-events:none}
.srf-chip-ic{font-size:1.1em;line-height:1;display:inline-flex;align-items:center}.srf-chip-t{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.srf-chip-ok{display:none;font-size:.85em;font-weight:700}
.srf-chip:hover{border-color:var(--srf-accent)}
.srf-chip:has(input:checked){background:color-mix(in srgb,var(--srf-accent) 12%,#fff);border-color:var(--srf-accent);color:var(--srf-accent)}
.srf-chip:has(input:checked) .srf-chip-ok{display:inline}
.srf-chip:has(input:focus-visible){box-shadow:0 0 0 3px color-mix(in srgb,var(--srf-accent) 25%,transparent)}
.srf-chip.is-on{background:color-mix(in srgb,var(--srf-accent) 12%,#fff);border-color:var(--srf-accent);color:var(--srf-accent)}.srf-chip.is-on .srf-chip-ok{display:inline}
.srf-chips-search{margin:0 0 10px}.srf-chips-search input[type=search]{width:100%;box-sizing:border-box;border:1px solid rgba(0,0,0,.18);border-radius:var(--srf-radius);padding:10px 14px;font:inherit;font-size:1em;background:#fff}
.srf-chips-search input[type=search]:focus{outline:none;border-color:var(--srf-accent);box-shadow:0 0 0 3px color-mix(in srgb,var(--srf-accent) 18%,transparent)}
.srf-chip[hidden]{display:none}.srf-chips-empty{font-size:.9em;color:#666;padding:6px 2px}
.srf-chips-count{font-weight:500;font-size:.85em;color:var(--srf-accent);margin-left:6px}.srf-chips-count:empty{display:none}
.srf .srf-field.is-invalid-group .srf-chips-list{outline:1px solid #B91C1C;outline-offset:6px;border-radius:12px}
.srf[dir=rtl] .srf-chips-count{margin:0 6px 0 0}
.srf-file{position:relative;display:flex;align-items:center;gap:12px;border:1px dashed rgba(0,0,0,.25);border-radius:var(--srf-radius);padding:12px 14px;background:#fafafa}
.srf-file input[type=file]{position:absolute;inset:0;opacity:0;width:100%;height:100%;cursor:pointer}
.srf-file-btn{background:var(--srf-accent);color:#fff;border-radius:8px;padding:8px 12px;font-size:.9em;white-space:nowrap}.srf-file-name{font-size:.9em;color:#555;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.srf-help{font-size:.82em;color:#666;margin-top:5px}
.srf-error{color:#B91C1C;font-size:.85em;margin-top:5px}.srf-error-top{margin:12px 0 0;padding:10px 12px;background:#FDE8E8;border-radius:8px;font-size:.92em}
.srf-hp{position:absolute;left:-9999px;top:-9999px;height:0;overflow:hidden}
.srf-actions{margin-top:18px}
.srf-submit{display:inline-flex;align-items:center;gap:10px;background:var(--srf-accent);color:#fff;border:0;border-radius:var(--srf-radius);padding:14px 24px;font:inherit;font-weight:600;font-size:1em;cursor:pointer;transition:filter .15s}
.srf-submit:hover{filter:brightness(.92)}.srf-submit[disabled]{opacity:.7;cursor:default}
.srf-spinner{display:none;width:16px;height:16px;border:2px solid rgba(255,255,255,.5);border-top-color:#fff;border-radius:50%;animation:srf-spin .8s linear infinite}.srf.is-sending .srf-spinner{display:inline-block}
@keyframes srf-spin{to{transform:rotate(360deg)}}
.srf-thanks{padding:18px 20px;background:#E6F4F1;border-radius:var(--srf-radius);color:#0F6E56;font-size:1.05em}
.srf[dir=rtl]{text-align:right}.srf[dir=rtl] .srf-opt{flex-direction:row-reverse;text-align:right}
.srf-missing{padding:12px;background:#FFF4E5;color:#B26A00;border-radius:8px;font-size:.9em}
