/* GE Expert Advice: "expert consultation" card under the product images on the product page.
   Card like the dispatch-time note (light grey, thin border), accents in the theme red (#e73e24 - the colour of
   the "add to cart" and compare buttons in custom.css). The form inside is rendered by ets_cfultimate
   (classes wpcfu / ets_cfu_*), so its own defaults (36px inputs, blue uppercase button, block labels) are overridden here. */
.ge-expert-advice {
    margin: 20px 0 0;
    padding: 16px 18px 18px;
    border: 1px solid #ececec;
    border-radius: 3px;
    background: #f9f9f9;
    color: #222;
}

.ge-expert-advice__head {
    display: flex;
    align-items: center;
    gap: 15px;
}

.ge-expert-advice__icon {
    flex: 0 0 52px;
    width: 52px;
    height: 52px;
    color: #e73e24;
    line-height: 0;
}

.ge-expert-advice__icon svg,
.ge-expert-advice__icon img {
    display: block;
    width: 52px;
    height: 52px;
}

.ge-expert-advice__icon img {
    object-fit: contain;
}

.ge-expert-advice__text {
    min-width: 0;
}

.ge-expert-advice__title {
    font-size: 16px;
    font-weight: 700;
    line-height: 1.3;
    color: #222;
}

.ge-expert-advice__subtitle {
    margin-top: 3px;
    font-size: 13px;
    font-weight: 400;
    line-height: 1.4;
    color: #666;
}

.ge-expert-advice__subtitle a {
    color: inherit;
    text-decoration: none;
    white-space: nowrap;
}

.ge-expert-advice__subtitle a:hover,
.ge-expert-advice__subtitle a:focus-visible {
    color: #e73e24;
}

.ge-expert-advice__form {
    margin-top: 14px;
}

/* ---- Contact Form Ultimate markup inside the card ---- */

/* the form title CFU prints for hook display is removed in PHP; this is the safety net */
.ge-expert-advice .wpcfu .contact_form_title,
.ge-expert-advice .wpcfu h3 {
    display: none;
}

/* custom.css has a global ".ets-cfu-form { width: 95% }" for the services block */
.ge-expert-advice .wpcfu .ets-cfu-form {
    width: 100%;
    margin: 0;
}

.ge-expert-advice .wpcfu .ets_cfu_wrapper,
.ge-expert-advice .wpcfu .ets_cfu_box,
.ge-expert-advice .wpcfu .ets_cfu_col {
    display: block;
    width: 100%;
    margin: 0;
    padding: 0;
}

/* one row: phone field on the left, button on the right; other field types take a full row.
   flex-end keeps the button on the input's baseline when a field shows its label above the input */
.ge-expert-advice .wpcfu .ets_cfu_col {
    display: flex;
    flex-wrap: wrap;
    align-items: flex-end;
    gap: 8px;
}

.ge-expert-advice .wpcfu .ets_cfu_input {
    display: block;
    margin: 0;
}

.ge-expert-advice .wpcfu .ets_cfu_input_tel,
.ge-expert-advice .wpcfu .ets_cfu_input_text,
.ge-expert-advice .wpcfu .ets_cfu_input_email {
    flex: 1 1 180px;
    min-width: 0;
}

/* the button keeps to the right when it lands on a row of its own (forms with several fields) */
.ge-expert-advice .wpcfu .ets_cfu_input_submit {
    position: relative;
    flex: 0 0 auto;
    margin-left: auto;
}

.ge-expert-advice .wpcfu .ets_cfu_input_textarea,
.ge-expert-advice .wpcfu .ets_cfu_input_select,
.ge-expert-advice .wpcfu .ets_cfu_input_checkbox,
.ge-expert-advice .wpcfu .ets_cfu_input_radio,
.ge-expert-advice .wpcfu .ets_cfu_input_acceptance,
.ge-expert-advice .wpcfu .ets_cfu_input_html,
.ge-expert-advice .wpcfu .ets_cfu_input_captcha,
.ge-expert-advice .wpcfu .ets_cfu_input_recaptcha,
.ge-expert-advice .wpcfu .ets_cfu_input_turnstile {
    flex: 0 0 100%;
}

/* [hidden] fields of the form (product data for the admin e-mail): no slot in the row */
.ge-expert-advice .wpcfu .ge-ea-hidden-field {
    display: none;
}

/* invisible reCAPTCHA v3 (wrapper marked in PHP): no space for the empty element and the <br> after it;
   a visible captcha (v2 checkbox, Turnstile) keeps its full row */
.ge-expert-advice .wpcfu .ets_cfu_input_recaptcha br {
    display: none;
}

.ge-expert-advice .wpcfu .ets_cfu_input_recaptcha.ge-ea-captcha-invisible {
    flex: 0 0 auto;
    width: 0;
    height: 0;
    margin: -8px 0 0;
    line-height: 0;
    overflow: hidden;
}

