/**
 * MN Gravity Forms Widget Styles
 *
 * Aggressive style overrides to comprehensively replace Gravity Forms
 * default styles with our own. Uses !important on key properties to
 * beat GF's built-in stylesheets and theme/Elementor Kit interference.
 *
 * @package MN_Elements
 * @since 3.1.6
 */

/* ==========================================================================
   Editor Placeholder
   ========================================================================== */

.mn-gf-placeholder {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 12px;
    min-height: 120px;
    padding: 30px;
    background: #f5f5f5;
    border: 2px dashed #ccc;
    border-radius: 6px;
    color: #888;
    text-align: center;
    font-family: inherit;
}

.mn-gf-placeholder svg {
    opacity: 0.4;
}

.mn-gf-placeholder p {
    margin: 0;
    font-size: 14px;
}

.mn-gf-notice {
    padding: 12px 16px;
    background: #fff3cd;
    border-left: 4px solid #ffc107;
    color: #856404;
    border-radius: 4px;
    font-size: 14px;
}

/* ==========================================================================
   Wrapper Reset — Aggressive override of GF defaults
   ========================================================================== */

.mn-gf-wrapper .gform_wrapper,
.mn-gf-wrapper .gform_wrapper * {
    box-sizing: border-box !important;
}

.mn-gf-wrapper .gform_wrapper {
    max-width: 100% !important;
    margin: 0 !important;
    padding: 0 !important;
    background: none !important;
    border: none !important;
    box-shadow: none !important;
}

/* Override GF form wrapper padding/margin from theme */
.mn-gf-wrapper .gform_wrapper form {
    margin: 0 !important;
    padding: 0 !important;
}

/* Override GF top/bottom margins on form body */
.mn-gf-wrapper .gform_wrapper .gform_heading,
.mn-gf-wrapper .gform_wrapper .gform_body {
    margin: 0 !important;
    padding: 0 !important;
    width: 100% !important;
}

/* ==========================================================================
   Form Title & Description
   ========================================================================== */

.mn-gf-wrapper .gform_wrapper .gform_title {
    font-size: 1.4em !important;
    font-weight: 700 !important;
    margin: 0 0 8px !important;
    padding: 0 !important;
    background: none !important;
    border: none !important;
}

.mn-gf-wrapper .gform_wrapper .gform_description {
    font-size: 0.95em !important;
    margin: 0 0 20px !important;
    padding: 0 !important;
    opacity: 0.8 !important;
    background: none !important;
    border: none !important;
}

/* ==========================================================================
   Field layout — Aggressive resets
   ========================================================================== */

.mn-gf-wrapper .gform_wrapper .gfield {
    margin-bottom: 16px !important;
    padding: 0 !important;
    background: none !important;
    border: none !important;
    box-shadow: none !important;
}

/* Override GF 2.5+ grid layout padding */
.mn-gf-wrapper .gform_wrapper .gform_fields {
    margin: 0 !important;
    padding: 0 !important;
    list-style: none !important;
    display: block !important;
    grid-template-columns: none !important;
}

.mn-gf-wrapper .gform_wrapper .gfield_label {
    display: block !important;
    font-weight: 600 !important;
    margin-bottom: 6px !important;
    padding: 0 !important;
    background: none !important;
    border: none !important;
}

.mn-gf-wrapper .gform_wrapper .gfield_required {
    margin-left: 2px !important;
    color: #e74c3c !important;
}

.mn-gf-wrapper .gform_wrapper .gfield_description {
    font-size: 0.85em !important;
    margin-top: 4px !important;
    padding: 0 !important;
    opacity: 0.75 !important;
    background: none !important;
    border: none !important;
}

/* Override GF section break / html field styles */
.mn-gf-wrapper .gform_wrapper .gsection {
    border: none !important;
    margin: 20px 0 !important;
    padding: 0 !important;
}

/* ==========================================================================
   All Input types — Aggressive defaults with !important
   ========================================================================== */

