/* ------------------------------------------------------------------
   Getein mirror - site-wide contact form design.
   Loaded by every page after Duda's own stylesheets.

   Duda ships the "CONTACT US" section (#1559063722) in every page's footer
   with a bare layout-3 form: unbordered 30px inputs, a lone Phone field on
   its own row, a 30px textarea and a grey stock submit button. This restyles
   that one form everywhere. Every rule is scoped to the form's own id and
   carries !important because Duda's generated rules do too.
   ------------------------------------------------------------------ */

/* the widget is pinned to 465.6px by Duda - let it fill its column */
#dm div.u_1199127531 {
    width: 100% !important;
    max-width: 640px !important;
    margin: 0 auto !important;
    text-align: left !important;
}

/* two-column grid; Message and the button span both columns */
#dm div.u_1199127531 form.dmRespDesignRow {
    display: grid !important;
    grid-template-columns: 1fr 1fr;
    column-gap: 20px;
    row-gap: 18px;
    align-items: start;
}
#dm div.u_1199127531 .dmforminput {
    float: none !important;
    width: 100% !important;
    max-width: none !important;
    margin: 0 !important;
    padding: 0 !important;
    display: block !important;
}
#dm div.u_1199127531 .dmforminput.large-12,
#dm div.u_1199127531 .dmformsubmit {
    grid-column: 1 / -1;
}

/* Duda clearfixes the form row with ::before/::after{display:table}; on a
   grid container those pseudo-elements become grid items and steal the
   first cell (Name got pushed into column 2). Drop them. */
#dm div.u_1199127531 form.dmRespDesignRow::before,
#dm div.u_1199127531 form.dmRespDesignRow::after {
    content: none !important;
    display: none !important;
}
/* and pin the button's own width against Duda's width:100% rules */
#dm div.dmInner #site_content div.u_1199127531 .dmformsubmit input[type=submit],
#dm div.u_1199127531 .dmformsubmit input[type=submit] {
    width: auto !important;
    max-width: 100% !important;
    flex: 0 0 auto !important;
}

/* labels */
#dm div.u_1199127531 .dmforminput label:not(.for-checkable) {
    display: block !important;
    margin: 0 0 6px !important;
    font-family: Barlow, "Barlow Fallback", sans-serif !important;
    font-size: 14px !important;
    font-weight: 700 !important;
    letter-spacing: .04em !important;
    text-transform: uppercase !important;
    color: #fff !important;
    text-shadow: 0 1px 2px rgba(0, 0, 0, .35);
}
/* Duda marks required fields on the wrapper, not the label */
#dm div.u_1199127531 .dmforminput.required label:not(.for-checkable)::after {
    content: " *";
    color: #ffd26e;
}

/* fields */
#dm div.u_1199127531 .dmforminput input:not([type=submit]):not([type=hidden]),
#dm div.u_1199127531 .dmforminput textarea {
    box-sizing: border-box !important;
    width: 100% !important;
    height: 46px !important;
    padding: 10px 14px !important;
    margin: 0 !important;
    background: #fff !important;
    border: 1px solid rgba(0, 0, 0, .12) !important;
    border-radius: 6px !important;
    box-shadow: 0 1px 2px rgba(0, 0, 0, .08) !important;
    font-family: Barlow, "Barlow Fallback", sans-serif !important;
    font-size: 16px !important;
    font-weight: 400 !important;
    line-height: 1.4 !important;
    color: #222 !important;
    -webkit-appearance: none !important;
    appearance: none !important;
    outline: none !important;
    transition: border-color .15s ease, box-shadow .15s ease;
}
#dm div.u_1199127531 .dmforminput textarea {
    height: auto !important;
    min-height: 132px !important;
    resize: vertical !important;
    overflow: auto !important;
}
#dm div.u_1199127531 .dmforminput input::placeholder,
#dm div.u_1199127531 .dmforminput textarea::placeholder {
    color: #8a8a8a !important;
    opacity: 1 !important;
}
#dm div.u_1199127531 .dmforminput input:focus,
#dm div.u_1199127531 .dmforminput textarea:focus {
    border-color: var(--color_3, #00a89d) !important;
    box-shadow: 0 0 0 3px rgba(0, 168, 157, .28) !important;
}
/* Duda's inline validation state */
#dm div.u_1199127531 .dmforminput.dmform-error input,
#dm div.u_1199127531 .dmforminput.dmform-error textarea,
#dm div.u_1199127531 .dmforminput input.dmform-error,
#dm div.u_1199127531 .dmforminput textarea.dmform-error {
    border-color: #e5484d !important;
    box-shadow: 0 0 0 3px rgba(229, 72, 77, .25) !important;
}

