/*
 * Elementor Form Style for Gravity Forms
 * ---------------------------------------
 * Scope: .elementor-form-style_wrapper
 * Usage: Add class "elementor-form-style" to any Gravity Forms wrapper
 *        via the gform_wrapper_classes filter. Gravity Forms appends
 *        "_wrapper" to the class name on the DOM element.
 *
 * Extracted from: Elementor form widget (elementor-element-9b82420)
 * on Newsletter-2 page at theraj.com
 */

/* =========================================
   FORM WRAPPER
   ========================================= */
.elementor-form-style_wrapper {
    max-width: 100%;
}

/* =========================================
   FIELD LABELS
   Match: DM Sans, 16px, weight 400, color #2E2D2B
   ========================================= */
.elementor-form-style_wrapper .gfield_label {
    font-family: "DM Sans", sans-serif;
    font-size: 16px;
    font-weight: 400;
    color: #2E2D2B;
    margin-bottom: 8px;
    padding: 0;
}

/* =========================================
   SUB-LABELS (e.g. "First" / "Last" under Name field)
   Match: DM Sans, 13px, weight 400, color #696763
   ========================================= */
.elementor-form-style_wrapper .gfield_description.sublabel {
    font-family: "DM Sans", sans-serif;
    font-size: 13px;
    font-weight: 400;
    color: #696763;
    margin-bottom: 4px;
}

/* =========================================
   TEXT / EMAIL / TEL INPUTS
   Match: DM Sans, 14px, weight 400, color #696763,
          transparent background, 1px solid #69727d border,
          border-radius 99px (pill shape)
   ========================================= */
.elementor-form-style_wrapper input[type="text"],
.elementor-form-style_wrapper input[type="email"],
.elementor-form-style_wrapper input[type="tel"],
.elementor-form-style_wrapper input[type="url"],
.elementor-form-style_wrapper input[type="number"],
.elementor-form-style_wrapper textarea,
.elementor-form-style_wrapper select {
    font-family: "DM Sans", sans-serif;
    font-size: 14px;
    font-weight: 400;
    color: #696763;
    background-color: transparent;
    border: 1px solid #69727d;
    border-radius: 99px;
    padding: 10px 16px;
    min-height: 40px;
    width: 100%;
    box-sizing: border-box;
    outline: none;
    transition: border-color 0.3s ease;
}

.elementor-form-style_wrapper input[type="text"]:focus,
.elementor-form-style_wrapper input[type="email"]:focus,
.elementor-form-style_wrapper input[type="tel"]:focus,
.elementor-form-style_wrapper input[type="url"]:focus,
.elementor-form-style_wrapper input[type="number"]:focus,
.elementor-form-style_wrapper textarea:focus,
.elementor-form-style_wrapper select:focus {
    border-color: #84472A;
}

/* Placeholder text */
.elementor-form-style_wrapper input::placeholder,
.elementor-form-style_wrapper textarea::placeholder {
    color: #999;
    font-family: "DM Sans", sans-serif;
    font-weight: 400;
    opacity: 1;
}

/* =========================================
   TEXTAREA (non-pill shape, matches Elementor custom CSS)
   ========================================= */
.elementor-form-style_wrapper textarea {
    border-radius: 16px;
    min-height: 120px;
    resize: vertical;
}

/* =========================================
   FIELD SPACING
   Match: 23px margin-bottom between field groups
   ========================================= */
.elementor-form-style_wrapper .gfield {
    margin-bottom: 23px;
}

/* =========================================
   NAME FIELD (complex / sub-fields row)
   Ensure First/Last inputs sit side-by-side
   ========================================= */
.elementor-form-style_wrapper .ginput_complex {
    display: flex;
    gap: 12px;
}

.elementor-form-style_wrapper .ginput_complex .name_first,
.elementor-form-style_wrapper .ginput_complex .name_last {
    flex: 1;
}

.elementor-form-style_wrapper .ginput_complex .name_first input,
.elementor-form-style_wrapper .ginput_complex .name_last input {
    width: 100%;
}

/* =========================================
   SUBMIT BUTTON
   Match: DM Sans, 16px, weight 500, background #84472A,
          color #fff, border-radius 999px, no border
   ========================================= */
.elementor-form-style_wrapper .gform_footer input[type="submit"],
.elementor-form-style_wrapper .gform_button {
    font-family: "DM Sans", sans-serif;
    font-size: 16px;
    font-weight: 500;
    color: #ffffff;
    background-color: #84472A;
    border: none;
    border-radius: 999px;
    padding: 14px 28px;
    min-height: 40px;
    cursor: pointer;
    transition: opacity 0.3s ease, background-color 0.3s ease;
    width: 100%;
    box-sizing: border-box;
}

.elementor-form-style_wrapper .gform_footer input[type="submit"]:hover,
.elementor-form-style_wrapper .gform_button:hover {
    background-color: #6e3a22;
    color: #ffffff;
}

.elementor-form-style_wrapper .gform_footer input[type="submit"]:active,
.elementor-form-style_wrapper .gform_button:active {
    opacity: 0.9;
}

/* =========================================
   FORM DESCRIPTION / INSTRUCTIONS
   ========================================= */
.elementor-form-style_wrapper .gfield_description {
    font-family: "DM Sans", sans-serif;
    font-size: 13px;
    color: #999;
    line-height: 1.5;
}

/* =========================================
   VALIDATION ERRORS
   ========================================= */
.elementor-form-style_wrapper .validation_error {
    color: #cf2e2e;
    font-family: "DM Sans", sans-serif;
    font-size: 14px;
    margin-bottom: 16px;
    padding: 12px 16px;
    border: 1px solid #cf2e2e;
    border-radius: 8px;
    background-color: #fdf0f0;
}

.elementor-form-style_wrapper .gfield_error .gfield_label {
    color: #cf2e2e;
}

.elementor-form-style_wrapper .gfield_error input,
.elementor-form-style_wrapper .gfield_error textarea,
.elementor-form-style_wrapper .gfield_error select {
    border-color: #cf2e2e;
}

/* =========================================
   SUCCESS MESSAGE
   ========================================= */
.elementor-form-style_wrapper .gform_confirmation_wrapper {
    font-family: "DM Sans", sans-serif;
    font-size: 16px;
    color: #2E2D2B;
    padding: 20px;
    text-align: center;
}

/* =========================================
   HIDDEN LABELS (used on email field in form 11)
   Keep spacing consistent even when label is visually hidden
   ========================================= */
.elementor-form-style_wrapper .hidden_label .gfield_label {
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    border: 0;
}

.elementor-form-style_wrapper .hidden_label .ginput_container {
    margin-top: 0;
}

/* =========================================
   FIELDSET (Name field container)
   Remove default fieldset border/padding
   ========================================= */
.elementor-form-style_wrapper fieldset.gfield {
    border: none;
    padding: 0;
    margin: 0 0 23px 0;
}

.elementor-form-style_wrapper fieldset .gfield_label {
    display: block;
}