/*
 Theme Name:   Hello Elementor Child
 Template:     hello-elementor
 Author:       Your Name
 Version:      1.0.0
*/

/* Container styling */
.dme-flex-form {
    max-width: 100%;
    margin: 0 auto;
    font-family: 'Poppins', sans-serif;
}

/* Section titles with brand red */
.dme-section h3 {
    font-size: 20px;
    margin-bottom: 20px;
    padding-bottom: 10px;
    border-bottom: 2px solid #CD0304;
    color: #ffffff;
}

/* Flexbox Row for two columns */
.flex-row {
    display: flex !important;
    flex-wrap: wrap !important;
    gap: 20px;
    margin-bottom: 20px;
}

/* Equal width columns */
.flex-col {
    flex: 1 1 calc(50% - 20px) !important;
    min-width: 100px; 
}

.flex-col p label, .flex-col-full p label {color: #000000 !important;}
.flex-col-full {
    flex: 1 1 100% !important;
}

/* Fixing Contact Form 7 spans */
.wpcf7-form-control-wrap {
    display: block !important;
}

/* Input fields styling */
.dme-flex-form input,
.dme-flex-form select {
    width: 100% !important;
    padding: 12px;
    border: 1px solid #ddd;
    border-radius: 4px;
    box-sizing: border-box !important;
}

/* Main Brand Button */
.form-footer input[type="submit"] {
    background-color: #CD0304 !important;
    color: #fff !important;
    padding: 15px 30px;
    border: none;
    border-radius: 5px;
    font-size: 18px;
    font-weight: 600;
    cursor: pointer;
    width: 100%;
    transition: 0.3s;
}

.form-footer input[type="submit"]:hover {
    background-color: #a10203 !important;
}
/* Container for the checkboxes to keep them organized */
.wpcf7-checkbox {
    display: flex !important;
    flex-wrap: wrap !important;
    gap: 15px; /* Space between checkbox items */
    margin-top: 10px;
}

/* Individual checkbox item styling */
.wpcf7-list-item {
    display: inline-flex !important;
    align-items: center;
    margin: 0 !important; /* Reset CF7 default margins */
    flex: 1 1 calc(33.33% - 15px); /* 3 columns on desktop */
    min-width: 100px; /* Ensures readability on smaller screens */
}

/* Ensure the checkbox input and label text align perfectly */
.wpcf7-list-item label {
    display: flex;
    align-items: center;
    cursor: pointer;
    font-size: 15px;
    color: #444;
	line-height:1.1em;
}
.wpcf7-list-item-label {margin-bottom: 10px !important;}
/* Styling the actual checkbox input */
.wpcf7-list-item input[type="checkbox"] {
    margin-right: 10px !important;
    width: 18px !important;
    height: 18px !important;
	margin-bottom: 10px !important;
    accent-color: #CD0304; /* Uses your brand red for the checkmark */
}

.wpcf7 form.sent .dme-flex-form .wpcf7-response-output {color: #ffffff !important;}
.labelClr{color:#000000 !important;}