.mn-gf-wrapper .gform_wrapper input[type="text"],
.mn-gf-wrapper .gform_wrapper input[type="email"],
.mn-gf-wrapper .gform_wrapper input[type="tel"],
.mn-gf-wrapper .gform_wrapper input[type="number"],
.mn-gf-wrapper .gform_wrapper input[type="url"],
.mn-gf-wrapper .gform_wrapper input[type="password"],
.mn-gf-wrapper .gform_wrapper input[type="date"],
.mn-gf-wrapper .gform_wrapper input[type="time"],
.mn-gf-wrapper .gform_wrapper textarea,
.mn-gf-wrapper .gform_wrapper select {
    display: block !important;
    width: 100% !important;
    padding: 10px 14px !important;
    font-size: 1em !important;
    font-family: inherit !important;
    line-height: 1.5 !important;
    color: inherit !important;
    background-color: #fff !important;
    border: 1px solid #ddd !important;
    border-radius: 4px !important;
    outline: none !important;
    transition: border-color 0.2s ease, box-shadow 0.2s ease !important;
    appearance: auto !important;
    -webkit-appearance: auto !important;
    box-shadow: none !important;
    margin: 0 !important;
}

.mn-gf-wrapper .gform_wrapper input[type="text"]:focus,
.mn-gf-wrapper .gform_wrapper input[type="email"]:focus,
.mn-gf-wrapper .gform_wrapper input[type="tel"]:focus,
.mn-gf-wrapper .gform_wrapper input[type="number"]:focus,
.mn-gf-wrapper .gform_wrapper input[type="url"]:focus,
.mn-gf-wrapper .gform_wrapper input[type="password"]:focus,
.mn-gf-wrapper .gform_wrapper input[type="date"]:focus,
.mn-gf-wrapper .gform_wrapper input[type="time"]:focus,
.mn-gf-wrapper .gform_wrapper textarea:focus,
.mn-gf-wrapper .gform_wrapper select:focus {
    border-color: #4a90e2 !important;
    box-shadow: 0 0 0 3px rgba(74, 144, 226, 0.15) !important;
}

/* Textarea specific */
.mn-gf-wrapper .gform_wrapper textarea {
    resize: vertical !important;
    min-height: 100px !important;
}

/* Select dropdown arrow fix */
.mn-gf-wrapper .gform_wrapper select {
    background-image: url("data:image/svg+xml;charset=UTF-8,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23666' stroke-width='2'%3e%3cpolyline points='6 9 12 15 18 9'%3e%3c/polyline%3e%3c/svg%3e") !important;
    background-repeat: no-repeat !important;
    background-position: right 10px center !important;
    background-size: 16px !important;
    padding-right: 36px !important;
    appearance: none !important;
    -webkit-appearance: none !important;
}

/* ==========================================================================
   Checkbox & Radio
   ========================================================================== */

.mn-gf-wrapper .gform_wrapper .gfield--type-checkbox .gfield_checkbox,
.mn-gf-wrapper .gform_wrapper .gfield--type-radio .gfield_radio,
.mn-gf-wrapper .gform_wrapper .gfield_checkbox,
.mn-gf-wrapper .gform_wrapper .gfield_radio {
    list-style: none !important;
    padding: 0 !important;
    margin: 0 !important;
    display: flex !important;
    flex-direction: column !important;
    gap: 8px !important;
}

.mn-gf-wrapper .gform_wrapper .gfield_checkbox li,
.mn-gf-wrapper .gform_wrapper .gfield_radio li {
    display: flex !important;
    align-items: center !important;
    gap: 8px !important;
    margin: 0 !important;
    padding: 0 !important;
}

.mn-gf-wrapper .gform_wrapper .gfield_checkbox li label,
.mn-gf-wrapper .gform_wrapper .gfield_radio li label {
    margin: 0 !important;
    font-weight: normal !important;
    cursor: pointer !important;
}

