/* =============================================================
   Forminator – Bootstrap 5.3 form-floating + form-control look
   Theme: dermartbuda.hu  (coral #D86C5D / espresso #422D2B)
   Overrides Forminator's heavily-scoped default styles.
   ============================================================= */


/* ----------------------------------------------------------------
   1. SHARED BASE  –  all .forminator-input elements
   ---------------------------------------------------------------- */

.forminator-ui.forminator-custom-form .forminator-input {
    display: block !important;
    width: 100% !important;
    font-size: 1rem !important;
    font-weight: 400 !important;
    font-family: Inter, sans-serif !important;
    color: #D86C5D !important;
    -webkit-appearance: none;
       -moz-appearance: none;
            appearance: none;
    background-color: transparent !important;
    background-image: none !important;
    background-clip: padding-box !important;
    border: 1px solid #D86C5D !important;
    border-radius: 0.375rem !important;
    box-shadow: none !important;
    -webkit-transition: border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out !important;
            transition: border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out !important;
}

/* ----------------------------------------------------------------
   1b. ROW SPACING
   Text/textarea fields: spacing comes from padding-top: 1.5rem
   on the floating-label container (section 7a).
   All other fields (select, checkbox, file, submit, etc.)
   need an explicit top margin.
   ---------------------------------------------------------------- */

.forminator-ui.forminator-custom-form .forminator-row {
    margin-bottom: 0 !important;
}

.forminator-ui.forminator-custom-form .forminator-field:not(:has(> :is(input[type="text"],input[type="email"],input[type="tel"],input[type="url"],input[type="password"],input[type="search"]).forminator-input)):not(:has(> textarea.forminator-input)) {
    margin-top: 1rem !important;
}

/* No leading gap before the very first row */
.forminator-ui.forminator-custom-form .forminator-row:first-child .forminator-field:not(:has(> :is(input[type="text"],input[type="email"],input[type="tel"],input[type="url"],input[type="password"],input[type="search"]).forminator-input)):not(:has(> textarea.forminator-input)) {
    margin-top: 0 !important;
}

/* ----------------------------------------------------------------
   2. INPUT / TEXTAREA  –  standard Bootstrap form-control height
   The float slot is created by padding-top on the container.
   ---------------------------------------------------------------- */

/* Standard inputs */
.forminator-ui.forminator-custom-form input.forminator-input:not(.iti__tel-input) {
    line-height: 1.5 !important;
    height: auto !important;
    padding: 0.375rem 0.75rem !important;
}

/* Phone / intl-tel-input: let the library's inline padding-left win */
.forminator-ui.forminator-custom-form input.iti__tel-input.forminator-input {
    line-height: 1.5 !important;
    height: auto !important;
    padding-top: 0.375rem !important;
    padding-right: 0.75rem !important;
    padding-bottom: 0.375rem !important;
    /* padding-left comes from intl-tel-input inline style — do NOT set !important here */
}

.forminator-ui.forminator-custom-form textarea.forminator-input {
    line-height: 1.5 !important;
    height: auto !important;
    padding: 0.375rem 0.75rem !important;
}

/* ----------------------------------------------------------------
   3. SELECT  –  standard form-select (no floating label)
   ---------------------------------------------------------------- */

.forminator-ui.forminator-custom-form select.forminator-input {
    line-height: 1.5 !important;
    height: calc(2.25rem + 2px) !important;
    padding: 0.375rem 2.25rem 0.375rem 0.75rem !important;
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3e%3cpath fill='none' stroke='%23D86C5D' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='m2 5 6 6 6-6'/%3e%3c/svg%3e") !important;
    background-repeat: no-repeat !important;
    background-position: right 0.75rem center !important;
    background-size: 16px 12px !important;
}

/* ----------------------------------------------------------------
   4. FOCUS STATE
   ---------------------------------------------------------------- */