/* field labels: a small caption above the field; visually hidden when the field has a placeholder */
.ge-expert-advice .wpcfu label {
    display: block;
    margin: 0;
    font-weight: 400;
    clear: none;
}

.ge-expert-advice .wpcfu label .ets_cfu_span {
    display: block;
    margin: 0 0 4px;
    font-size: 12px;
    line-height: 1.3;
    color: #666;
}

.ge-expert-advice .wpcfu label:has(input[placeholder]) .ets_cfu_span {
    position: absolute;
    width: 1px;
    height: 1px;
    margin: -1px;
    padding: 0;
    overflow: hidden;
    clip: rect(0 0 0 0);
    white-space: nowrap;
    border: 0;
}

.ge-expert-advice .wpcfu .ets_cfu_form-control-wrap {
    display: block;
    position: relative;
}

.ge-expert-advice .wpcfu input.ets_cfu_form-control:not(.ets_cfu-submit) {
    display: block;
    width: 100%;
    height: 50px;
    margin: 0;
    padding: 0 14px;
    border: 1px solid #d9d9d9;
    border-radius: 3px;
    background: #fff;
    color: #222;
    font-size: 14px;
    line-height: 48px;
    box-shadow: none;
}

.ge-expert-advice .wpcfu input.ets_cfu_form-control:not(.ets_cfu-submit):focus {
    border-color: #e73e24;
    outline: none;
    box-shadow: none;
}

.ge-expert-advice .wpcfu input.ets_cfu_form-control::placeholder {
    color: #8a8a8a;
    opacity: 1;
}

.ge-expert-advice .wpcfu input.ets_cfu_form-control.wpcfu-not-valid {
    border-color: #e73e24;
}

/* button: outlined red like the compare button, filled on hover */
.ge-expert-advice .wpcfu input.ets_cfu-submit {
    display: inline-block;
    height: 50px;
    margin: 0;
    padding: 0 22px;
    border: 1px solid #e73e24;
    border-radius: 3px;
    background: #fff;
    color: #e73e24;
    font-size: 14px;
    font-weight: 600;
    line-height: 48px;
    letter-spacing: .3px;
    text-transform: none;
    white-space: nowrap;
    cursor: pointer;
    box-shadow: none;
    transition: background-color .2s, color .2s;
}

.ge-expert-advice .wpcfu input.ets_cfu-submit:hover,
.ge-expert-advice .wpcfu input.ets_cfu-submit:focus-visible {
    background: #e73e24;
    color: #fff;
}

.ge-expert-advice .wpcfu input.ets_cfu-submit[disabled] {
    opacity: .6;
    cursor: not-allowed;
    background: #fff;
    color: #e73e24;
}

.ge-expert-advice .wpcfu .ajax-loader {
    margin: 0 0 0 6px;
    vertical-align: middle;
}

/* CFU shows its spinner as an inline pseudo-element after the button; keep it over the button instead of reflowing the card */
.ge-expert-advice .wpcfu .is-active .ets_cfu_input_submit.ets_cfu_input:after {
    position: absolute;
    top: 50%;
    right: 12px;
    margin: -10px 0 0;
}

.ge-expert-advice .wpcfu .is-active input.ets_cfu-submit {
    padding-right: 42px;
}

/* validation and response messages */
.ge-expert-advice .wpcfu .wpcfu-not-valid-tip {
    display: block;
    margin: 4px 0 0;
    font-size: 12px;
    line-height: 1.3;
    color: #e73e24;
}

.ge-expert-advice .wpcfu .wpcfu-response-output {
    margin: 10px 0 0;
    padding: 8px 12px;
    border-radius: 3px;
    font-size: 13px;
    line-height: 1.4;
}

.ge-expert-advice .wpcfu .wpcfu-response-output.wpcfu-display-none {
    display: none;
}

.ge-expert-advice .wpcfu .gdpr-consent {
    margin: 0;
    font-size: 12px;
    line-height: 1.4;
}

.ge-expert-advice .wpcfu .gdpr-consent:empty {
    display: none;
}

.ge-expert-advice .wpcfu > .clearfix,
.ge-expert-advice .wpcfu .ets_cfu_product {
    display: none;
}

/* ---- responsive ---- */
@media (max-width: 767px) {
    .ge-expert-advice--hide-mobile {
        display: none;
    }

    /* 16px keeps iOS Safari from zooming into the field on focus */
    .ge-expert-advice .wpcfu input.ets_cfu_form-control:not(.ets_cfu-submit) {
        font-size: 16px;
    }
}

@media (max-width: 575px) {
    .ge-expert-advice {
        padding: 14px 14px 16px;
    }

    .ge-expert-advice .wpcfu .ets_cfu_input_submit {
        flex: 0 0 100%;
    }

    .ge-expert-advice .wpcfu input.ets_cfu-submit {
        display: block;
        width: 100%;
    }
}
