/* ============================================
   Park.dog — Contact Page CSS
   Owns: contact-page-only styling (sidebar width,
   contact-form-specific tweaks).
   Shared CF7 styling stays in style.css.
   ============================================ */

/* Contact sidebar fixed width (Elementor ignores min_width/max_width on containers) */
.elementor-element-ct_sidebar {
    flex-shrink: 0 !important;
    width: 340px !important;
    min-width: 340px !important;
    max-width: 340px !important;
}

/* ============================================
   Responsive: Tablet (≤1024px)
   At narrower widths the 340px sidebar squeezes
   the form columns. Stack the sidebar below the
   form so both have full width.
   ============================================ */
@media (max-width: 1024px) {
    .elementor-element-ct_content > .e-con-inner {
        flex-direction: column !important;
    }

    .elementor-element-ct_form,
    .elementor-element-ct_sidebar {
        width: 100% !important;
        min-width: 0 !important;
        max-width: 100% !important;
    }

    .elementor-element-ct_sidebar {
        flex-direction: row !important;
        flex-wrap: wrap !important;
        gap: 20px !important;
    }

    .elementor-element-ct_info1,
    .elementor-element-ct_info2 {
        flex: 1 1 320px !important;
        min-width: 0 !important;
    }
}

/* ============================================
   Responsive: Mobile (≤767px)
   Stack sidebar cards vertically, tighten paddings,
   make form inputs full-width-friendly.
   ============================================ */
@media (max-width: 767px) {
    .elementor-element-ct_sidebar {
        flex-direction: column !important;
        gap: 16px !important;
    }

    .elementor-element-ct_info1,
    .elementor-element-ct_info2 {
        flex: 1 1 100% !important;
        width: 100% !important;
    }

    /* CF7 inputs: prevent horizontal overflow from oversized placeholders */
    .ct_cf7 input[type="text"],
    .ct_cf7 input[type="email"],
    .ct_cf7 select,
    .ct_cf7 textarea,
    .elementor-element-ct_cf7 input[type="text"],
    .elementor-element-ct_cf7 input[type="email"],
    .elementor-element-ct_cf7 select,
    .elementor-element-ct_cf7 textarea {
        width: 100% !important;
        max-width: 100% !important;
        box-sizing: border-box !important;
    }

    /* Submit button: stay readable on small screens, no awkward wrap */
    .elementor-element-ct_cf7 .wpcf7-submit,
    .ct_cf7 .wpcf7-submit {
        width: auto !important;
        white-space: nowrap !important;
    }
}
