/************************************************/
/* Powermail - THETA Design / Clean Compact      */
/* Formular ohne eigene Überschrift              */
/* Oberer Erklärungsteil bitte als HTML-Element   */
/************************************************/

:root{
    --powermail-bg:var(--theta-bg-card);
    --powermail-border:#244b68;
    --powermail-radius:9px;
    --powermail-gap-y:12px;
    --powermail-gap-x:20px;
}

/* ==============================================
   Grundcontainer
============================================== */

.tx-powermail{
    max-width:1120px;
    width:100%;
    margin:32px auto 0 auto;
    padding:0;

    background:transparent;
    border:none;
    border-radius:0;

    color:var(--theta-text);
    box-sizing:border-box;
    box-shadow:none;
}

/* ==============================================
   Powermail-Überschriften ausblenden
============================================== */

.tx-powermail .powermail_fieldset,
.powermail_fieldset{
    margin:0;
    padding:0;
    border:none;
    background:transparent;
}

.tx-powermail .powermail_legend,
.tx-powermail legend,
.powermail_legend,
.tx-powermail .powermail_form h3,
.tx-powermail h3,
.powermail_form h3{
    display:none !important;
}

/* ==============================================
   Layout
============================================== */

.tx-powermail .row{
    display:flex;
    flex-wrap:wrap;
    gap:var(--powermail-gap-y) var(--powermail-gap-x);
    margin:0 0 var(--powermail-gap-y) 0 !important;
}

.tx-powermail [class*="col-"],
.tx-powermail .col,
.tx-powermail .col-md-6,
.tx-powermail .col-md-12{
    padding:0;
    box-sizing:border-box;
}

.tx-powermail .col-md-6{
    flex:0 0 calc(50% - 10px);
    max-width:calc(50% - 10px);
    width:calc(50% - 10px);
}

.tx-powermail .col-md-12,
.tx-powermail .powermail_fieldwrap_betreff,
.tx-powermail .powermail_fieldwrap_marker,
.tx-powermail .powermail_fieldwrap_type_textarea,
.tx-powermail .powermail_fieldwrap_type_check,
.tx-powermail .powermail_fieldwrap_type_radio,
.tx-powermail .powermail_fieldwrap_type_submit,
.tx-powermail .powermail_fieldwrap_type_captcha,
.tx-powermail .powermail_fieldwrap_captcha,
.tx-powermail .powermail_fieldwrap_captcha_default,
.tx-powermail .powermail_fieldwrap_token{
    flex:0 0 100% !important;
    max-width:100% !important;
    width:100% !important;
}

.tx-powermail .powermail_fieldwrap{
    margin:0 !important;
    padding:0;
    background:transparent;
    border:none;
    box-sizing:border-box;
}

.tx-powermail .powermail_fieldwrap_inner,
.tx-powermail .powermail_field_inner{
    margin:0;
    padding:0;
    background:transparent;
    border:none;
}

/* ==============================================
   Labels
============================================== */

.tx-powermail .powermail_label,
.tx-powermail .form-label,
.form-label{
    display:block;
    margin:0 0 7px 0;

    color:var(--theta-text);
    font-size:15px;
    line-height:1.25;
    font-weight:700;
}

.tx-powermail .mandatory,
.tx-powermail .required,
.tx-powermail abbr{
    color:var(--theta-leadership);
    text-decoration:none;
}

/* ==============================================
   Eingabefelder
============================================== */

.tx-powermail .powermail_field,
.tx-powermail .powermail_input,
.tx-powermail .powermail_textarea,
.tx-powermail .powermail_select,
.tx-powermail .form-control,
.tx-powermail input[type="text"],
.tx-powermail input[type="email"],
.tx-powermail input[type="tel"],
.tx-powermail input[type="url"],
.tx-powermail input[type="number"],
.tx-powermail textarea,
.tx-powermail select{
    width:100% !important;
    max-width:100% !important;
    min-height:46px;
    padding:11px 14px !important;

    background:var(--powermail-bg);
    border:1px solid var(--powermail-border);
    border-radius:var(--powermail-radius);

    color:#ffffff;
    font-size:16px !important;
    line-height:1.35;
    font-weight:400;

    box-sizing:border-box;
    box-shadow:none;
}

.tx-powermail textarea,
.tx-powermail .powermail_textarea{
    min-height:170px !important;
    resize:vertical;
}

.tx-powermail select,
.tx-powermail .powermail_select{
    appearance:auto;
}