.mn-gf-wrapper .gform_wrapper .gfield_checkbox input[type="checkbox"],
.mn-gf-wrapper .gform_wrapper .gfield_radio input[type="radio"] {
    width: auto !important;
    display: inline-block !important;
    flex-shrink: 0 !important;
}

/* ==========================================================================
   File Upload
   ========================================================================== */

.mn-gf-wrapper .gform_wrapper input[type="file"] {
    display: block !important;
    width: 100% !important;
    font-size: 0.9em !important;
    padding: 8px 0 !important;
}

/* ==========================================================================
   Required Fields Indicator
   Suppress Gravity Forms' built-in .gform_required_legend to avoid
   duplication when our custom indicator is shown.
   ========================================================================== */

/* Always hide GF's built-in legend inside our wrapper */
.mn-gf-wrapper .gform_wrapper .gform_required_legend {
    display: none !important;
}

.mn-gf-required-indicator {
    display: block;
    font-size: 0.85em;
    opacity: 0.7;
    margin: 0 0 16px;
    padding: 0;
}

.mn-gf-required-indicator--below {
    margin: 16px 0 0;
}

.mn-gf-required-indicator .gfield_required {
    color: #e74c3c;
    margin-left: 1px;
    margin-right: 1px;
}

/* ==========================================================================
   Submit Button — Aggressive override + flex alignment
   ========================================================================== */

.mn-gf-wrapper .gform_wrapper .gform_footer,
.mn-gf-wrapper .gform_wrapper .gform_page_footer {
    margin-top: 20px !important;
    padding: 0 !important;
    background: none !important;
    border: none !important;
    display: flex !important;
    flex-wrap: wrap !important;
    align-items: center !important;
    gap: 10px !important;
}

/* Alignment classes — applied via render() */
.mn-gf-wrapper .gform_wrapper .gform_footer.mn-gf-align-left,
.mn-gf-wrapper .gform_wrapper .gform_page_footer.mn-gf-align-left {
    justify-content: flex-start !important;
}

.mn-gf-wrapper .gform_wrapper .gform_footer.mn-gf-align-center,
.mn-gf-wrapper .gform_wrapper .gform_page_footer.mn-gf-align-center {
    justify-content: center !important;
}

.mn-gf-wrapper .gform_wrapper .gform_footer.mn-gf-align-right,
.mn-gf-wrapper .gform_wrapper .gform_page_footer.mn-gf-align-right {
    justify-content: flex-end !important;
}

/* High-specificity button selectors to override .elementor-kit-{id} button styles */
.mn-gf-wrapper .gform_wrapper .gform_footer .gform_button,
.mn-gf-wrapper .gform_wrapper .gform_footer .gform_next_button,
.mn-gf-wrapper .gform_wrapper .gform_footer .gform_previous_button,
.mn-gf-wrapper .gform_wrapper .gform_page_footer .gform_button,
.mn-gf-wrapper .gform_wrapper .gform_page_footer .gform_next_button,
.mn-gf-wrapper .gform_wrapper .gform_page_footer .gform_previous_button {
    display: inline-block !important;
    padding: 12px 28px !important;
    font-size: 1em;
    font-family: inherit;
    font-weight: 600;
    line-height: 1.4;
    color: #fff !important;
    background-color: #4a90e2 !important;
    border: 2px solid transparent;
    border-radius: 4px !important;
    cursor: pointer !important;
    text-decoration: none !important;
    transition: background-color 0.2s ease, color 0.2s ease, border-color 0.2s ease !important;
    appearance: none !important;
    -webkit-appearance: none !important;
    box-shadow: none !important;
    margin: 0 !important;
    text-transform: none;
    letter-spacing: normal;
    height: auto !important;
    min-height: 0 !important;
}

