body {
    font-family: 'Arial', sans-serif;
}

.section {
    padding: 40px 0; /* Space around the section */
}

.card {
    border: none; /* Remove default card border */
    border-radius: 8px; /* Rounded corners */
    box-shadow: 0 2px 10px rgba(0, 0, 0, 0.1); /* Subtle shadow */
}

.card-header {
    background-color: #007bff; /* Primary color */
    color: black; /* White text */
    font-family: 'Times New Roman', Times, serif;
    border-top-left-radius: 8px; /* Rounded top left corner */
    border-top-right-radius: 8px; /* Rounded top right corner */
    padding: 15px; /* Padding for header */
}

.card-body {
    background-color: #ffffff; /* White background for form */
    padding: 20px; /* Padding for body */
}

.form-group {
    margin-bottom: 20px; /* Space between form groups */
}

.form-group label {
    font-weight: bold; /* Bold labels for emphasis */
    margin-bottom: 0; /* Remove bottom margin to align with inputs */
}

.form-group.row {
    display: flex; /* Use flexbox for alignment */
    align-items: center; /* Center items vertically */
}

.form-control {
    border: 1px solid #ced4da; /* Default border */
    border-radius: 5px; /* Slightly rounded corners */
    padding: 10px; /* Padding inside inputs */
}

.form-control:focus {
    border-color: #007bff; /* Change border color on focus */
    box-shadow: 0 0 5px rgba(0, 123, 255, 0.5); /* Add focus shadow */
}

.text-center {
    margin-top: 20px; /* Space above button */
}

.btn-primary {
    background-color: #007bff; /* Primary button color */
    border: none; /* Remove button border */
    padding: 10px 20px; /* Button padding */
    border-radius: 5px; /* Rounded button corners */
    transition: background-color 0.3s; /* Smooth background transition */
}

.btn-primary:hover {
    background-color: #0056b3; /* Darker shade on hover */
}

#availability_message {
    color: #dc3545; /* Danger color for messages */
    font-weight: bold; /* Bold text for emphasis */
    margin-top: 10px; /* Space above the message */
}

.modal-content {
    border-radius: 8px; /* Rounded modal corners */
}

.modal-header {
    background-color: #007bff; /* Primary color for modal header */
    color: white; /* White text */
}