/* =========================================
   RESPONSIVE FORM UTILITIES
   ========================================= */

/* Form row that stacks on mobile */
.form-row-responsive {
    display: flex;
    gap: 16px;
    flex-wrap: wrap;
}

.form-row-responsive>* {
    flex: 1;
    min-width: 100%;
    /* Force single column by default */
}

@media (min-width: 768px) {
    .form-row-responsive>* {
        min-width: 250px;
        /* Allow side-by-side on desktop */
        flex: 1;
    }
}

/* Form group spacing */
.form-group {
    margin-bottom: 20px;
}

.form-group label {
    display: block;
    margin-bottom: 8px;
    font-weight: 600;
    color: var(--gray-800);
    font-size: 14px;
}

/* Responsive input sizing */
@media (max-width: 640px) {

    .login-input,
    input[type="text"],
    input[type="email"],
    input[type="tel"],
    input[type="number"],
    input[type="date"],
    select,
    textarea {
        font-size: 16px !important;
        /* Prevents zoom on iOS */
    }
}