/* GF's own calendar toggle button sits after the input in legacy markup with no
   overlap positioning rule, so it renders outside the input box. Pull it inside. */
.gform_legacy_markup_wrapper .ginput_container_date {
	position: relative;
	width: fit-content;
}
.gform_legacy_markup_wrapper .ginput_container_date input.datepicker {
	padding-right: 2em;
}
.gform_legacy_markup_wrapper .ginput_container_date .gform-datepicker-toggle {
	position: absolute;
	top: 50%;
	right: 0.5em;
	transform: translateY(-50%);
	margin: 0;
}

.ui-datepicker {
	width: 17em;
	padding: 0.5em 0.5em 0;
	background: #fff;
	border: 1px solid #d4d4d4;
	border-radius: 4px;
	box-shadow: 0 2px 8px rgba(0, 0, 0, 0.15);
	font-family: inherit;
	font-size: 0.9em;
	z-index: 9999 !important;
}
.ui-datepicker .ui-datepicker-header {
	position: relative;
	padding: 0.2em 0;
}
.ui-datepicker .ui-datepicker-title {
	margin: 0 2.3em;
	line-height: 1.8em;
	text-align: center;
	font-weight: 600;
}
.ui-datepicker .ui-datepicker-prev,
.ui-datepicker .ui-datepicker-next {
	position: absolute;
	top: 0;
	width: 1.8em;
	height: 1.8em;
	cursor: pointer;
	display: flex;
	align-items: center;
	justify-content: center;
	border-radius: 3px;
}
.ui-datepicker .ui-datepicker-prev {
	left: 0;
}
.ui-datepicker .ui-datepicker-next {
	right: 0;
}
.ui-datepicker .ui-datepicker-prev-hover,
.ui-datepicker .ui-datepicker-next-hover {
	background: #f0f0f0;
}

/* Replace the "Prev"/"Next" text with simple CSS arrows. */
.ui-datepicker .ui-datepicker-prev span,
.ui-datepicker .ui-datepicker-next span {
	display: block;
	width: 0;
	height: 0;
	font-size: 0;
	text-indent: -9999px;
	border-style: solid;
}
.ui-datepicker .ui-datepicker-prev span {
	border-width: 5px 6px 5px 0;
	border-color: transparent #666 transparent transparent;
}
.ui-datepicker .ui-datepicker-next span {
	border-width: 5px 0 5px 6px;
	border-color: transparent transparent transparent #666;
}
.ui-datepicker .ui-datepicker-prev-hover span,
.ui-datepicker .ui-datepicker-next-hover span {
	border-color: transparent #1a1a1a transparent transparent;
}
.ui-datepicker .ui-datepicker-next-hover span {
	border-color: transparent transparent transparent #1a1a1a;
}
.ui-datepicker .ui-datepicker-prev.ui-state-disabled,
.ui-datepicker .ui-datepicker-next.ui-state-disabled {
	cursor: default;
}
.ui-datepicker .ui-datepicker-prev.ui-state-disabled span,
.ui-datepicker .ui-datepicker-next.ui-state-disabled span {
	border-color: transparent #ccc transparent transparent;
}
.ui-datepicker .ui-datepicker-next.ui-state-disabled span {
	border-color: transparent transparent transparent #ccc;
}
.ui-datepicker select.ui-datepicker-month,
.ui-datepicker select.ui-datepicker-year {
	margin: 0 2px;
}
.ui-datepicker table {
	width: 100%;
	font-size: 0.9em;
	border-collapse: collapse;
	margin: 0 0 0.4em;
}
.ui-datepicker th {
	padding: 0.5em 0.3em;
	text-align: center;
	font-weight: 600;
	border: 0;
}
.ui-datepicker td {
	border: 0;
	padding: 1px;
}
.ui-datepicker td span,
.ui-datepicker td a {
	display: block;
	padding: 0.4em;
	text-align: center;
	text-decoration: none;
	border-radius: 3px;
	color: #333;
}
.ui-datepicker td a.ui-state-default {
	background: transparent;
}
.ui-datepicker td a.ui-state-hover {
	background: #f0f0f0;
}
.ui-datepicker td a.ui-state-active {
	background: #1a1a1a;
	color: #fff;
}
.ui-datepicker td.ui-datepicker-today a {
	border: 1px solid #1a1a1a;
}
.ui-datepicker td span.ui-state-disabled,
.ui-datepicker td.ui-datepicker-unselectable span {
	color: #ccc;
	cursor: default;
}
.ui-datepicker .ui-datepicker-buttonpane {
	padding: 0.4em 0;
	border-top: 1px solid #eee;
}
