/*
Theme Name: Wilmer
Theme URI: https://wilmer.qodeinteractive.com/
Description: Construction WordPress Theme
Author: Mikado Themes
Author URI: http://themeforest.net/user/mikado-themes
Text Domain: wilmer
Tags: one-column, two-columns, three-columns, four-columns, left-sidebar, right-sidebar, custom-menu, featured-images, flexible-header, post-formats, sticky-post, threaded-comments, translation-ready
Version: 3.5
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
*/

/* Steadman Contact Custom */

/* Ultra High Specificity Overrides to match Right Column Card Quality */

/* Container and Row Layout */
html body.page-template-full-width .sps-contact-wrapper-final .sps-2col-row,
html body.page-template-full-width .elementor-element-sec_contact_final .elementor-container {
    display: flex !important;
    gap: 30px !important;
    align-items: flex-start !important;
}

html body.page-template-full-width .sps-left-form-col,
html body.page-template-full-width .elementor-element-col_left_final {
    flex: 0 0 58% !important;
    max-width: 58% !important;
    width: 58% !important;
}

html body.page-template-full-width .sps-right-info-col,
html body.page-template-full-width .elementor-element-col_right_final {
    flex: 0 0 42% !important;
    max-width: 42% !important;
    width: 42% !important;
}

/* 1. Left Form Container Card Box */
html body .mkdf-content .wpcf7-form .sps-cf7-container {
    background: #ffffff !important;
    border: 1px solid #e5e5e8 !important;
    border-radius: 8px !important;
    padding: 35px 30px !important;
    box-shadow: 0 5px 20px rgba(0, 0, 0, 0.04) !important;
    box-sizing: border-box !important;
    width: 100% !important;
}

/* 2. Side-by-Side Rows for Name & Email */
html body .mkdf-content .wpcf7-form .sps-cf7-container .sps-cf7-row {
    display: flex !important;
    flex-wrap: wrap !important;
    gap: 20px !important;
    margin-bottom: 20px !important;
    width: 100% !important;
}

html body .mkdf-content .wpcf7-form .sps-cf7-container .sps-cf7-col-50 {
    flex: 1 1 calc(50% - 10px) !important;
    max-width: calc(50% - 10px) !important;
    width: calc(50% - 10px) !important;
    box-sizing: border-box !important;
}

html body .mkdf-content .wpcf7-form .sps-cf7-container .sps-cf7-col-100 {
    flex: 1 1 100% !important;
    max-width: 100% !important;
    width: 100% !important;
    box-sizing: border-box !important;
}

/* 3. Labels */
html body .mkdf-content .wpcf7-form .sps-cf7-container label.sps-cf7-label {
    display: block !important;
    font-size: 11px !important;
    font-weight: 700 !important;
    color: #4a5320 !important;
    text-transform: uppercase !important;
    letter-spacing: 1.2px !important;
    margin-bottom: 8px !important;
    font-family: inherit !important;
}

/* 4. Inputs & Textarea - Force visible borders, background, and padding */
html body div.mkdf-wrapper div.mkdf-content .wpcf7-form .sps-cf7-container input[type="text"],
html body div.mkdf-wrapper div.mkdf-content .wpcf7-form .sps-cf7-container input[type="email"],
html body div.mkdf-wrapper div.mkdf-content .wpcf7-form .sps-cf7-container input[type="tel"],
html body div.mkdf-wrapper div.mkdf-content .wpcf7-form .sps-cf7-container textarea,
html body div.mkdf-wrapper div.mkdf-content .wpcf7-form .wpcf7-form-control-wrap input,
html body div.mkdf-wrapper div.mkdf-content .wpcf7-form .wpcf7-form-control-wrap textarea {
    width: 100% !important;
    background-color: #f9f9fc !important;
    border: 1px solid #e2e2e8 !important;
    border-radius: 6px !important;
    padding: 14px 16px !important;
    font-size: 14px !important;
    color: #222222 !important;
    outline: none !important;
    box-sizing: border-box !important;
    box-shadow: none !important;
    height: auto !important;
    min-height: 48px !important;
    line-height: 1.4 !important;
}

html body div.mkdf-wrapper div.mkdf-content .wpcf7-form .sps-cf7-container textarea,
html body div.mkdf-wrapper div.mkdf-content .wpcf7-form .wpcf7-form-control-wrap textarea {
    min-height: 130px !important;
    height: 130px !important;
    resize: vertical !important;
}

html body div.mkdf-wrapper div.mkdf-content .wpcf7-form .sps-cf7-container input:focus,
html body div.mkdf-wrapper div.mkdf-content .wpcf7-form .sps-cf7-container textarea:focus,
html body div.mkdf-wrapper div.mkdf-content .wpcf7-form .wpcf7-form-control-wrap input:focus,
html body div.mkdf-wrapper div.mkdf-content .wpcf7-form .wpcf7-form-control-wrap textarea:focus {
    background-color: #ffffff !important;
    border-color: #f35930 !important;
    box-shadow: 0 0 0 3px rgba(243, 89, 48, 0.15) !important;
}

/* 5. Submit Button */
html body div.mkdf-wrapper div.mkdf-content .wpcf7-form button.wpcf7-submit,
html body div.mkdf-wrapper div.mkdf-content .wpcf7-form input.wpcf7-submit,
html body div.mkdf-wrapper div.mkdf-content .wpcf7-form .sps-cf7-container .wpcf7-submit {
    background-color: #3e4a21 !important;
    border: none !important;
    color: #ffffff !important;
    font-size: 13px !important;
    font-weight: 700 !important;
    text-transform: uppercase !important;
    letter-spacing: 1.5px !important;
    padding: 16px 36px !important;
    border-radius: 6px !important;
    cursor: pointer !important;
    display: inline-block !important;
    transition: background-color 0.25s ease, transform 0.2s ease !important;
    box-shadow: 0 4px 12px rgba(62, 74, 33, 0.2) !important;
    width: auto !important;
    margin-top: 10px !important;
}

html body div.mkdf-wrapper div.mkdf-content .wpcf7-form button.wpcf7-submit:hover,
html body div.mkdf-wrapper div.mkdf-content .wpcf7-form input.wpcf7-submit:hover,
html body div.mkdf-wrapper div.mkdf-content .wpcf7-form .sps-cf7-container .wpcf7-submit:hover {
    background-color: #f35930 !important;
    box-shadow: 0 6px 16px rgba(243, 89, 48, 0.3) !important;
    transform: translateY(-2px) !important;
}

/* Hide theme default h6 labels inside CF7 if generated by theme JS */
html body .sps-cf7-container h6 {
    display: none !important;
}

/* Responsive */
@media (max-width: 768px) {
    html body.page-template-full-width .sps-contact-wrapper-final .sps-2col-row,
    html body.page-template-full-width .elementor-element-sec_contact_final .elementor-container {
        flex-direction: column !important;
    }
    html body.page-template-full-width .sps-left-form-col,
    html body.page-template-full-width .elementor-element-col_left_final,
    html body.page-template-full-width .sps-right-info-col,
    html body.page-template-full-width .elementor-element-col_right_final {
        flex: 0 0 100% !important;
        max-width: 100% !important;
        width: 100% !important;
    }
    html body .mkdf-content .wpcf7-form .sps-cf7-container .sps-cf7-col-50 {
        flex: 1 1 100% !important;
        max-width: 100% !important;
        width: 100% !important;
    }
}