/* --- CSS for Submit Button (Left) and Dropdown (Right) Alignment --- */

/* 1. Target the Dropdown's Container (Right Side) */
/* This is now the second, wider element */
#wpforms-14325-field_4-container {
    float: left !important;
    width: 100% !important; /* INCREASED WIDTH */
    box-sizing: border-box !important;
    padding-left: 0px !important; /* Add space between button and dropdown */
}

/* 2. Target the Submit Button's Container (Left Side) */
/* The element that is getting pulled up and is now the first element */
.wpforms-submit-container {
    /* CRITICAL: Pull the container up. Adjusted slightly for better alignment. */
    margin-top: -48px !important; 
    
    float: right !important;
    width: 38% !important; /* REDUCED WIDTH */
    box-sizing: border-box !important;
    
    /* Remove default spacing */
    padding: 0 !important; 
    margin-left: 0 !important;
}

/* Styling for the custom inline-submit button */
.inline-submit {
    /* Background/Fill Color */
    background-color: #0170B9 !important; 
    
    /* Font */
    font-family: "Roboto Slab", serif !important; /* WPForms uses sans-serif by default */
    font-weight: 500 !important; /* 500 is typically Medium weight */
    font-size: 15px !important; 
    
    /* Text Color (White usually looks best on blue) */
    color: #FFFFFF !important; 
    
    /* Remove default border */
    border: none !important;
    
    /* Optional: Add a subtle border-radius */
    border-radius: 4px !important;
    
    /* Ensure the button is not transparent and fills its space */
    width: 100% !important;
    height: 38px !important; /* Maintaining the height set previously for alignment */
}

/* Optional: Style for Hover state */
.inline-submit:hover {
    background-color: #5578C0 !important; /* Slightly darker blue on hover */
}

/* 3. Ensure the Dropdown and Button fill their forced containers */
#wpforms-14325-field_4 {
    width: 100% !important; /* Dropdown fills 100% of its 75% container */
}

.inline-submit {
    /* The button element itself. We set width 100% of its 25% container. */
    width: 100% !important;
    /* Optional: If the button is too tall, this forces a matching height */
    height: 38px !important; 
}

/* 4. Clear floats on the main form */
#wpforms-form-14325 {
    overflow: hidden !important; 
}


@media (max-width: 767px) {
    /* Reset all WPForms column classes to full width (100%) on mobile */
    .wpforms-one-third,
    .wpforms-two-thirds,
    .wpforms-one-half,
    .wpforms-three-fourths,
    .wpforms-one-fourth,
    .wpforms-first,
    /* Target your custom button class */
    .inline-submit, 
    /* Target the submit container, as it may still hold float/margin overrides */
    .wpforms-submit-container {
        /* Force full width */
        width: 100% !important;
        /* Remove floats that cause side-by-side alignment */
        float: none !important;
        /* Remove custom margins/padding that move the elements */
        margin: 0 !important;
        10px 0px 10px 0px !important
    }

    /* Specifically target the container for the button to remove the negative margin trick */
    .wpforms-submit-container {
        margin-top: 30px !important; /* Resetting to a standard positive margin/gap */
			padding:10px 0px 0px 0px !important
    }

    /* Ensure fields themselves also take full width if they have specific styles */
    .wpforms-field {
        width: 100% !important;
        float: none !important;
    }
}