/* submit */
#dm div.u_1199127531 .dmformsubmit {
    display: flex !important;
    justify-content: flex-end !important;
    width: 100% !important;
    margin: 4px 0 0 !important;
    padding: 0 !important;
    background: transparent !important;
    border: 0 !important;
    box-shadow: none !important;
    text-align: right !important;
}
#dm div.u_1199127531 input[type=submit] {
    box-sizing: border-box !important;
    height: 48px !important;
    min-width: 200px !important;
    padding: 0 32px !important;
    margin: 0 !important;
    background: var(--color_3, #00a89d) !important;
    border: 2px solid var(--color_3, #00a89d) !important;
    border-radius: 6px !important;
    font-family: Barlow, "Barlow Fallback", sans-serif !important;
    font-size: 16px !important;
    font-weight: 700 !important;
    letter-spacing: .04em !important;
    text-transform: uppercase !important;
    color: #fff !important;
    cursor: pointer !important;
    -webkit-appearance: none !important;
    appearance: none !important;
    transition: background-color .15s ease, color .15s ease, transform .1s ease;
}
#dm div.u_1199127531 input[type=submit]:hover,
#dm div.u_1199127531 input[type=submit]:focus-visible {
    background: #fff !important;
    color: var(--color_3, #00a89d) !important;
}
#dm div.u_1199127531 input[type=submit]:active {
    transform: translateY(1px);
}

/* captcha / status messages the runtime injects */
#dm div.u_1199127531 .m-recaptcha,
#dm div.u_1199127531 .dmforminput.g-recaptcha,
#dm div.u_1199127531 .dmforminput.frc-captcha,
#dm div.u_1199127531 .dmform-success,
#dm div.u_1199127531 .dmform-error-message,
#dm div.u_1199127531 .dmform-field-error {
    grid-column: 1 / -1;
    color: #fff !important;
}

/* phones: one column */
@media (max-width: 767px) {
    #dm div.u_1199127531 form.dmRespDesignRow { grid-template-columns: 1fr; row-gap: 14px; }
    #dm div.u_1199127531 .dmformsubmit { justify-content: stretch !important; }
    #dm div.u_1199127531 input[type=submit] { width: 100% !important; }
}

/* ---- AJAX states (contact-form.js) ---- */
#dm .dmform .cf-hp {
    position: absolute !important; left: -10000px !important;
    width: 1px !important; height: 1px !important; opacity: 0 !important;
}
#dm .dmform .cf-error {
    margin: 6px 0 0 !important;
    font: 700 13px/1.3 Barlow, "Barlow Fallback", sans-serif !important;
    color: #ffd6d8 !important;
    text-shadow: 0 1px 2px rgba(0, 0, 0, .4);
}
#dm .dmform .cf-invalid input,
#dm .dmform .cf-invalid textarea {
    border-color: #e5484d !important;
    box-shadow: 0 0 0 3px rgba(229, 72, 77, .25) !important;
}
#dm .dmform .cf-status {
    grid-column: 1 / -1;
    margin: 0 !important;
    padding: 12px 16px !important;
    border-radius: 6px !important;
    font: 600 15px/1.4 Barlow, "Barlow Fallback", sans-serif !important;
    text-align: left !important;
}
#dm .dmform .cf-status[hidden] { display: none !important; }
#dm .dmform .cf-status--success { background: rgba(0, 168, 157, .92) !important; color: #fff !important; }
#dm .dmform .cf-status--error   { background: rgba(229, 72, 77, .92) !important; color: #fff !important; }
#dm .dmform input[type=submit]:disabled { opacity: .7 !important; cursor: progress !important; }

/* layout-2 forms (label beside the field, e.g. the distributor page) */
#dm .dmform[data-layout=layout-2] .cf-error { margin-left: 0 !important; width: 100%; }
#dm .dmform[data-layout=layout-2] .dmforminput.cf-invalid { flex-wrap: wrap; }
#dm .dmform[data-layout=layout-2] .cf-status { display: block; width: 100%; margin: 12px 0 0 !important; }
#dm .dmform .cf-error { flex-basis: 100%; }
