/**
 * Form Expand - Collapsed/Expanded States
 * Simple max-height animation
 */

/* Promocode field always hidden */
.main-form #wpforms-547-field_12-container {
    display: none !important;
}

/* ===========================================
   FIELDS LAYOUT
   =========================================== */

.main-form .wpforms-field-container {
    display: grid !important;
    grid-template-columns: repeat(4, 1fr) !important;
    gap: 20px !important;
}

.main-form .wpforms-field-container > div {
    width: 100% !important;
}

/* ===========================================
   EXPANDABLE WRAPPER
   =========================================== */

.main-form .form-expandable-wrapper {
    grid-column: 1 / -1;
    display: grid !important;
    grid-template-columns: repeat(4, 1fr) !important;
    gap: 20px !important;
    max-height: 0;
    overflow: hidden;
    opacity: 0;
    transition: max-height 0.5s ease, opacity 0.4s ease;
}

.main-form-expanded .form-expandable-wrapper {
    max-height: 300px;
    opacity: 1;
}

/* ===========================================
   SUBMIT BUTTON
   =========================================== */

.main-form .wpforms-submit-container {
    width: 100%;
    max-height: 0;
    overflow: hidden;
    opacity: 0;
    transition: max-height 0.5s ease 0.1s, opacity 0.4s ease 0.1s, margin-top 0.5s ease;
    margin-top: 0;
}

.main-form-expanded .wpforms-submit-container {
    max-height: 60px;
    opacity: 1;
    margin-top: 10px;
}

/* Responsive: 2 columns on tablets */
@media (max-width: 992px) {
    .main-form .wpforms-field-container,
    .main-form .form-expandable-wrapper {
        grid-template-columns: repeat(2, 1fr) !important;
    }

    .main-form-expanded .form-expandable-wrapper {
        max-height: 400px;
    }
}

/* Responsive: 1 column on mobile */
@media (max-width: 576px) {
    .main-form .wpforms-field-container,
    .main-form .form-expandable-wrapper {
        grid-template-columns: 1fr !important;
    }

    .main-form-expanded .form-expandable-wrapper {
        max-height: 600px;
    }
}