.mn-gf-wrapper .gform_wrapper .gform_footer .gform_button:hover,
.mn-gf-wrapper .gform_wrapper .gform_footer .gform_next_button:hover,
.mn-gf-wrapper .gform_wrapper .gform_footer .gform_previous_button:hover,
.mn-gf-wrapper .gform_wrapper .gform_page_footer .gform_button:hover,
.mn-gf-wrapper .gform_wrapper .gform_page_footer .gform_next_button:hover,
.mn-gf-wrapper .gform_wrapper .gform_page_footer .gform_previous_button:hover {
    background-color: #357abf !important;
    color: #fff !important;
}

/* ==========================================================================
   Validation & Errors
   ========================================================================== */

.mn-gf-wrapper .gform_wrapper .validation_error {
    padding: 12px 16px !important;
    margin-bottom: 20px !important;
    border-radius: 4px !important;
    font-size: 0.9em !important;
    background: none !important;
    border: none !important;
}

.mn-gf-wrapper .gform_wrapper .validation_message,
.mn-gf-wrapper .gform_wrapper .gfield_validation_message {
    color: #e74c3c !important;
    font-size: 0.85em !important;
    margin-top: 4px !important;
    display: block !important;
    padding: 0 !important;
    background: none !important;
    border: none !important;
}

.mn-gf-wrapper .gform_wrapper .gfield_error input,
.mn-gf-wrapper .gform_wrapper .gfield_error textarea,
.mn-gf-wrapper .gform_wrapper .gfield_error select {
    border-color: #e74c3c !important;
}

.mn-gf-wrapper .gform_wrapper .gfield_error .gfield_label {
    color: #e74c3c !important;
}

/* ==========================================================================
   Confirmation Message
   ========================================================================== */

.mn-gf-wrapper .gform_confirmation_wrapper,
.mn-gf-wrapper .gform_confirmation_message {
    padding: 20px 24px !important;
    border-radius: 4px !important;
    background-color: #eafaf1 !important;
    border: 1px solid #a9dfbf !important;
    color: #1e8449 !important;
    font-size: 1em !important;
    line-height: 1.6 !important;
    margin: 0 !important;
    box-shadow: none !important;
}

/* ==========================================================================
   Complex Fields (Name, Address, Date)
   ========================================================================== */

.mn-gf-wrapper .gform_wrapper .ginput_complex {
    display: flex !important;
    flex-wrap: wrap !important;
    gap: 12px !important;
}

.mn-gf-wrapper .gform_wrapper .ginput_complex span {
    flex: 1 1 120px !important;
    display: flex !important;
    flex-direction: column !important;
    gap: 4px !important;
}

.mn-gf-wrapper .gform_wrapper .ginput_complex label {
    font-size: 0.8em !important;
    font-weight: normal !important;
    opacity: 0.75 !important;
}

/* ==========================================================================
   Progress Bar (Multi-page)
   ========================================================================== */

.mn-gf-wrapper .gform_wrapper .gf_progressbar_wrapper {
    margin-bottom: 20px !important;
}

.mn-gf-wrapper .gform_wrapper .gf_progressbar {
    background: #e0e0e0 !important;
    border-radius: 20px !important;
    height: 8px !important;
    overflow: hidden !important;
}

.mn-gf-wrapper .gform_wrapper .gf_progressbar_percentage {
    height: 100% !important;
    background: #4a90e2 !important;
    border-radius: 20px !important;
    transition: width 0.4s ease !important;
}

/* ==========================================================================
   Placeholder styles — ensure placeholders are visible inside our wrapper
   ========================================================================== */

.mn-gf-wrapper .gform_wrapper input::placeholder,
.mn-gf-wrapper .gform_wrapper textarea::placeholder {
    color: rgba(0, 0, 0, 0.45) !important;
    opacity: 1 !important;
}

.mn-gf-wrapper .gform_wrapper input::-webkit-input-placeholder,
.mn-gf-wrapper .gform_wrapper textarea::-webkit-input-placeholder {
    color: rgba(0, 0, 0, 0.45) !important;
    opacity: 1 !important;
}

