/* assets/css/style.css */

/* Ensure form inputs, textareas, and selects have consistent styling */
.form-container input,
.form-container textarea,
.form-container select {
    border: 1px solid #ced4da;
    border-radius: 4px;
    padding: 8px 10px;
    width: 100%;
    box-sizing: border-box;
    font-size: 14px;
}

/* Textarea specific styling */
.form-container textarea {
    resize: vertical;
    min-height: 100px;
}

/* Button hover effect */
.form-container button:hover {
    background-color: #2c3e50;
}

/* Success message styling */
#zarina-response.success {
    color: #28a745;
    background-color: #e6ffe6;
    padding: 10px;
    border-radius: 4px;
    margin-bottom: 20px; /* Increased margin for better spacing above form */
}

/* Error message styling */
#zarina-response.error {
    color: #dc3545;
    background-color: #ffe6e6;
    padding: 10px;
    border-radius: 4px;
    margin-bottom: 20px;
}

/* Ensure form instruction text is styled */
.form-instruction {
    font-size: 1rem;
    color: #333;
    background: #f9f9f9;
    padding: 15px;
    border-radius: 8px;
}

/* View button styling */
#zarina-response.success a {
    margin-top: 10px;
    font-size: 14px;
}

/* Responsive adjustments */
@media (max-width: 768px) {
    .form-container {
        padding: 15px;
    }
    .form-container input,
    .form-container textarea,
    .form-container select {
        font-size: 0.875rem;
    }
    #zarina-response.success a {
        font-size: 0.875rem;
        padding: 8px 16px;
    }
    #zarina-response.success,
    #zarina-response.error {
        margin-bottom: 15px;
    }
}