/* Clean & Service application v2. Shared by native PHP page and dialog. */
body #detail.compact-form-dialog.cs-contained-dialog:has(#applyform){width:min(1120px,calc(100% - 16px));}
body #detail:has(#applyform)>.cs-dialog-body{padding:22px 26px 24px;}
body #detail:has(#applyform) #dialogbody,body main.cs-native-application{container-type:inline-size;}
body main.cs-native-application{max-width:1120px;}
:is(#detail,main) #applyform.cs-application{display:block;gap:0;padding:0;margin:0;font:500 16px/1.5 Quicksand,Arial,sans-serif;color:#293239;}
:is(#detail,main) #applyform.cs-application *,:is(#detail,main) #applyform.cs-application *::before,:is(#detail,main) #applyform.cs-application *::after{box-sizing:border-box;}
:is(#detail,main) #applyform.cs-application>*,:is(#detail,main) #applyform.cs-application label,:is(#detail,main) #applyform.cs-application fieldset,:is(#detail,main) #applyform.cs-application p{min-width:0;margin:0;}
:is(#detail,main) #applyform.cs-application input,:is(#detail,main) #applyform.cs-application select,:is(#detail,main) #applyform.cs-application textarea,:is(#detail,main) #applyform.cs-application button{font:inherit;letter-spacing:normal;box-shadow:none;}
:is(#detail,main) #applyform.cs-application p{font-size:14px;line-height:1.5;color:#586974;}
:is(#detail,main) #applyform.cs-application label{font-weight:500;}
:is(#detail,main) #applyform.cs-application .section-title{letter-spacing:normal;max-width:none;}
:is(#detail,main) #applyform.cs-application .selection legend{width:auto;float:none;line-height:1.5;}
:is(#detail,main) #applyform.cs-application .choice{font-weight:500;flex:0 0 auto;width:auto;}
:is(#detail,main) #applyform.cs-application .choice input{display:inline-block;min-height:18px;padding:0;border-radius:0;}
:is(#detail,main) #applyform.cs-application .send-button{display:inline-flex;align-items:center;justify-content:center;width:auto;max-width:none;}
:is(#detail,main) #applyform.cs-application .send-success,:is(#detail,main) #applyform.cs-application [data-native-fallback]{grid-column:1/-1;}
:is(#detail,main) #applyform.cs-application .trap,:is(#detail,main) #applyform.cs-application [hidden]{display:none!important;}
:is(#detail,main) #applyform.cs-application .cs-field-error,:is(#detail,main) #applyform.cs-application .error,:is(#detail,main) #applyform.cs-application [data-group-error]{color:#a22525;font-size:13px;line-height:1.4;}
:is(#detail,main) #applyform.cs-application .choice:has(.cs-field-error:not([hidden])){flex-wrap:wrap;}
:is(#detail,main) #applyform.cs-application .choice .cs-field-error{flex-basis:100%;}
@supports selector(:has(*)){:is(#detail,main) #applyform.cs-application:not(:has(select[name="start"] option[value="Ab einem Datum"]:checked)) .cs-app-start-date{display:none;}}
@media(max-width:600px){body #detail:has(#applyform)>.cs-dialog-body{padding:16px;}}
:is(#detail,main) #applyform.cs-application .intro{display:flex;justify-content:space-between;gap:14px;align-items:start;margin-bottom:18px}
:is(#detail,main) #applyform.cs-application .intro p{margin:3px 0;font-size:14px;color:#586974}
:is(#detail,main) #applyform.cs-application .intro strong{font:500 20px/1.3 Ubuntu,Arial,sans-serif;color:#293239}
:is(#detail,main) #applyform.cs-application .intro .required-note{white-space:nowrap;font-size:12px;margin-top:6px}
:is(#detail,main) #applyform.cs-application .section-title{display:flex;align-items:center;gap:9px;margin:18px 0 10px;font:500 17px/1.3 Ubuntu,Arial,sans-serif;color:#293239}
:is(#detail,main) #applyform.cs-application .section-title:first-of-type{margin-top:0}
:is(#detail,main) #applyform.cs-application .section-title span{color:#0075a8;font:inherit}
:is(#detail,main) #applyform.cs-application .contact-grid{display:grid;grid-template-columns:1fr 1fr 1fr;gap:10px 14px}
:is(#detail,main) #applyform.cs-application .field{display:flex;min-width:0;flex-direction:column;gap:5px;font-size:14px;font-weight:600}
:is(#detail,main) #applyform.cs-application .optional{font-size:12px;font-weight:500;color:#60717a}
:is(#detail,main) #applyform.cs-application .field input,:is(#detail,main) #applyform.cs-application .field select,:is(#detail,main) #applyform.cs-application .field textarea{width:100%;min-width:0;border:1px solid #91a6b1;border-radius:4px;background:#fff;color:#293239;padding:9px 11px;font-size:16px;min-height:43px}
:is(#detail,main) #applyform.cs-application .field textarea{resize:vertical;min-height:82px}
:is(#detail,main) #applyform.cs-application .field select{padding-right:28px}
:is(#detail,main) #applyform.cs-application input[type=checkbox],:is(#detail,main) #applyform.cs-application input[type=radio]{accent-color:#0075a8;width:18px;height:18px;flex:0 0 18px;margin:0}
:is(#detail,main) #applyform.cs-application .selection{border:0;padding:0;margin:0;min-width:0}
:is(#detail,main) #applyform.cs-application .selection legend{font-size:14px;font-weight:600;padding:0;margin-bottom:7px}
:is(#detail,main) #applyform.cs-application .choices{display:flex;flex-wrap:wrap;gap:4px 24px}
:is(#detail,main) #applyform.cs-application .choice{display:flex;align-items:center;gap:7px;padding:7px 0;border:0;background:transparent;border-radius:0;font-size:14px;line-height:1.3;min-height:38px;cursor:pointer}
:is(#detail,main) #applyform.cs-application .choice:has(input:checked){color:#005e86}
:is(#detail,main) #applyform.cs-application .availability{display:grid;gap:14px;padding:15px 16px;background:#f2f7f9;border:1px solid #e0e9ed;border-radius:6px}
:is(#detail,main) #applyform.cs-application .availability .choice{background:transparent}
:is(#detail,main) #applyform.cs-application .availability-note{font-size:12px;color:#60717a;font-weight:500;margin-left:6px}
:is(#detail,main) #applyform.cs-application .job-grid{display:grid;grid-template-columns:1fr 1fr;gap:14px;margin-top:14px;align-items:start}
:is(#detail,main) #applyform.cs-application .driver{padding-top:1px}
:is(#detail,main) #applyform.cs-application .driver .choice{min-width:0}
:is(#detail,main) #applyform.cs-application .driver .hint{font-size:12px;color:#60717a;margin:7px 0 0}
:is(#detail,main) #applyform.cs-application .start-grid{display:grid;gap:8px}
:is(#detail,main) #applyform.cs-application .experience-grid{display:grid;grid-template-columns:1fr 2fr;gap:14px;align-items:start;margin-top:14px}
:is(#detail,main) #applyform.cs-application .experience-grid .choice{padding:7px 0}
:is(#detail,main) #applyform.cs-application .message-file-grid{display:grid;grid-template-columns:1.2fr 1fr;gap:16px}
:is(#detail,main) #applyform.cs-application .upload-box{padding:12px;border:1px dashed #92adbb;border-radius:5px;background:#f7fafb}
:is(#detail,main) #applyform.cs-application .upload-box input[type=file]{border:0;padding:4px 0;font-size:13px;min-height:30px}
:is(#detail,main) #applyform.cs-application .upload-box small{font-size:12px;font-weight:500;color:#60717a}
:is(#detail,main) #applyform.cs-application .privacy-row{display:flex;align-items:flex-start;gap:10px;font-size:13px;line-height:1.55;margin:18px 0 14px}
:is(#detail,main) #applyform.cs-application .privacy-row input{margin-top:2px!important}
:is(#detail,main) #applyform.cs-application .privacy-row a{color:#006c99;text-underline-offset:3px}
:is(#detail,main) #applyform.cs-application .form-footer{display:flex;align-items:center;justify-content:space-between;gap:16px;border-top:1px solid #e1e9ed;padding-top:14px}
:is(#detail,main) #applyform.cs-application .form-footer p{font-size:12px;color:#60717a;margin:0;max-width:400px}
:is(#detail,main) #applyform.cs-application .send-button{border:0;border-left:4px solid #72be00;border-radius:3px;background:#0075a8;color:white;padding:12px 22px;font:500 16px/1.3 Ubuntu,Arial,sans-serif;min-height:45px;white-space:nowrap}
:is(#detail,main) #applyform.cs-application .form-status{font-size:14px;color:#005e86;margin:12px 0 0}
:is(#detail,main) #applyform.cs-application .selection-error{color:#a22525;font-size:13px;margin:5px 0 0}
:is(#detail,main) #applyform.cs-application [hidden]{display:none!important}
:is(#detail,main) #applyform.cs-application :focus-visible{outline:3px solid #006e9e;outline-offset:3px}
@container (min-width:900px){:is(#detail,main) #applyform.cs-application{display:grid;grid-template-columns:minmax(300px,2fr) minmax(0,3fr);column-gap:28px;align-items:start;grid-template-areas:"intro intro" "contact-title preferences-title" "contacts availability" "job job" "experience experience" "message-title message-title" "message message" "privacy privacy" "footer footer" "status status";}
:is(#detail,main) #applyform.cs-application>.intro{grid-area:intro;}
:is(#detail,main) #applyform.cs-application>.section-title:nth-of-type(1){grid-area:contact-title;margin-top:0;}
:is(#detail,main) #applyform.cs-application>.section-title:nth-of-type(2){grid-area:preferences-title;margin-top:0;}
:is(#detail,main) #applyform.cs-application>.contact-grid{grid-area:contacts;grid-template-columns:minmax(0,1fr) minmax(0,1fr);row-gap:12px;}
:is(#detail,main) #applyform.cs-application .contact-grid input[name=postal_code]{width:96px;max-width:100%;font-variant-numeric:tabular-nums;}
:is(#detail,main) #applyform.cs-application .contact-grid input[name=city]{max-width:220px;}
:is(#detail,main) #applyform.cs-application>.availability{grid-area:availability;gap:10px;padding:14px 16px;}
:is(#detail,main) #applyform.cs-application .availability .choices{column-gap:14px;}
:is(#detail,main) #applyform.cs-application>.job-grid{grid-area:job;grid-template-columns:minmax(300px,2fr) minmax(0,3fr);column-gap:28px;margin-top:18px;}
:is(#detail,main) #applyform.cs-application .start-grid{grid-template-columns:minmax(0,260px) minmax(0,200px);gap:14px;}
:is(#detail,main) #applyform.cs-application>.experience-grid{grid-area:experience;grid-template-columns:260px minmax(0,1fr);column-gap:24px;}
:is(#detail,main) #applyform.cs-application>.section-title:nth-of-type(3){grid-area:message-title;}
:is(#detail,main) #applyform.cs-application>.message-file-grid{grid-area:message;}
:is(#detail,main) #applyform.cs-application>.privacy-row{grid-area:privacy;}
:is(#detail,main) #applyform.cs-application>.form-footer{grid-area:footer;}
:is(#detail,main) #applyform.cs-application>.form-status{grid-area:status;}}
@container (max-width:740px){:is(#detail,main) #applyform.cs-application .contact-grid{grid-template-columns:1fr 1fr}
:is(#detail,main) #applyform.cs-application .experience-grid{grid-template-columns:1fr}
:is(#detail,main) #applyform.cs-application .intro{display:block}
:is(#detail,main) #applyform.cs-application .intro .required-note{white-space:normal;margin-top:8px}
:is(#detail,main) #applyform.cs-application .message-file-grid{grid-template-columns:1fr}
:is(#detail,main) #applyform.cs-application .form-footer p{max-width:280px}}
@container (max-width:470px){:is(#detail,main) #applyform.cs-application .contact-grid,:is(#detail,main) #applyform.cs-application .job-grid{grid-template-columns:1fr}
:is(#detail,main) #applyform.cs-application .availability{padding:12px}
:is(#detail,main) #applyform.cs-application .availability-note{display:block;margin-left:0;margin-top:2px}
:is(#detail,main) #applyform.cs-application .choice{min-height:44px}
:is(#detail,main) #applyform.cs-application .form-footer{flex-direction:column;align-items:stretch}
:is(#detail,main) #applyform.cs-application .form-footer .send-button{width:100%}
:is(#detail,main) #applyform.cs-application .form-footer p{max-width:none}
:is(#detail,main) #applyform.cs-application .intro strong{font-size:19px}
:is(#detail,main) #applyform.cs-application .privacy-row{font-size:13px}
:is(#detail,main) #applyform.cs-application .experience-grid .choices{gap:4px 20px}}
:is(#detail,main) #applyform.cs-application input[type=checkbox],:is(#detail,main) #applyform.cs-application input[type=radio]{min-height:18px!important;width:18px!important;padding:0!important;}

/* Validation messages must not split radio or privacy labels. */
:is(#detail,main) #applyform.cs-application .driver .choice{flex-wrap:nowrap;}
:is(#detail,main) #applyform.cs-application .privacy-row{flex-wrap:wrap;}
:is(#detail,main) #applyform.cs-application .privacy-row>span:not(.cs-field-error){flex:1;min-width:0;}
:is(#detail,main) #applyform.cs-application .privacy-row>.cs-privacy-error{flex:0 0 100%;margin-top:0;}

/* Keep the driving-licence message beside Nein, within the same choices row. */
:is(#detail,main) #applyform.cs-application .driver .choices{display:flex;flex-wrap:nowrap;align-items:center;column-gap:12px;}
:is(#detail,main) #applyform.cs-application .driver .choices>[data-radio-error],
:is(#detail,main) #applyform.cs-application .driver .choices>.error{flex:0 1 auto;min-width:0;margin:0;padding:0;font-size:13px;line-height:1.4;}