.tx-powermail .powermail_field::placeholder,
.tx-powermail .powermail_input::placeholder,
.tx-powermail .powermail_textarea::placeholder,
.tx-powermail .form-control::placeholder,
.tx-powermail textarea::placeholder,
.tx-powermail input::placeholder{
    color:#7F8EA3;
    opacity:1;
}

/* Fokus */

.tx-powermail .powermail_field:focus,
.tx-powermail .powermail_input:focus,
.tx-powermail .powermail_textarea:focus,
.tx-powermail .powermail_select:focus,
.tx-powermail .form-control:focus,
.tx-powermail input:focus,
.tx-powermail textarea:focus,
.tx-powermail select:focus{
    outline:none;
    border-color:var(--theta-leadership);
    box-shadow:0 0 0 3px rgba(56,214,255,.18);
}

/* ==============================================
   Datenschutz / Checkbox / Radio
============================================== */

.tx-powermail .powermail_fieldwrap_type_check,
.tx-powermail .powermail_fieldwrap_type_radio{
    margin:8px 0 !important;
    padding:10px 14px !important;

    background:var(--powermail-bg);
    border:1px solid var(--powermail-border);
    border-radius:var(--powermail-radius);

    color:var(--theta-text);
}

.tx-powermail input[type="checkbox"],
.tx-powermail input[type="radio"]{
    width:auto !important;
    min-height:0;
    margin:0 10px 0 0;
    accent-color:var(--theta-leadership);
    transform:translateY(2px);
}

.tx-powermail .powermail_check_inner,
.tx-powermail .powermail_radio_inner{
    display:flex;
    align-items:center;
    gap:10px;

    color:var(--theta-text);
    font-size:16px;
    line-height:1.4;
}

.tx-powermail .powermail_check_inner label,
.tx-powermail .powermail_radio_inner label{
    margin:0;
    color:var(--theta-text);
    font-weight:400;
    line-height:1.4;
}

.tx-powermail a{
    color:var(--theta-leadership);
    text-decoration:none;
}

.tx-powermail a:hover{
    text-decoration:underline;
}

/* ==============================================
   Captcha
============================================== */

.tx-powermail .powermail_fieldwrap_type_captcha,
.tx-powermail .powermail_fieldwrap_captcha,
.tx-powermail .powermail_fieldwrap_captcha_default,
.tx-powermail .powermail_fieldwrap_token{
    display:grid !important;
    grid-template-columns:auto 1fr;
    grid-template-areas:
        "label label"
        "image input";
    column-gap:18px;
    row-gap:8px;

    align-items:center;

    margin:8px 0 !important;
    padding:0 !important;

    background:transparent !important;
    border:none !important;
}

.tx-powermail .powermail_fieldwrap_type_captcha .powermail_label,
.tx-powermail .powermail_fieldwrap_captcha .powermail_label,
.tx-powermail .powermail_fieldwrap_captcha_default .powermail_label,
.tx-powermail .powermail_fieldwrap_token .powermail_label{
    grid-area:label;
    margin:0 !important;
}

.tx-powermail .powermail_fieldwrap_type_captcha .powermail_captchaimage,
.tx-powermail .powermail_fieldwrap_captcha .powermail_captchaimage,
.tx-powermail .powermail_fieldwrap_captcha_default .powermail_captchaimage,
.tx-powermail .powermail_fieldwrap_token .powermail_captchaimage,
.tx-powermail .powermail_captchaimage{
    grid-area:image;

    width:auto !important;
    max-width:none !important;
    height:auto !important;

    margin:0 !important;
    padding:0 !important;

    background:transparent !important;
    border:none !important;
    border-radius:0 !important;
    overflow:visible !important;
}

.tx-powermail .powermail_fieldwrap_type_captcha img,
.tx-powermail .powermail_fieldwrap_captcha img,
.tx-powermail .powermail_fieldwrap_captcha_default img,
.tx-powermail .powermail_fieldwrap_token img,
.tx-powermail .powermail_captchaimage img{
    display:block;

    width:auto !important;
    max-width:none !important;
    height:auto !important;

    border:1px solid var(--powermail-border);
    border-radius:8px;
}

.tx-powermail .powermail_fieldwrap_type_captcha .powermail_field,
.tx-powermail .powermail_fieldwrap_captcha .powermail_field,
.tx-powermail .powermail_fieldwrap_captcha_default .powermail_field,
.tx-powermail .powermail_fieldwrap_token .powermail_field{
    display:contents;
}

.tx-powermail .powermail_fieldwrap_type_captcha input[type="text"],
.tx-powermail .powermail_fieldwrap_captcha input[type="text"],
.tx-powermail .powermail_fieldwrap_captcha_default input[type="text"],
.tx-powermail .powermail_fieldwrap_token input[type="text"]{
    grid-area:input;

    width:100% !important;
    max-width:none !important;
    min-width:0 !important;
}

