/*
 * Powermail-Formulare (Markup der twt_powermail-Templates) im zweispaltigen Layout fuer eva, enewa und wag.
 * Wird vor dem Mandanten-CSS eingebunden. Die Mandanten setzen die Variablen
 * --twt-powermail-label-width, --twt-powermail-field-width und --twt-powermail-error-color auf .tx-powermail,
 * den Mobil-Umbruch und eigene Abweichungen in ihrem CSS.
 */
.tx-powermail .l-d-none {
    display: none;
}
.tx-powermail .powermail_fieldwrap {
    clear: both;
    overflow: hidden;
    min-width: 0;
    margin: 0 0 7px;
    padding: 0;
    border: 0;
}
.tx-powermail .powermail_fieldwrap > .powermail_label {
    display: block;
    float: left;
    width: var(--twt-powermail-label-width, 25%);
    padding: 5px 0 0;
    font-size: 1rem;
    line-height: 1.25em;
    -webkit-hyphens: auto;
    hyphens: auto;
}
.tx-powermail .powermail_fieldwrap > .powermail_field {
    float: right;
    width: var(--twt-powermail-field-width, 72%);
}
.tx-powermail .powermail_fieldwrap_type_html > .powermail_field,
.tx-powermail .powermail_fieldwrap_type_text > .powermail_field,
.tx-powermail .powermail_fieldwrap_type_submit > .powermail_field {
    float: none;
    width: auto;
}
.tx-powermail .powermail_field input:not([type=radio]):not([type=checkbox]):not([type=submit]),
.tx-powermail .powermail_field select,
.tx-powermail .powermail_field textarea {
    width: 100%;
    box-sizing: border-box;
}
.tx-powermail .powermail_field label {
    float: none;
    width: auto;
    padding: 0;
}
.tx-powermail .powermail_fieldwrap_type_radio > .powermail_field {
    display: flex;
    flex-wrap: wrap;
}
.tx-powermail .powermail_fieldwrap_type_radio.radio-vertical > .powermail_field {
    display: block;
}
.tx-powermail .powermail_field .radio,
.tx-powermail .powermail_field .checkbox {
    display: flex;
    align-items: flex-start;
    margin: 5px 14px 0 0;
}
.tx-powermail .powermail_field .radio input,
.tx-powermail .powermail_field .checkbox input {
    flex: none;
    margin: 2px 5px 0 0;
}
.tx-powermail .powermail_field .checkbox > label {
    position: relative;
    padding-left: 20px;
}
.tx-powermail .powermail_field .checkbox > label > input {
    position: absolute;
    top: 0;
    left: 0;
}
.tx-powermail .powermail_field .checkbox p {
    display: inline;
    margin: 0;
}
.tx-powermail .powermail_field .powermail_field_error_container {
    flex-basis: 100%;
}
.tx-powermail .powermail_fieldwrap_type_submit > .powermail_field {
    text-align: right;
}
.tx-powermail .parsley-errors-list {
    margin: .25rem 0 0;
}
.tx-powermail .parsley-errors-list li {
    background: none;
    padding-left: 0;
    font-size: 1rem;
    color: var(--twt-powermail-error-color, #cc0000);
}
.tx-powermail .powermail_field:has(.parsley-errors-list.filled) input:not([type=radio]):not([type=checkbox]),
.tx-powermail .powermail_field:has(.parsley-errors-list.filled) textarea,
.tx-powermail .powermail_field:has(.parsley-errors-list.filled) select {
    border: 1px solid var(--twt-powermail-error-color, #cc0000);
}
.tx-powermail .powermail_field:has(.parsley-errors-list.filled) .radio input,
.tx-powermail .powermail_field:has(.parsley-errors-list.filled) .checkbox input {
    outline: 1px solid var(--twt-powermail-error-color, #cc0000);
    outline-offset: 1px;
}