.forminator-ui.forminator-custom-form .forminator-input:focus {
    color: #D86C5D !important;
    background-color: transparent !important;
    border-color: rgb(235, 181, 174) !important;
    outline: 0 !important;
    box-shadow: 0 0 0 0.25rem rgba(216, 108, 93, 0.25) !important;
}

/* ----------------------------------------------------------------
   5. DISABLED / READ-ONLY
   ---------------------------------------------------------------- */

.forminator-ui.forminator-custom-form .forminator-input:disabled,
.forminator-ui.forminator-custom-form .forminator-input[readonly] {
    background-color: #F2EFE9 !important;
    opacity: 1 !important;
}

/* ----------------------------------------------------------------
   6. PLACEHOLDER  –  hidden; the floating label is the visual hint
   ---------------------------------------------------------------- */

.forminator-ui.forminator-custom-form :is(input[type="text"],input[type="email"],input[type="tel"],input[type="url"],input[type="password"],input[type="search"]).forminator-input::-webkit-input-placeholder { color: transparent !important; }
.forminator-ui.forminator-custom-form :is(input[type="text"],input[type="email"],input[type="tel"],input[type="url"],input[type="password"],input[type="search"]).forminator-input::-moz-placeholder          { color: transparent !important; }
.forminator-ui.forminator-custom-form :is(input[type="text"],input[type="email"],input[type="tel"],input[type="url"],input[type="password"],input[type="search"]).forminator-input:-ms-input-placeholder      { color: transparent !important; }
.forminator-ui.forminator-custom-form :is(input[type="text"],input[type="email"],input[type="tel"],input[type="url"],input[type="password"],input[type="search"]).forminator-input::placeholder               { color: transparent !important; }
.forminator-ui.forminator-custom-form textarea.forminator-input::-webkit-input-placeholder { color: transparent !important; }
.forminator-ui.forminator-custom-form textarea.forminator-input::placeholder               { color: transparent !important; }


/* ================================================================
   7. FLOATING LABEL
   Forminator renders <label> BEFORE <input> in the DOM, so we
   use :focus-within and :has() on the parent .forminator-field.
   A JS fallback (.has-value class) covers older browsers.
   ================================================================ */

/* 7a. Container: padding-top = the slot the label floats into */
.forminator-ui.forminator-custom-form .forminator-field:has(> :is(input[type="text"],input[type="email"],input[type="tel"],input[type="url"],input[type="password"],input[type="search"]).forminator-input),
.forminator-ui.forminator-custom-form .forminator-field:has(> textarea.forminator-input) {
    position: relative !important;
    padding-top: 1.5rem !important;
}

/* 7b. Label: sits inside the input in default / empty state.
   top: 1.5rem aligns it with the input top (= container padding-top). */
.forminator-ui.forminator-custom-form .forminator-field:has(> :is(input[type="text"],input[type="email"],input[type="tel"],input[type="url"],input[type="password"],input[type="search"]).forminator-input) > .forminator-label,
.forminator-ui.forminator-custom-form .forminator-field:has(> textarea.forminator-input) > .forminator-label {
    position: absolute !important;
    top: 1.5rem !important;
    left: 0 !important;
    z-index: 2 !important;
    width: 100% !important;
    height: calc(2.25rem + 2px) !important;
    padding: 0.375rem 0.75rem !important;
    margin: 0 !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
    white-space: nowrap !important;
    pointer-events: none !important;
    border: 1px solid transparent !important;
    transform-origin: 0 50% !important;
    -webkit-transition: -webkit-transform 0.15s ease-in-out, opacity 0.1s ease-in-out !important;
            transition: transform 0.15s ease-in-out, opacity 0.1s ease-in-out !important;
    color: rgba(216, 108, 93, 0.6) !important;
    font-size: 1rem !important;
    font-weight: 400 !important;
    line-height: 1.5 !important;
    display: -webkit-box !important;
    display: -ms-flexbox !important;
    display: flex !important;
    -webkit-box-align: center !important;
        -ms-flex-align: center !important;
            align-items: center !important;
}