/* ==============================================
   Fehler / Validierung
============================================== */

.tx-powermail .powermail_message_error,
.tx-powermail .parsley-errors-list,
.powermail_message_error,
.parsley-errors-list{
    margin:6px 0 0 0;
    padding:0;
    list-style:none;

    color:#ff4b4b;
    font-size:14px;
    line-height:1.35;
    font-weight:700;
}

.tx-powermail .powermail_field_error,
.tx-powermail .parsley-error{
    border-color:#ff4b4b !important;
}

.tx-powermail .powermail_message,
.tx-powermail .alert{
    margin:0 0 14px 0;
    padding:12px 14px;
    border-radius:var(--powermail-radius);
    border:1px solid var(--powermail-border);
    background:var(--powermail-bg);
    color:var(--theta-text);
}

/* ==============================================
   Submit Button - Leadership Blau
============================================== */

.tx-powermail .powermail_fieldwrap_type_submit{
    margin-top:8px !important;
    margin-bottom:0 !important;
    padding:10px 14px !important;

    background:var(--powermail-bg);
    border:1px solid var(--powermail-border);
    border-radius:var(--powermail-radius);

    text-align:center;
}

.tx-powermail .powermail_submit,
.tx-powermail input.powermail_submit,
.tx-powermail button.powermail_submit,
.tx-powermail input[type="submit"],
.tx-powermail button[type="submit"]{
    display:inline-flex;
    align-items:center;
    justify-content:center;

    width:100%;
    min-height:50px;
    padding:13px 30px !important;
    margin:0;

    background:var(--theta-leadership);
    border:2px solid var(--theta-leadership);
    border-radius:999px;

    color:#071E3D !important;
    font-size:17px !important;
    line-height:1;
    font-weight:800;
    text-decoration:none;

    cursor:pointer;
    transition:all .25s ease;
    box-shadow:none;
}

.tx-powermail .powermail_submit:hover,
.tx-powermail input.powermail_submit:hover,
.tx-powermail button.powermail_submit:hover,
.tx-powermail input[type="submit"]:hover,
.tx-powermail button[type="submit"]:hover{
    background:transparent;
    color:var(--theta-leadership) !important;
    border-color:var(--theta-leadership);
    text-decoration:none;
}

/* ==============================================
   Alte Downloadbutton-Klasse erhalten
============================================== */

.downloadbutton{
    display:inline-block;
    padding:12px 25px;

    background:transparent;
    color:var(--theta-leadership) !important;

    border:2px solid var(--theta-leadership);
    border-radius:999px;

    font-weight:800;
    text-decoration:none;
}

.downloadbutton:hover{
    background:var(--theta-leadership);
    color:#071E3D !important;
    text-decoration:none;
}

/* ==============================================
   Mobile
============================================== */

@media(max-width:768px){

    .tx-powermail{
        max-width:100%;
        margin:28px auto 0 auto;
        padding:0;
    }

    .tx-powermail .row{
        display:block;
        margin-bottom:0 !important;
    }

    .tx-powermail .col-md-6,
    .tx-powermail .col-md-12,
    .tx-powermail [class*="col-"],
    .tx-powermail .col{
        max-width:100%;
        width:100%;
    }

    .tx-powermail .powermail_fieldwrap{
        margin-bottom:12px !important;
    }

    .tx-powermail .powermail_field,
    .tx-powermail .powermail_input,
    .tx-powermail .powermail_textarea,
    .tx-powermail .powermail_select,
    .tx-powermail .form-control,
    .tx-powermail input[type="text"],
    .tx-powermail input[type="email"],
    .tx-powermail input[type="tel"],
    .tx-powermail textarea,
    .tx-powermail select{
        font-size:16px !important;
    }

    .tx-powermail .powermail_fieldwrap_type_captcha,
    .tx-powermail .powermail_fieldwrap_captcha,
    .tx-powermail .powermail_fieldwrap_captcha_default,
    .tx-powermail .powermail_fieldwrap_token{
        display:block !important;
    }

    .tx-powermail .powermail_fieldwrap_type_captcha .powermail_captchaimage,
    .tx-powermail .powermail_fieldwrap_captcha .powermail_captchaimage,
    .tx-powermail .powermail_fieldwrap_captcha_default .powermail_captchaimage,
    .tx-powermail .powermail_fieldwrap_token .powermail_captchaimage{
        margin:10px 0 10px 0 !important;
    }
}