
/* Mobile overflow fix + responsive improvements */

*{
box-sizing:border-box;
}

.availability-section{
padding:80px 16px;
background:#f7f4ec;
text-align:center;
font-family:Arial, Helvetica, sans-serif;
overflow-x:hidden;
}

.calendar-container{
max-width:1000px;
width:100%;
height: 100%;
margin:auto;
background:white;
padding:24px;
border-radius:14px;
box-shadow:0 20px 40px rgba(0,0,0,0.1);
}

.calendar-header{
display:flex;
justify-content:space-between;
align-items:center;
margin-bottom:18px;
}

.availability-header p{
    color: #666;
}
.availability-header h2{
    font-family:'Playfair Display', serif;
font-size:42px;
color:#b8963d;
margin:10px 0;
}

.availability-tag{
font-size:12px;
letter-spacing:3px;
text-transform:uppercase;
color:#b8963d;

}

.calendar-header h3{
font-size:18px;
margin:0;
}

.calendar-header button{
background:#b8963d;
border:none;
color:white;
padding:8px 14px;
border-radius:6px;
cursor:pointer;
flex-shrink:0;
}

.calendar-grid{
display:grid;
grid-template-columns:repeat(7,minmax(0,1fr));
gap:6px;
width:100%;
height: 500px;
}

.day{
padding:10px 0;
border-radius:8px;
cursor:pointer;
background:#eee;
font-size:14px;
transition:0.2s;
}

.available{background:#e6f7ea;}
.occupied{background:#f3c6c6;cursor:not-allowed;}
.past{background:#ddd;color:#999;cursor:not-allowed;}
.selected{background:#b8963d;color:white;}

/* Reservation form */

.reserve-form{
max-width:900px;
width:100%;
margin:32px auto;
background:white;
padding:28px;
border-radius:14px;
box-shadow:0 20px 40px rgba(0,0,0,0.1);
text-align:left;
}

.reserve-title{
margin-bottom:16px;
font-size:20px;
color:#b8963d;
}

.form-grid{
display:grid;
grid-template-columns:1fr 1fr;
gap:16px;
}

.form-group{
display:flex;
flex-direction:column;
font-size:14px;
}

.form-group.full{
grid-column:1 / -1;
}

.reserve-form input,
.reserve-form select,
.reserve-form textarea{
margin-top:4px;
padding:10px;
border-radius:6px;
border:1px solid #ccc;
font-size:14px;
}

.reserve-btn{
margin-top:18px;
padding:12px 24px;
border-radius:25px;
background:linear-gradient(135deg,#d4b15a,#b8963d);
color:white;
border:none;
cursor:pointer;
font-size:14px;
}

/* Mobile adjustments */

@media(max-width:600px){

.calendar-grid{
    height: 300px;
}

.calendar-container{
padding:18px;
}

.day{
font-size:13px;
padding:8px 0;
}

.form-grid{
grid-template-columns:1fr;
}

.reserve-form{
padding:22px;
}

}