/* Form Responsive Styling - Extracted from responsive.css */

/* Tablet Forms (max-width: 768px) */
@media (max-width: 768px) {
    .pf-field-item input {
        padding: 14px 16px;
    }
    
    .pf-submit-btn {
        padding: 14px 16px;
    }
    
    /* Tablet placeholder text optimization */
    .pf-field-item input::placeholder {
        color: #777 !important;      /* Between desktop and mobile contrast */
        font-size: 14px !important;  /* Match input font-size for tablets */
        font-weight: 500 !important; /* Improved visibility */
    }
    
    .pf-contact-form {
        padding: 1.5rem;
        margin-left: -4rem; /* Compensate increased padding for full-width form */
        margin-right: -4rem;
    }
}

/* Mobile Forms (max-width: 480px) */
@media (max-width: 480px) {
    .pf-field-item input {
        padding: 12px 14px;
        font-size: 13px;
    }
    
    .pf-submit-btn {
        padding: 12px 14px;
        font-size: 13px;
    }
    
    /* Mobile placeholder text optimization - better visibility */
    .pf-field-item input::placeholder {
        color: #666 !important;      /* Darker for better visibility */
        font-size: 13px !important;  /* Match input font-size */
        font-weight: 500 !important; /* Slightly bolder for better contrast */
    }
    
    .pf-contact-form {
        margin-left: -4.5rem; /* Compensate for increased padding */
        margin-right: -4.5rem;
        padding: 1.25rem !important; /* Smaller form padding on mobile */
    }
    
    .pf-contact-form h4 {
        font-size: 1.1rem; /* Smaller form title */
        margin-bottom: 1.25rem;
    }
    
    /* Enhanced form touch targets for mobile */
    .pf-form input[type="text"],
    .pf-form input[type="email"],
    .pf-form textarea {
        padding: 14px 18px; /* Larger padding for easier touch */
        font-size: 16px; /* Prevents zoom on iOS */
        min-height: 52px; /* Larger touch targets on mobile */
    }
    
    .pf-form textarea {
        min-height: 100px; /* Larger textarea on mobile */
    }
    
    .pf-form button {
        padding: 16px 24px; /* Ensure button is also touch-optimized */
        font-size: 16px; /* Consistent with inputs */
        min-height: 52px; /* Match input height */
    }
    
    .pf-form label {
        font-size: 0.9rem; /* Slightly smaller labels to save space */
        margin-bottom: 0.4rem; /* Tighter label spacing */
    }
}

/* Very Small Screens (max-width: 360px) */
@media (max-width: 360px) {
    .pf-contact-form {
        margin-left: -4.5rem;
        margin-right: -4.5rem;
    }
}