/* 7c. Textarea label: align to top, auto height */
.forminator-ui.forminator-custom-form .forminator-field:has(> textarea.forminator-input) > .forminator-label {
    height: auto !important;
    -webkit-box-align: flex-start !important;
        -ms-flex-align: flex-start !important;
            align-items: flex-start !important;
}

/* 7d. FLOATED state
   translateY(-1.9rem) centres the scaled label in the 1.5rem slot above the input. */
.forminator-ui.forminator-custom-form .forminator-field:has(> :is(input[type="text"],input[type="email"],input[type="tel"],input[type="url"],input[type="password"],input[type="search"]).forminator-input):focus-within > .forminator-label,
.forminator-ui.forminator-custom-form .forminator-field:has(> :is(input[type="text"],input[type="email"],input[type="tel"],input[type="url"],input[type="password"],input[type="search"]).forminator-input:not(:placeholder-shown)) > .forminator-label,
.forminator-ui.forminator-custom-form .forminator-field:has(> textarea.forminator-input):focus-within > .forminator-label,
.forminator-ui.forminator-custom-form .forminator-field:has(> textarea.forminator-input:not(:placeholder-shown)) > .forminator-label,
.forminator-ui.forminator-custom-form .forminator-field.has-value:has(> :is(input[type="text"],input[type="email"],input[type="tel"],input[type="url"],input[type="password"],input[type="search"]).forminator-input) > .forminator-label,
.forminator-ui.forminator-custom-form .forminator-field.has-value:has(> textarea.forminator-input) > .forminator-label {
    opacity: 1 !important;
    -webkit-transform: translateY(-1.9rem) scale(0.85) !important;
            transform: translateY(-1.9rem) scale(0.85) !important;
    color: #D86C5D !important;
}


/* ----------------------------------------------------------------
   8. LABELS  –  non-floating fields (select, checkbox, file)
   ---------------------------------------------------------------- */

.forminator-ui.forminator-custom-form .forminator-label {
    display: block !important;
    margin: 0 0 0.5rem !important;
    font-size: 1rem !important;
    font-weight: 400 !important;
    line-height: 1.5 !important;
    color: #422D2B !important;
    border: 0 !important;
}

.forminator-ui.forminator-custom-form .forminator-label[for] {
    cursor: pointer !important;
}

/* Required asterisk */
.forminator-ui.forminator-custom-form .forminator-required {
    color: #D86C5D;
    margin-left: 0.1em;
}


/* ----------------------------------------------------------------
   9. VALIDATION  –  error borders + Bootstrap invalid-feedback
   ---------------------------------------------------------------- */

.forminator-ui.forminator-custom-form .forminator-has_error .forminator-input,
.forminator-ui.forminator-custom-form .forminator-has_error select.forminator-input,
.forminator-ui.forminator-custom-form .forminator-has_error textarea.forminator-input {
    border-color: #dc3545 !important;
    box-shadow: none !important;
}

.forminator-ui.forminator-custom-form .forminator-has_error .forminator-input:focus,
.forminator-ui.forminator-custom-form .forminator-has_error select.forminator-input:focus,
.forminator-ui.forminator-custom-form .forminator-has_error textarea.forminator-input:focus {
    border-color: #dc3545 !important;
    box-shadow: 0 0 0 0.25rem rgba(220, 53, 69, 0.25) !important;
}

.forminator-ui.forminator-custom-form .forminator-error-message {
    display: none;
    width: 100% !important;
    margin-top: 0.25rem !important;
    padding: 0 !important;
    font-size: 0.875em !important;
    font-weight: 400 !important;
    line-height: 1.5 !important;
    color: #dc3545 !important;
    background: none !important;
    border-radius: 0 !important;
}

.forminator-ui.forminator-custom-form .forminator-has_error .forminator-error-message {
    display: block !important;
}


/* ----------------------------------------------------------------
   10. CHECKBOX  –  Bootstrap form-check-input appearance
   Replace Forminator's font-icon checkmark with an SVG one.
   ---------------------------------------------------------------- */

