/* Custom Styles for Contact Form */
.contact-owner {
    background-color: #f9f9f9;
    /* Light background color */
    border: 1px solid #ccc !important;
    /* Border for the form */
    border-radius: 5px;
    /* Rounded corners */
    padding: 20px;
    /* Inner padding */
    box-shadow: 0 2px 10px rgba(0, 0, 0, 0.1);
    /* Subtle shadow */
    max-width: 600px;
    /* Maximum width */
    margin: 0 auto;
    /* Center the form */
    font-family: Arial, sans-serif;
    /* Font style */
}

.contact-owner h2 {
    text-align: center;
    /* Centered heading */
    color: #333;
    /* Heading color */
    margin-bottom: 20px;
    /* Space below heading */
}

.contact-owner label {
    display: block;
    /* Block display for labels */
    margin-bottom: 5px;
    /* Space below label */
    font-weight: bold;
    /* Bold labels */
}

.contact-owner input[type="text"],
.contact-owner input[type="email"],
.contact-owner textarea {
    width: 100%;
    /* Full width */
    padding: 10px;
    /* Inner padding */
    border: 1px solid #ccc;
    /* Border */
    border-radius: 4px;
    /* Rounded corners */
    margin-bottom: 15px;
    /* Space below fields */
    font-size: 16px;
    /* Font size */
    transition: border-color 0.3s;
    /* Transition for border color */
}

.contact-owner input[type="text"]:focus,
.contact-owner input[type="email"]:focus,
.contact-owner textarea:focus {
    border-color: #007bff;
    /* Change border color on focus */
    outline: none;
    /* Remove default outline */
}

.contact-owner button {
    background-color: #007bff;
    /* Button color */
    color: white;
    /* Text color */
    padding: 10px 15px;
    /* Padding */
    border: none;
    /* No border */
    border-radius: 4px;
    /* Rounded corners */
    cursor: pointer;
    /* Pointer on hover */
    transition: background-color 0.3s;
    /* Transition for button color */
    width: 100%;
    /* Full width button */
    font-size: 16px;
    /* Font size */
}

.contact-owner button:hover {
    background-color: #0056b3;
    /* Darker shade on hover */
}

/* Add media query for responsiveness */
@media (max-width: 600px) {
    .contact-owner {
        padding: 15px;
        /* Less padding on small screens */
    }

    .contact-owner h2 {
        font-size: 1.5em;
        /* Smaller heading on small screens */
    }
}