*{
	--hutcal-color: white;
	--hutcal-border-color: rgba(0,0,0,0.3);
	--hutcal-select-color: #ff821b;
	--hutcal-hover-color: rgb(221 221 241);
	--hutcal-weekend-color: #e0e0e0;
}

#hutbook-calendar{
	position: relative;
}

#hutbook-calendar.changing:after{
	content:'';
	position: absolute;
	left:0;
	right:0;
	top:0;
	bottom:0;
	background-color: rgba(255,255,255,0.8);
	transition: all 0.3s;
	background-image: url(../img/loading.gif);
	background-repeat: no-repeat;
	background-position: 50% 50%;

}

#hutbook-calendar .main .dates{
	display:flex;
	flex-direction: row;
    flex-wrap: wrap;
    background-color: var(--hutcal-border-color);
    padding:1px;
    gap:1px;

}

#hutbook-calendar .dayheaders{
	background-color: var(--hutcal-border-color);
	padding:1px 1px 0 1px;
	gap:1px;
}
#hutbook-calendar .dayheaders .day{
	background-color: var(--hutcal-color);
	flex:1;
	display:flex;
	justify-content: center;
    align-items: center;
    padding:5px;
}

#hutbook-calendar .header{
	justify-content: space-between;
	background-color: var(--hutcal-border-color);
	padding:1px 1px 0 1px;
	gap:1px;
}

#hutbook-calendar .header .left,
#hutbook-calendar .header .right{
	width:5%;
	background-color: rgb(237 237 237);
	display: flex;
	align-items: center;
    justify-content: center;
    cursor: pointer;
    
}

#hutbook-calendar .header svg{
	width:10px;
	height:auto;
	fill:rgba(0,0,0,0.5);
}

#hutbook-calendar .header .mid{
	background-color: var(--hutcal-color);
	width: 90%;
	display:flex;
	align-items: center;
    justify-content: center;
    padding:10px;
}
#hutbook-calendar .header .mid h3{
	font-size: 1.1rem;
	padding:0;
	margin:0;
}

#hutbook-calendar .main .dates .week{
	display:flex;
	width:100%;
	gap:1px;
	position: relative;
}
#hutbook-calendar-outer:not(.administrativemode) #hutbook-calendar .main .dates .week.booked:after,
#hutbook-calendar-outer:not(.administrativemode) #hutbook-calendar .main .dates .week.unavailable:after{
	content: 'Unavailable';
	position: absolute;
	left:0;
	right:0;
	top:0;
	bottom:0;
	background-color: rgba(255,255,255,0.7);
	display:flex;
	align-items: center;
    justify-content: center;
}

#hutbook-calendar .main .dates .week .adminbookingdetails{
	position: absolute;
	left:0;
	right:0;
	top:0;
	bottom:0;
	background-color: rgba(255,255,255,0.7);
	display:flex;
	align-items: center;
    justify-content: center;
}
#hutbook-calendar .main .dates .week .adminbookingdetails a{
	text-decoration: none;
	//font-size: 1.1rem;
	font-weight: bold;
}

#hutbook-calendar-outer:not(.administrativemode) #hutbook-calendar .main .dates .week.available:not(.selected):hover .day{
	background-color: var(--hutcal-hover-color) !important;
	cursor: pointer;
}

#hutbook-calendar .main .dates .week .day.sat,
#hutbook-calendar .main .dates .week .day.sun{
	background-color: var(--hutcal-weekend-color);
}

#hutbook-calendar .main .dates .week.selected .day{
	background-color: var(--hutcal-select-color);
}

#hutbook-calendar .main .dates .week .day{
	flex: 1;
	background-color: var(--hutcal-color);
	aspect-ratio: 8/6;
	padding:5px;
	display:flex;
	flex-direction: row-reverse;
	transition: all 0.2s;
	/*position: relative;*/

}
#hutbook-calendar .main .dates .week .day.previous .number,
#hutbook-calendar .main .dates .week .day.next .number{
	
	color: rgba(0,0,0,0.42);
}

#hutbook-calendar .main .dates .week .day .number{
	line-height: 1em;
	font-weight: bold;
}

#hut-booking-user-form{
	display:flex;
	flex-direction: column;
    flex-wrap: nowrap;
    row-gap: 10px;
    max-width:600px;
    margin: 0 auto;
}

#hut-booking-user-form #hutbook-date-select{
	display:flex;
	flex-direction: row;
    flex-wrap: nowrap;
    gap: 10px;
}

#hut-booking-user-form #hbbookingdata{
	display:flex;
	flex-direction: column;
    flex-wrap: nowrap;
    row-gap: 10px;
}

#hut-booking-user-form #hbbookingdata .btn.btn-primary{
	padding:20px 10px;
}

#hut-booking-user-form #hbbookingdata label{
	font-weight: bold;
}

#hut-booking-user-form #hbbookingdata .field.address{
	display:flex;
	flex-direction: column;
    flex-wrap: nowrap;
    row-gap: 10px;
}

#hut-booking-user-form #hbbookingdata .field.address .form-group{
	display:flex;
    align-items: center;
    justify-content: center;
    flex-wrap: nowrap;
    flex-direction: row;
}

#hut-booking-user-form #hbbookingdata .field.address .form-group label.sub{
	font-weight: normal;
	font-size: 0.8rem;
	width:20%;
}

#hut-booking-user-form #hutbook-calendar-data-title{

	font-weight: bold;
}

#hut-booking-user-form #hutbook-calendar-data{
	display:flex;
	flex-direction: column;
    flex-wrap: nowrap;
    row-gap: 5px;
}
#hut-booking-user-form #hutbook-calendar-data .hutcaldata{
	border: 1px solid rgba(0,0,0,0.3);
	padding: 10px 20px;
	border-radius: 4px;
	background-color: var(--hutcal-select-color);
	font-weight: bold;
}

body.wp-admin #hutbook-date-select{
	display:flex;
    flex-direction: row;
    flex-wrap: nowrap;
    gap: 10px;
    padding-bottom: 10px;
}

#hut-booking-submitted{
	background-color: var(--hutcal-select-color);
    display: flex;
    flex-direction: column;
    flex-wrap: nowrap;
    justify-content: center;
    align-items: center;
    border-radius: 10px;
    padding: 30px;
    font-size: 1.2rem;
}