/* css/frontend.css */



form.secure-form{
    display: flex;
    justify-content: center;
    flex-direction: column;
    align-items: center;
}


.secure-form-container {
    max-width: 600px;
    margin: 20px auto;
}

.secure-form .form-field {
    margin-bottom: 20px;
}

.secure-form label {
    display: block;
    margin-bottom: 5px;
    font-weight: bold;
}

.secure-form input[type="text"],
.secure-form input[type="email"],
.secure-form textarea,
.secure-form select {
    width: 100%;
    padding: 8px;
    border: 1px solid #ddd;
    border-radius: 4px;
}

.secure-form textarea {
    min-height: 60px;
}

.secure-form .required {
    color: red;
    margin-left: 3px;
}

.secure-form .submit-button {
    background: #0073aa;
    color: white;
    padding: 10px 20px;
    border: none;
    border-radius: 4px;
    cursor: pointer;
}

.secure-form .submit-button:hover {
    background: #006291;
}

.secure-form .submit-button:disabled {
    background: #ccc;
    cursor: not-allowed;
}

.form-message {
    padding: 10px;
    margin-top: 20px;
    border-radius: 4px;
}

.form-message.success {
    background: #dff0d8;
    color: #3c763d;
    border: 1px solid #d6e9c6;
}

.form-message.error {
    background: #f2dede;
    color: #a94442;
    border: 1px solid #ebccd1;
}

/* css/admin.css */
.form-builder {
    max-width: 800px;
    margin: 20px 0;
}

.form-section {
    margin-bottom: 20px;
}

.field-item {
    background: #f9f9f9;
    padding: 15px;
    margin-bottom: 10px;
    border: 1px solid #ddd;
    border-radius: 4px;
}

.field-item label {
    display: block;
    margin-bottom: 10px;
}

.field-item input[type="text"],
.field-item textarea {
    width: 100%;
    margin-top: 5px;
}

.remove-field {
    float: right;
    color: #dc3232;
}

.existing-forms {
    margin-top: 40px;
}

.wp-list-table code {
    background: #f0f0f1;
    padding: 3px 5px;
}


/* Add to your frontend.css */
.terms-field {
    margin: 20px 0;
}

.terms-field label {
    display: flex;
    align-items: flex-start;
    gap: 10px;
}

.terms-field input[type="checkbox"] {
    margin-top: 4px;
}

.terms-text {
    font-size: 0.9em;
    color: #666;
    margin-top: 10px;
    padding: 10px;
    background: #f7f7f7;
    border-radius: 4px;
}

.g-recaptcha {
    margin: 20px 0;
}


.secure-form .form-field {
    margin-bottom: 20px;
    width: 100%;
}

.secure-form label {
    display: flex;
    margin-bottom: 15px;
    font-weight: 100;
    text-align: left;
}

.secure-form label a img{
    width: 15px;
    position: relative;
    top: 3px;
}

.secure-form input[type="text"],
.secure-form input[type="email"],
.secure-form textarea,
.secure-form select {
    width: calc(100% - 30px);
    padding: 15px;
    border: 1px solid #d6d6d6;
    border-radius: 10px;
}

.secure-form .form-field label a{
    font-weight: 600;
}

.secure-form textarea {
    min-height: 60px;
}

.secure-form .required {
    color: red;
    margin-left: 3px;
}

.secure-form .submit-button {
    background: #0073aa;
    color: white;
    padding: 10px 20px;
    border: none;
    border-radius: 4px;
    cursor: pointer;
}

.secure-form .submit-button:hover {
    background: #006291;
}

.form-submit{
    width: 100%;
    text-align: center;
}

.sib-form{
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    text-align: center;
}

.sib-form form{
    width: 100%;
}

.sib-form .form-group input[type="email"]{
    width: calc(100% - 27px);
}

.sib-form .checkbox-group {
    display: flex;
    align-items: center;
    justify-content: center;
}

.sib-form .submit-button {
    width: 100%;
    max-width: 300px;
    height: 62px;
    background-color: #000000;
    border-radius: 99px;
}


.form-submit button{
    width: 100%;
    background: #000 !important;
    border-radius: 99px !important;
    height: 63px;
    max-width: 230px;
}

.terms-field {
    margin: 10px 0px 0px 0px !important;
    text-align: center;
    display: flex;
    justify-content: center;
}

.form-field select{
    width: 100% !important;
}

.terms-text {
    font-size: 0.9em;
    margin-top: 10px;
    padding: 10px;
    background: #f7f7f7;
    border-radius: 4px;
}

.form-message {
    padding: 10px;
    margin-top: 20px;
    border-radius: 4px;
}

.form-message.success {
    background: #dff0d8;
    color: #3c763d;
    border: 1px solid #d6e9c6;
}

.form-message.error {
    background: #f2dede;
    color: #a94442;
    border: 1px solid #ebccd1;
}

.sib-form img{ filter: invert(0); width: 12px; }
.sib-form .form-group input[type="email"] { width: calc(100% - 27px); text-align: center; }
.sib-form .submit-button { height: 75px; background-color: #171616; }
.sib-form .form-group input[type="email"] { width: calc(100% - 27px); text-align: center; background: none; border: 0; height: 42px; border-radius: 0px;
    border-bottom: solid 1px #ffffff66; font-size: 1.4em; outline:0px !important; }
.sib-form .form-group input[type="email"]:focus{ outline:0px !important; border-bottom: solid 1px; }
.sib-form .checkbox-group label{ margin: 6px 0px; }
.sib-form .checkbox-text { font-weight: 200; }
.sib-form .readTerms{ margin-left: 10px;  font-size: 14px;  margin-left:6px;  opacity:0.7; font-weight: 200; }



@media (max-width: 768px) {

    .secure-form-container > .sib-form { padding: 0px 40px !important; width: calc(100% - 80px); }
    .sib-form .form-group input[type="email"] { font-size: 14px; }
    .sib-form .readTerms { margin-left: 0; opacity: 0.7; width: 100%; display: block; margin-top: 20px; }
    .sib-form .submit-button{ max-width: 222px; height: 60px; }
    .secure-form-container { margin: 10px auto 20px auto; }

}