/* --- Global Styles --- */
#booking-form-container {
    display: flex;
    flex-wrap: wrap;
    gap: 20px;
    margin:50px auto;
}
#calendar-section, #tour-form-section {
    flex: 1;
    min-width: 300px;
    padding: 20px;
    border-radius: 8px;
    box-shadow: 0 2px 4px rgba(0,0,0,0.1);
}

#calendar-section h2{
    text-align:center;
}

.post-1477.booking-header-image {
    position: relative;
    height: 300px; /* Adjust height as needed */
    background: url('https://naijafoodtour.com/wp-content/uploads/2025/09/ntf_bannerDark.jpg') no-repeat center center/cover;
    display: flex;
    align-items: center;
    justify-content: center;
    color: white;
    /*text-shadow: 2px 2px 4px rgba(0,0,0,0.5);*/
    border-radius: 8px;
    margin-bottom: 20px;
}

.booking-title-overlay {
    z-index: 10;
    font-size: 3em;
    font-weight: bold;
}

.post-1477 h1.entry-title{
    color:#FFF !important;    
}


#calendar {
    width: 100%;
    max-width: 400px;
    margin: 0 auto;
    font-family: Arial, sans-serif;
    padding: 15px; /* Added padding */
    border: 1px solid #ccc; /* Added border */
    border-radius: 8px; /* Added border-radius */
}
.calendar-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 10px 0;
    font-size: 1.2em;
}
.nav-btn {
    cursor: pointer;
    font-size: 2em;
    color: #215E00; /* Set icon color */
}
.weekdays {
    display: grid;
    grid-template-columns: repeat(7, 1fr);
    text-align: center;
    font-weight: bold;
    color: white; /* Changed weekday text color to white */
    background-color: #215E00; /* Added background color to weekday row */
    padding: 5px 0; /* Added padding */
}
.days {
    display: grid;
    grid-template-columns: repeat(7, 1fr);
    gap: 5px;
    text-align: center;
}
.day {
    padding: 10px;
    cursor: pointer;
    border-radius: 4px;
    transition: background-color 0.2s ease;
}
.day:hover:not(.disabled) {
    background-color: #e0e0e0;
}
.day.selected {
    background-color: #215E00 !important;
    color: #fff;
    font-weight: bold;
}
.day.disabled {
    color: #ccc;
    cursor: not-allowed;
}

/* --- Form Styles --- */
#tour-form-section h2 {
    text-align: center;
    margin-bottom: 20px;
}
#selected-date-display {
    font-weight: bold;
    text-align: center;
    margin-bottom: 20px;
}
.form-group {
    margin-bottom: 15px;
}
.form-group label {
    display: block;
    margin-bottom: 5px;
    font-weight: bold;
}
.form-group input,
.form-group select {
    width: 100%;
    padding: 10px;
    border: 1px solid #ccc;
    border-radius: 4px;
}
.form-note {
    font-size: 0.9em;
    color: #666;
    margin-top: 5px;
}
#submit-button {
    width: 100%;
    padding: 10px;
    background-color: #215E00;
    color: white;
    border: none;
    border-radius: 4px;
    font-size: 1.1em;
    cursor: pointer;
    transition: background-color 0.2s ease;
}
#submit-button:hover {
    background-color: #000;
}
#form-message {
    text-align: center;
}
.user-info-section {
    border-top: 1px solid #ddd;
    padding-top: 20px;
    margin-top: 20px;
}

/* --- Calendar Day Availability Colors --- */

/* Green for available days */
.day:not(.disabled):not(.fully-booked-all):not(.fully-booked-partial) {
    background-color: #e8f5e9; /* Light Green */
}
.day:not(.disabled):not(.fully-booked-all):not(.fully-booked-partial):hover {
    background-color: #c8e6c9;
}

/* Orange for partially booked days */
.day.fully-booked-partial {
    background-color: #ffcc80; /* Light Orange */
    color: #333;
    font-weight: bold;
}
.day.fully-booked-partial:hover {
    background-color: #ffb74d;
}


/* Red for fully booked days */
.day.fully-booked-all {
    background-color: #ef9a9a; /* Light Red */
    color: #333;
    font-weight: bold;
    text-decoration: line-through;
}

/* Make the cursor a question mark on hover to indicate a tooltip is available */
.day[title]:not(.disabled) {
    cursor: help;
}