Gravity Forms DatePicket styling

gf-datepicker.scss

// General GF Date Picker - based on https://jboullion.com/gravity-forms-date-picker-styling
#ui-datepicker-div {
	background: $white !important;
	border: 1px solid $medium-gray !important;
	border-radius: 0 !important;
	display: none;
	padding: rem-calc(20) !important;
	width: rem-calc(280) !important;
	text-shadow: none !important;
	box-shadow: none !important;

	.ui-datepicker-header {
		background: $white !important;
		text-shadow: none;
		border-width: 0;
	}


	.ui-icon {
		color: transparent;
		cursor: pointer;
		font-size: 0px;
	}
	.ui-icon:before {
		color: $forest;
		font-family: 'Font Awesome 5 Free' !important;
		font-weight: 900 !important;
		font-size: rem-calc(18);
	}

	.ui-datepicker-prev {
		float: left !important;
		width: 10% !important;
		background-image: none !important;
		line-height: 300% !important;
	
		.ui-icon:before {
			content: "\f053";
		}
		&.ui-state-disabled {
			display:none;
		}
	}

	.ui-datepicker-next {
		float: right !important;
		width: 10% !important;
		background-image: none !important;
		line-height: 300% !important;

		.ui-icon:before {
			content: "\f054";
			float: right !important;
		}
		&.ui-state-disabled {
			display:none;
		}
	}

	.ui-datepicker-title { 
		select {
			float: left !important;
			width: 70% !important;
		}

		.ui-datepicker-month {
			margin: 0px 5% 6px !important;
		}
		.ui-datepicker-year {
			margin: 0px 15% 6px !important;
		}
	}


	table { 
		width: 100% !important;
		background-color: $white !important;

		thead {
			background-color: $white !important;
			border-width: 0 !important;
			font-family: $header-font-family !important;
			font-weight: $global-weight-normal !important;
			

			th {
				font-size: rem-calc(14) !important;
				color: $secondary-color !important;
			}
		}

		tr {
			background-color: $white !important;
			border-width: 0 !important;
		}
		td, th { 
			text-align: center !important;
			border-width: 0 !important;
		}
		td {  
			a {
				display: block;
				padding: rem-calc(5) !important;
			}
		}
	} 

	.ui-datepicker-calendar {
		.ui-state-default {
			background: $white !important;
			color: $primary-color !important;
			font-family: $header-font-family !important;
			font-weight: $global-weight-bold !important;
			font-size: rem-calc(16) !important;
			&:hover {
				color: $medium-gray !important;
			}
		}
		.ui-state-highlight {
			color: $secondary-color !important;
		}
		.ui-datepicker-unselectable, .ui-state-disabled {
			background: $white !important;
		}
	}

}