/* 10a. Regular checkbox: <label.forminator-checkbox> wraps box + text span */
.forminator-ui.forminator-custom-form .forminator-checkbox {
    display: -webkit-box !important;
    display: -ms-flexbox !important;
    display: flex !important;
    -webkit-box-align: flex-start !important;
        -ms-flex-align: flex-start !important;
            align-items: flex-start !important;
    gap: 0.5em !important;
    margin: 0.25rem 0 !important;
}

/* Reset Forminator's hard-coded margin-left on the label span — gap handles it */
.forminator-ui.forminator-custom-form .forminator-checkbox .forminator-checkbox-box ~ span {
    -webkit-box-flex: 1 !important;
        -ms-flex: 1 1 auto !important;
            flex: 1 1 auto !important;
    margin-left: 0 !important;
    line-height: 1.5 !important;
    padding-top: 0.125em !important;
}

/* 10b. Consent/GDPR: box is inside <label.forminator-consent>, text is a sibling div.
   The __wrapper must be the flex row. */
.forminator-ui.forminator-custom-form .forminator-checkbox__wrapper {
    display: -webkit-box !important;
    display: -ms-flexbox !important;
    display: flex !important;
    -webkit-box-align: flex-start !important;
        -ms-flex-align: flex-start !important;
            align-items: flex-start !important;
    gap: 0.5em !important;
}

/* Consent label: shrink to the box width, no extra margin */
.forminator-ui.forminator-custom-form .forminator-checkbox.forminator-consent {
    -webkit-box-flex: 0 !important;
        -ms-flex: 0 0 auto !important;
            flex: 0 0 auto !important;
    margin: 0 !important;
    padding: 0 !important;
}

/* Consent text description */
.forminator-ui.forminator-custom-form .forminator-consent__label,
.forminator-ui.forminator-custom-form .forminator-checkbox__label {
    -webkit-box-flex: 1 !important;
        -ms-flex: 1 1 auto !important;
            flex: 1 1 auto !important;
    line-height: 1.5 !important;
    padding-top: 0.125em !important;
    margin: 0 !important;
    color: #422D2B !important;
    font-size: 1rem !important;
}

.forminator-ui.forminator-custom-form .forminator-checkbox .forminator-checkbox-box {
    width: 1rem !important;
    height: 1rem !important;
    -webkit-box-flex: 0 !important;
        -ms-flex: 0 0 1rem !important;
            flex: 0 0 1rem !important;
    margin-top: 0.25em !important;
    background-color: transparent !important;
    background-image: none !important;
    background-repeat: no-repeat !important;
    background-position: center !important;
    background-size: contain !important;
    border: 1px solid rgba(66, 45, 43, 0.35) !important;
    border-radius: 0.25em !important;
    -webkit-appearance: none !important;
       -moz-appearance: none !important;
            appearance: none !important;
    print-color-adjust: exact !important;
    -webkit-transition: background-color 0.15s ease-in-out, border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out !important;
            transition: background-color 0.15s ease-in-out, border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out !important;
}

/* Remove Forminator's font-icon checkmark */
.forminator-ui.forminator-custom-form .forminator-checkbox .forminator-checkbox-box::before {
    display: none !important;
    content: none !important;
}

/* Checked: coral fill + Bootstrap SVG checkmark */
.forminator-ui.forminator-custom-form .forminator-checkbox input:checked + .forminator-checkbox-box {
    background-color: #D86C5D !important;
    border-color: #D86C5D !important;
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20'%3e%3cpath fill='none' stroke='%23fff' stroke-linecap='round' stroke-linejoin='round' stroke-width='3' d='m6 10 3 3 6-6'/%3e%3c/svg%3e") !important;
}

/* Focus ring */
.forminator-ui.forminator-custom-form .forminator-checkbox input:focus + .forminator-checkbox-box {
    border-color: rgb(235, 181, 174) !important;
    box-shadow: 0 0 0 0.25rem rgba(216, 108, 93, 0.25) !important;
}