.mn-gf-wrapper .gform_wrapper input::-moz-placeholder,
.mn-gf-wrapper .gform_wrapper textarea::-moz-placeholder {
    color: rgba(0, 0, 0, 0.45) !important;
    opacity: 1 !important;
}

/* ==========================================================================
   GF CSS Variable Overrides at wrapper level
   Override GF theme framework button variables so our styles take effect
   ========================================================================== */

.mn-gf-wrapper .gform_wrapper .gform_footer .gform_button,
.mn-gf-wrapper .gform_wrapper .gform_page_footer .gform_button {
    --gf-ctrl-btn-bg-color-primary: var(--gf-local-bg-color, #4a90e2) !important;
    --gf-ctrl-btn-color-primary: var(--gf-local-color, #fff) !important;
    --gf-ctrl-btn-border-color-primary: transparent !important;
}

/* ==========================================================================
   Inline Form Layout
   Fields and submit button in a single horizontal row.
   ========================================================================== */

.mn-gf-wrapper.mn-gf-inline .gform_wrapper .gform_body {
    display: flex !important;
    flex-wrap: wrap !important;
    align-items: flex-end !important;
}

.mn-gf-wrapper.mn-gf-inline .gform_wrapper .gform_body > .gform_fields {
    display: contents !important;
}

.mn-gf-wrapper.mn-gf-inline .gform_wrapper .gform_fields > .gfield {
    flex: 1 1 auto !important;
    margin-bottom: 0 !important;
}

.mn-gf-wrapper.mn-gf-inline .gform_wrapper .gform_footer {
    margin-top: 0 !important;
}

.mn-gf-wrapper.mn-gf-inline .gform_wrapper .gform_footer .gform_button,
.mn-gf-wrapper.mn-gf-inline .gform_wrapper .gform_footer .gform_next_button,
.mn-gf-wrapper.mn-gf-inline .gform_wrapper .gform_footer .gform_previous_button {
    width: 100% !important;
    white-space: nowrap !important;
}

/* Hide labels in inline mode */
.mn-gf-wrapper.mn-gf-inline-hide-labels .gform_wrapper .gfield_label {
    display: none !important;
}

.mn-gf-wrapper.mn-gf-inline-hide-labels .gform_wrapper .gfield_description {
    display: none !important;
}

/* Inline form responsive: stack on mobile */
@media (max-width: 600px) {
    .mn-gf-wrapper.mn-gf-inline .gform_wrapper .gform_body {
        flex-direction: column !important;
        align-items: stretch !important;
    }

    .mn-gf-wrapper.mn-gf-inline .gform_wrapper .gform_fields > .gfield {
        flex: 1 1 100% !important;
    }

    .mn-gf-wrapper.mn-gf-inline .gform_wrapper .gform_footer {
        flex: 1 1 100% !important;
    }
}

/* ==========================================================================
   Responsive
   ========================================================================== */

@media (max-width: 600px) {
    .mn-gf-wrapper .gform_wrapper .ginput_complex {
        flex-direction: column !important;
    }

    .mn-gf-wrapper .gform_wrapper .ginput_complex span {
        flex: 1 1 100% !important;
    }

    .mn-gf-wrapper .gform_wrapper .gform_footer,
    .mn-gf-wrapper .gform_wrapper .gform_page_footer {
        justify-content: stretch !important;
    }

    .mn-gf-wrapper .gform_wrapper .gform_footer.mn-gf-align-left,
    .mn-gf-wrapper .gform_wrapper .gform_footer.mn-gf-align-center,
    .mn-gf-wrapper .gform_wrapper .gform_footer.mn-gf-align-right,
    .mn-gf-wrapper .gform_wrapper .gform_page_footer.mn-gf-align-left,
    .mn-gf-wrapper .gform_wrapper .gform_page_footer.mn-gf-align-center,
    .mn-gf-wrapper .gform_wrapper .gform_page_footer.mn-gf-align-right {
        justify-content: center !important;
    }
}
