/* =====================================================
   CONTACT FORM SECTION STYLES
   For Contact Form 7 inside block with class contact-form-section
===================================================== */

.contact-form {
    width: clamp(400px, 50vw, 600px);
}

.contact-form *{
    font-family: var(--wp--preset--font-family--zen-old-mincho, serif);
    transition: border-color 0.5s ease, box-shadow 0.5s ease;
    box-sizing: border-box;
}
/* Input & Textarea Base */
.contact-form-section form{
    display: flex;
    flex-direction: column;
    align-items: center;
}
.contact-form-section .wpcf7-form input[type="text"],
.contact-form-section .wpcf7-form input[type="email"],
.contact-form-section .wpcf7-form input[type="tel"],
.contact-form-section .wpcf7-form textarea {
    width: 100%;
    border: 1px solid #ccc;
    /* border-radius: 6px; */
    padding: 12px 16px;
    font-size: 16px;

}

/* Focus Effect */
.contact-form-section .wpcf7-form input:focus,
.contact-form-section .wpcf7-form textarea:focus {
    outline: none;
    border-color: var(--wp--preset--color--secondary);
}

/* Placeholder fade */
.contact-form-section .wpcf7-form input:focus::placeholder,
.contact-form-section .wpcf7-form textarea:focus::placeholder {
    opacity: 0;
    transition: opacity 0.5s ease;
}

.contact-form-section .wpcf7-form input::placeholder,
.contact-form-section .wpcf7-form textarea::placeholder {
    opacity: 1;
    transition: opacity 0.5s ease;
}

/* Submit Button */
.contact-form-section .wpcf7-form input[type="submit"] {
    display: block;
    margin: 24px auto;
    width: 150px;
    height: 40px;
    font-family: var( --wp--preset--font-family--federo,--wp--preset--font-family--zen-old-mincho);
    color: #fff;
    background-color: var(--wp--preset--color--primary);
    border: 1px solid var(--wp--preset--color--primary);
    border-radius: 25px;
    cursor: pointer;
    font-size: 18px;
    letter-spacing: 0.1em;
    transition:  0.5s ease;
}

.contact-form-section .wpcf7-form input[type="submit"]:hover {
    background-color: white;
    color: var(--wp--preset--color--primary);
}

/* Response message (success/error) */
.contact-form-section .wpcf7-response-output {
    margin-top: 1.5rem;
    font-size: 16px;
    text-align: center;
    border-radius: 6px;
    padding: 12px;
}

/* Success */
.contact-form-section .wpcf7-mail-sent-ok {
    background-color: #dff5e2;
    color: var(--wp--preset--color--primary)
}

/* Error */
.contact-form-section .wpcf7-validation-errors,
.contact-form-section .wpcf7-acceptance-missing,.wpcf7-response-output {
    color: var(--wp--preset--color--primary)
}
.wpcf7 form .wpcf7-response-output{
    border: none;
}

.privacy-agreement p{
    display: flex;
    flex-direction: column;
    align-items: center;
}
/* ------------------ Responsive ------------------ */


@media (max-width: 480px) {
    .contact-form {
        width: 85vw;
    }
}