/* ----------------------------------------------------------------
   11. PHONE FIELD  –  intl-tel-input (ITI) theming
   ---------------------------------------------------------------- */

/* Dial code text (e.g. "+36") and the dropdown arrow */
.forminator-ui.forminator-custom-form .forminator-phone .iti__selected-dial-code {
    color: #D86C5D !important;
    font-size: 1rem !important;
    font-family: Inter, sans-serif !important;
}

/* Dropdown arrow — inherit coral so it matches */
.forminator-ui.forminator-custom-form .forminator-phone .iti__arrow {
    border-top-color: #D86C5D !important;
}
.forminator-ui.forminator-custom-form .forminator-phone .iti__arrow--up {
    border-bottom-color: #D86C5D !important;
    border-top-color: transparent !important;
}

/* Remove default button background/border so it blends with the input */
.forminator-ui.forminator-custom-form .forminator-phone .iti__selected-country {
    background-color: transparent !important;
    border: none !important;
    outline: none !important;
}
.forminator-ui.forminator-custom-form .forminator-phone .iti__selected-country:hover,
.forminator-ui.forminator-custom-form .forminator-phone .iti__selected-country:focus {
    background-color: rgba(216, 108, 93, 0.08) !important;
}

/* Search input inside the dropdown */
.forminator-ui.forminator-custom-form .forminator-phone .iti__search-input {
    color: #422D2B !important;
    border-color: rgba(66, 45, 43, 0.35) !important;
    font-family: Inter, sans-serif !important;
    font-size: 0.875rem !important;
}


/* ----------------------------------------------------------------
   12. BUTTONS
   ---------------------------------------------------------------- */

/* Submit — Bootstrap .btn.btn-primary */
.forminator-ui.forminator-custom-form .forminator-button.forminator-button-submit,
.forminator-ui.forminator-custom-form .forminator-button-submit {
    display: inline-block !important;
    padding: 0.375rem 0.75rem !important;
    font-size: 1rem !important;
    font-weight: 400 !important;
    line-height: 1.5 !important;
    font-family: Inter, sans-serif !important;
    color: #fff !important;
    text-align: center !important;
    text-decoration: none !important;
    vertical-align: middle !important;
    cursor: pointer !important;
    background-color: #D86C5D !important;
    border: 1px solid #D86C5D !important;
    border-radius: 0.375rem !important;
    -webkit-transition: color 0.15s ease-in-out, background-color 0.15s ease-in-out, border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out !important;
            transition: color 0.15s ease-in-out, background-color 0.15s ease-in-out, border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out !important;
}

.forminator-ui.forminator-custom-form .forminator-button.forminator-button-submit:hover,
.forminator-ui.forminator-custom-form .forminator-button-submit:hover {
    background-color: rgb(173, 86, 74) !important;
    border-color: rgb(173, 86, 74) !important;
    color: #fff !important;
}

.forminator-ui.forminator-custom-form .forminator-button.forminator-button-submit:focus,
.forminator-ui.forminator-custom-form .forminator-button-submit:focus {
    outline: 0 !important;
    box-shadow: 0 0 0 0.25rem rgba(216, 108, 93, 0.5) !important;
}

/* Upload — Bootstrap .btn.btn-outline-primary */
.forminator-ui.forminator-custom-form .forminator-button.forminator-button-upload {
    color: #D86C5D !important;
    background-color: transparent !important;
    border: 1px solid #D86C5D !important;
    border-radius: 0.375rem !important;
    padding: 0.375rem 0.75rem !important;
    font-size: 1rem !important;
    line-height: 1.5 !important;
    cursor: pointer !important;
    -webkit-transition: color 0.15s ease-in-out, background-color 0.15s ease-in-out !important;
            transition: color 0.15s ease-in-out, background-color 0.15s ease-in-out !important;
}

.forminator-ui.forminator-custom-form .forminator-button.forminator-button-upload:hover {
    background-color: #D86C5D !important;
    color: #fff !important;
}
