/*
	Custom CSS
	Please make sure your CSS rules are 
	more particular / have higher priority
	then other page styles
*/

/* Import fonts for the body */
@import url('https://fonts.googleapis.com/css2?family=IBM+Plex+Sans:wght@300;400;600&display=swap');

#events h3 {
	font-family: 'Georgia', serif !important;
	font-weight: 400 !important;
	color: #2c2c2c !important;
	text-transform: uppercase !important;
	letter-spacing: 1.5px !important;
	font-size: 1.4rem !important;
}

#events p.duration, #events div.duration {
	font-family: 'IBM Plex Sans', sans-serif !important;
	font-size: 13px !important;
	color: #93a38c !important; /* Sage Green */
	font-weight: 600 !important;
	letter-spacing: 0.5px !important;
}

#events p.description, #events div.description {
	font-family: 'IBM Plex Sans', sans-serif !important;
	line-height: 1.6 !important;
	color: #4a4a4a !important;
	font-weight: 300 !important;
}

#events .selectedEvent {
	background-color: #ffffff !important;
	border: 1.5px solid #d4a373 !important; /* Ochre Highlight */
	border-radius: 4px !important;
	box-shadow: 0 10px 25px rgba(0,0,0,0.05) !important;
	transition: all 0.3s ease !important;
}

#events input.reserve_time_btn {
	background-color: #93a38c !important; /* Sage Green */
	color: #ffffff !important;
	font-family: 'IBM Plex Sans', sans-serif !important;
	text-transform: uppercase !important;
	font-weight: 600 !important;
	letter-spacing: 1px !important;
	border: none !important;
	padding: 12px 24px !important;
	border-radius: 2px !important;
	cursor: pointer !important;
}

#events input.select_another_btn {
	background-color: transparent !important;
	color: #d4a373 !important;
	border: 1px solid #d4a373 !important;
	font-family: 'IBM Plex Sans', sans-serif !important;
	text-transform: uppercase !important;
	font-weight: 600 !important;
	border-radius: 2px !important;
}

#eventForm #start_date-block-container h3, #eventForm #timeline-container h3 {
	font-family: 'Georgia', serif !important;
	color: #2c2c2c !important;
	text-transform: none !important;
	border-bottom: 1px solid #e5e1d8 !important;
	padding-bottom: 10px !important;
}

#eventForm #save_button {
	background-color: #d4a373 !important; /* Ochre Action Button */
	color: #ffffff !important;
	font-family: 'IBM Plex Sans', sans-serif !important;
	text-transform: uppercase !important;
	font-weight: 600 !important;
	padding: 15px 40px !important;
	border: none !important;
	border-radius: 2px !important;
	cursor: pointer !important;
}

div.ui-widget-content {
	background-color: #f9f7f2 !important; /* Being Bone Background */
	font-family: 'IBM Plex Sans', sans-serif !important;
	border: 1px solid #e5e1d8 !important;
	color: #333333 !important;
}

div.ui-widget-header {
	background: #e5e1d8 !important;
	border: none !important;
	font-family: 'Georgia', serif !important;
	color: #2c2c2c !important;
	text-transform: uppercase !important;
}

#timeline-container table.timeline {
	border-collapse: separate !important;
	border-spacing: 3px !important;
	font-family: 'IBM Plex Sans', sans-serif !important;
}

.timeline td.not_worked_time {
	background-color: #eeebe3 !important;
	border: none !important;
}

.timeline td.free_time {
	background-color: #ffffff !important;
	border: 1px solid #e5e1d8 !important;
	color: #93a38c !important;
	transition: background 0.2s !important;
}

.timeline td.selected_time {
	background-color: #d4a373 !important; /* Ochre Selection */
	border-color: #d4a373 !important;
	color: #ffffff !important;
}

.timeline td.reserved_time {
	background-color: #dcd9d0 !important;
	color: #999999 !important;
	cursor: not-allowed !important;
}

div#loading {
	background-color: rgba(249, 247, 242, 0.9) !important;
	font-family: 'Georgia', serif !important;
	color: #93a38c !important;
	font-style: italic !important;
}

#start_date-block-container .zend_form dt, 
#start_date-block-container .zend_form dt b, 
#start_date-block-container .zend_form dd label {
	font-family: 'IBM Plex Sans', sans-serif !important;
	color: #4a4a4a !important;
	font-weight: 400 !important;
	text-transform: none !important;
}