/*
 * Set the background to transparent for the external form.
 * The !important is used to override core Bootstrap/Perfex styles.
 */

body {
    /* 1. Remove the default background color */
    background-color: transparent !important;
    
    /* 2. Ensure any potential background image is removed */
    background-image: none !important;
}

/* * 3. IMPORTANT: Check if the form is wrapped in a container that 
 * also has a white background and set that to transparent too.
 */
#form_wrapper {
    background-color: transparent !important;
    box-shadow: none !important; /* Remove any default box shadows */
}
/* --- CSS Variables for Cleaner Styling (Optional but good practice) --- */
:root {
    /* Using the button's original green color for the primary theme */
    --custom-primary-color: #84c529; 
    --custom-white: #ffffff;
    /* Using a robust font stack */
    --custom-heading-font: "Inter", "Helvetica Neue", Helvetica, Arial, sans-serif;
}

/* --- Redesigning the Submit Button using its ID for high specificity --- */
#form_submit {
    /* --- Core Look & Feel (Matching the reference styles) --- */
    user-select: none !important;
    -moz-user-select: none !important;
    
    /* Background, Text Color, and Border */
    background: var(--custom-primary-color) none repeat scroll 0 0 !important;
    color: var(--custom-white) !important;
    border: medium none !important; /* Remove any default border */
    border-radius: 4px !important; /* Apply subtle rounding */
    
    /* --- Spacing & Size --- */
    padding: 20px 31px !important; /* Generous modern padding */
    line-height: 1 !important;      /* Ensure consistent height */
    
    /* --- Typography --- */
    font-size: 18px !important;
    font-weight: 600 !important; /* Slightly bolder for impact */
    font-family: var(--custom-heading-font) !important;
    text-transform: none !important; /* Keep capitalization flexible */

    /* --- Interaction & Positioning --- */
    cursor: pointer !important;
    transition: all 0.3s ease 0s !important; /* Smooth transitions for hover */
    position: relative !important;
    overflow: hidden !important;
    z-index: 1 !important;

    /* Ensure other default styles are clean */
    display: inline-block !important;
    text-align: center !important;
    margin: 15px 0 0 0 !important; /* Add some top margin if needed */
}

/* --- Hover Effect for Professional Polish --- */
#form_submit:hover {
    /* Slightly darker green on hover for visual feedback */
    background-color: #6da722 !important;
    /* Optional: subtle shadow for a "lifted" effect */
    box-shadow: 0 5px 15px rgba(0, 0, 0, 0.15);
    transform: translateY(-2px); /* Slight vertical shift */
}