/**
 * Laadt strikt ná frontend.css als aparte stylesheet.
 * Maximale compatibiliteit met Divi/Oxygen/Astra Gravity-thema’s enz.
 *
 * @package GF_Call_Scheduler
 */

html body div.ginput_container.gfcs-widget.gfcs-widget--isolate,
html body .gfield .ginput_container.gfcs-widget.gfcs-widget--isolate {
	width: 100% !important;
	max-width: 900px !important;
	box-sizing: border-box !important;
	position: relative !important;
	clear: both !important;
	display: flex !important;
	flex-direction: column !important;
	gap: 1rem !important;
	float: none !important;
	min-width: 0 !important;
}

html body div.gfcs-widget--isolate .gfcs-widget__shell {
	width: 100% !important;
	max-width: none !important;
	box-sizing: border-box !important;
	position: relative !important;
}

html body div.gfcs-widget--isolate .gfcs-widget__panels {
	display: grid !important;
	grid-template-columns: minmax(0, 1fr) minmax(0, 1.05fr) !important;
	gap: 1.2rem !important;
	align-items: start !important;
	width: 100% !important;
	margin: 0 !important;
	padding: 0 !important;
	flex: none !important;
	box-sizing: border-box !important;
}

html body div.gfcs-widget--isolate .gfcs-widget__calendar-col {
	display: flex !important;
	flex-direction: column !important;
	gap: 0.75rem !important;
	min-width: 0 !important;
	width: 100% !important;
}

html body div.gfcs-widget--isolate .gfcs-date-display {
	display: flex !important;
	flex-flow: row nowrap !important;
	align-items: stretch !important;
	width: 100% !important;
}

html body div.gfcs-widget--isolate .gfcs-cal__month-year-row {
	display: grid !important;
	grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
	width: 100% !important;
}
@media screen and (max-width: 680px) {
	html body div.gfcs-widget--isolate .gfcs-widget__panels {
		grid-template-columns: 1fr !important;
	}
}

html body div.gfcs-widget--isolate .gfcs-widget__calendar,
html body div.gfcs-widget--isolate .gfcs-widget__slots {
	min-width: 0 !important;
	width: 100% !important;
	max-width: none !important;
	flex: none !important;
	box-sizing: border-box !important;
	float: none !important;
	clear: none !important;
	position: relative !important;
	left: auto !important;
	transform: none !important;
	display: flex !important;
	flex-direction: column !important;
}

html body div.gfcs-widget--isolate .gfcs-widget__slots {
	min-height: 280px !important;
	max-height: 490px !important;
}

html body div.gfcs-widget--isolate .gfcs-widget__slots-grid {
	display: grid !important;
	grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
	gap: 0.45rem !important;
	width: 100% !important;
	align-content: start !important;
	flex: 1 !important;
}

html body div.gfcs-widget--isolate .gfcs-widget__slots-head {
	display: flex !important;
	flex-direction: column !important;
	gap: 0.45rem !important;
	width: 100% !important;
}

html body div.gfcs-widget--isolate .gfcs-widget__slots-nav-row {
	display: flex !important;
	flex-direction: row !important;
	align-items: center !important;
	justify-content: space-between !important;
	width: 100% !important;
	flex-wrap: nowrap !important;
}

html body div.gfcs-widget--isolate .gfcs-cal__toolbar {
	display: flex !important;
	flex-direction: row !important;
	flex-wrap: nowrap !important;
	align-items: center !important;
	justify-content: space-between !important;
	width: 100% !important;
	box-sizing: border-box !important;
}

html body div.gfcs-widget--isolate .gfcs-cal__month {
	flex: 1 !important;
	text-align: center !important;
	min-width: 0 !important;
}

html body div.gfcs-widget--isolate .gfcs-cal__grid {
	display: flex !important;
	flex-direction: column !important;
	width: 100% !important;
}

html body div.gfcs-widget--isolate .gfcs-cal__days-panel {
	display: flex !important;
	flex-direction: column !important;
	width: 100% !important;
	box-sizing: border-box !important;
}

html body div.gfcs-widget--isolate .gfcs-cal__weekdays,
html body div.gfcs-widget--isolate .gfcs-cal__row {
	display: grid !important;
	grid-template-columns: repeat(7, minmax(0, 1fr)) !important;
	width: 100% !important;
}

html body div.gfcs-widget--isolate .gfcs-widget__footer {
	display: flex !important;
	flex-flow: row wrap !important;
	align-items: center !important;
	gap: 0.75rem 1.25rem !important;
	width: 100% !important;
	margin: 0 !important;
}

html body div.gfcs-widget--isolate button.gfcs-slot {
	display: inline-flex !important;
	width: 100% !important;
	min-width: 0 !important;
	max-width: none !important;
	float: none !important;
	clear: none !important;
	margin: 0 !important;
	line-height: 1.2 !important;
	white-space: nowrap !important;
}

html body div.gfcs-widget--isolate button.gfcs-slot.is-active {
	background: #1d4ed8 !important;
	border-color: #1e40af !important;
	color: #fff !important;
	box-shadow:
		0 0 0 1px rgba(255, 255, 255, 0.35) inset,
		0 4px 14px rgba(29, 78, 216, 0.35) !important;
}

html body div.gfcs-widget--isolate button.gfcs-clear {
	flex: 0 0 auto !important;
	width: auto !important;
	max-width: none !important;
	float: none !important;
	clear: none !important;
	line-height: 1.3 !important;
}

html body div.gfcs-widget--isolate .gfcs-cal__btn,
html body div.gfcs-widget--isolate .gfcs-cal__nav {
	float: none !important;
	box-sizing: border-box !important;
}
