/*
Theme Name:   Hello Elementor Child
Theme URI:    https://elementor.com/
Description:  Hello Elementor Child Theme
Author:       Elementor Team
Author URI:   https://elementor.com/
Template:     hello-elementor
Version:      1.0.0
Text Domain:  hello-elementor-child
*/

/* ==========================================================================
   Flatpickr Modern Styling Overrides
   ========================================================================== */

/* Flatpickr Calendar container */
.flatpickr-calendar.frm-datepicker.with_frm_style:not(.frm-datepicker-custom-theme) {
	background: #ffffff !important;
	border: 1px solid rgba(7, 101, 72, 0.15) !important;
	border-radius: 16px !important;
	box-shadow: 0 10px 30px -5px rgba(0, 0, 0, 0.08), 0 8px 12px -6px rgba(0, 0, 0, 0.05) !important;
	padding: 16px 16px 12px 16px !important;
	box-sizing: border-box !important;
	font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif !important;
}

.flatpickr-calendar.frm-datepicker.with_frm_style:not(.frm-datepicker-custom-theme).arrowTop {
	margin-top: 8px !important;
}
.flatpickr-calendar.frm-datepicker.with_frm_style:not(.frm-datepicker-custom-theme).arrowBottom {
	margin-top: -8px !important;
}
.flatpickr-calendar.frm-datepicker.with_frm_style:not(.frm-datepicker-custom-theme).arrowTop:before {
	border-bottom-color: rgba(7, 101, 72, 0.15) !important;
}
.flatpickr-calendar.frm-datepicker.with_frm_style:not(.frm-datepicker-custom-theme).arrowTop:after {
	border-bottom-color: #ffffff !important;
}
.flatpickr-calendar.frm-datepicker.with_frm_style:not(.frm-datepicker-custom-theme).arrowBottom:before {
	border-top-color: rgba(7, 101, 72, 0.15) !important;
}
.flatpickr-calendar.frm-datepicker.with_frm_style:not(.frm-datepicker-custom-theme).arrowBottom:after {
	border-top-color: #ffffff !important;
}

/* Flatpickr Header Month / Year Selects */
.flatpickr-calendar.frm-datepicker.with_frm_style:not(.frm-datepicker-custom-theme) .flatpickr-months {
	border-bottom: 1px solid rgba(0, 0, 0, 0.05) !important;
	padding-bottom: 12px !important;
	margin-bottom: 12px !important;
}

.flatpickr-calendar.frm-datepicker.with_frm_style:not(.frm-datepicker-custom-theme) .flatpickr-current-month {
	font-size: 14px !important;
	font-weight: 600 !important;
	color: #1f2937 !important;
}

.flatpickr-calendar.frm-datepicker.with_frm_style:not(.frm-datepicker-custom-theme) .flatpickr-monthDropdown-months {
	font-size: 14px !important;
	font-weight: 600 !important;
	color: #1f2937 !important;
	border: 1px solid rgba(0, 0, 0, 0.08) !important;
	border-radius: 6px !important;
	padding: 4px 8px !important;
	background: #f9fafb !important;
	cursor: pointer !important;
	outline: none !important;
	transition: all 0.2s !important;
}

.flatpickr-calendar.frm-datepicker.with_frm_style:not(.frm-datepicker-custom-theme) .flatpickr-monthDropdown-months:hover {
	background-color: #f3f4f6 !important;
	border-color: #076548 !important;
}

/* Flatpickr Next/Prev month buttons */
.flatpickr-calendar.frm-datepicker.with_frm_style:not(.frm-datepicker-custom-theme) .flatpickr-prev-month,
.flatpickr-calendar.frm-datepicker.with_frm_style:not(.frm-datepicker-custom-theme) .flatpickr-next-month {
	top: 14px !important;
	width: 28px !important;
	height: 28px !important;
	display: flex !important;
	align-items: center !important;
	justify-content: center !important;
	cursor: pointer !important;
	border-radius: 6px !important;
	background: #ffffff !important;
	border: 1px solid rgba(0, 0, 0, 0.08) !important;
	transition: all 0.2s !important;
}

.flatpickr-calendar.frm-datepicker.with_frm_style:not(.frm-datepicker-custom-theme) .flatpickr-prev-month:hover,
.flatpickr-calendar.frm-datepicker.with_frm_style:not(.frm-datepicker-custom-theme) .flatpickr-next-month:hover {
	background: rgba(7, 101, 72, 0.05) !important;
	border-color: rgba(7, 101, 72, 0.3) !important;
}

.flatpickr-calendar.frm-datepicker.with_frm_style:not(.frm-datepicker-custom-theme) .flatpickr-prev-month svg,
.flatpickr-calendar.frm-datepicker.with_frm_style:not(.frm-datepicker-custom-theme) .flatpickr-next-month svg {
	fill: #076548 !important;
}

/* Weekday Columns */
.flatpickr-calendar.frm-datepicker.with_frm_style:not(.frm-datepicker-custom-theme) span.flatpickr-weekday {
	font-size: 11px !important;
	font-weight: 600 !important;
	text-transform: uppercase !important;
	color: #9ca3af !important;
}

/* Individual Days */
.flatpickr-calendar.frm-datepicker.with_frm_style:not(.frm-datepicker-custom-theme) .flatpickr-day {
	border-radius: 8px !important;
	font-size: 13px !important;
	font-weight: 500 !important;
	color: #374151 !important;
	border: none !important;
	max-width: 36px !important;
	height: 36px !important;
	line-height: 36px !important;
	transition: all 0.15s ease-in-out !important;
}

/* Hover Day */
.flatpickr-calendar.frm-datepicker.with_frm_style:not(.frm-datepicker-custom-theme) .flatpickr-day:hover,
.flatpickr-calendar.frm-datepicker.with_frm_style:not(.frm-datepicker-custom-theme) .flatpickr-day:focus {
	background-color: rgba(7, 101, 72, 0.08) !important;
	color: #076548 !important;
}

/* Selected Active Day */
.flatpickr-calendar.frm-datepicker.with_frm_style:not(.frm-datepicker-custom-theme) .flatpickr-day.selected,
.flatpickr-calendar.frm-datepicker.with_frm_style:not(.frm-datepicker-custom-theme) .flatpickr-day.startRange,
.flatpickr-calendar.frm-datepicker.with_frm_style:not(.frm-datepicker-custom-theme) .flatpickr-day.endRange {
	background-color: #076548 !important;
	color: #ffffff !important;
	font-weight: 600 !important;
	box-shadow: 0 4px 6px -1px rgba(7, 101, 72, 0.3), 0 2px 4px -1px rgba(7, 101, 72, 0.1) !important;
}

/* Range Days Selection */
.flatpickr-calendar.frm-datepicker.with_frm_style:not(.frm-datepicker-custom-theme) .flatpickr-day.inRange {
	background-color: rgba(7, 101, 72, 0.08) !important;
	color: #076548 !important;
	border-radius: 0 !important;
}

/* Today Day Highlight */
.flatpickr-calendar.frm-datepicker.with_frm_style:not(.frm-datepicker-custom-theme) .flatpickr-day.today {
	color: #FB8207 !important;
	font-weight: 700 !important;
	border: 1px solid rgba(251, 130, 7, 0.3) !important;
}

.flatpickr-calendar.frm-datepicker.with_frm_style:not(.frm-datepicker-custom-theme) .flatpickr-day.today:hover {
	background-color: rgba(251, 130, 7, 0.08) !important;
}

.flatpickr-calendar.frm-datepicker.with_frm_style:not(.frm-datepicker-custom-theme) .flatpickr-day.today.selected {
	color: #ffffff !important;
	background-color: #076548 !important;
	border-color: #076548 !important;
}


/* ==========================================================================
   jQuery UI Datepicker Clean Modern UX Styling
   ========================================================================== */

#ui-datepicker-div.with_frm_style {
	background: #ffffff !important;
	border: 1px solid rgba(7, 101, 72, 0.15) !important;
	border-radius: 16px !important;
	box-shadow: 0 10px 30px -5px rgba(0, 0, 0, 0.08), 0 8px 12px -6px rgba(0, 0, 0, 0.05) !important;
	padding: 16px !important;
	width: 310px !important;
	box-sizing: border-box !important;
	font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif !important;
	margin-top: 8px !important;
}

/* Header bar */
#ui-datepicker-div.with_frm_style .ui-datepicker-header {
	background: transparent !important;
	border: none !important;
	position: relative !important;
	padding: 0 0 12px 0 !important;
	display: flex !important;
	align-items: center !important;
	justify-content: space-between !important;
	border-bottom: 1px solid rgba(0, 0, 0, 0.05) !important;
	margin-bottom: 12px !important;
}

/* Title / Select dropdowns */
#ui-datepicker-div.with_frm_style .ui-datepicker-title {
	margin: 0 !important;
	order: 2 !important;
	display: flex !important;
	gap: 6px !important;
	align-items: center !important;
	justify-content: center !important;
	width: 100% !important;
}

#ui-datepicker-div.with_frm_style .ui-datepicker-title select {
	font-size: 14px !important;
	font-weight: 600 !important;
	color: #1f2937 !important;
	border: 1px solid rgba(0, 0, 0, 0.08) !important;
	border-radius: 6px !important;
	padding: 4px 24px 4px 8px !important;
	background: #f9fafb url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='none' viewBox='0 0 20 20'%3E%3Cpath stroke='%23076548' stroke-linecap='round' stroke-linejoin='round' stroke-width='1.5' d='M6 8l4 4 4-4'/%3E%3C/svg%3E") no-repeat right 6px center / 16px !important;
	-webkit-appearance: none !important;
	-moz-appearance: none !important;
	appearance: none !important;
	cursor: pointer !important;
	outline: none !important;
	transition: all 0.2s !important;
	height: auto !important;
	line-height: inherit !important;
	min-height: unset !important;
	width: auto !important;
}

#ui-datepicker-div.with_frm_style .ui-datepicker-title select:hover {
	background-color: #f3f4f6 !important;
	border-color: #076548 !important;
}

/* Navigation Prev/Next */
#ui-datepicker-div.with_frm_style .ui-datepicker-prev,
#ui-datepicker-div.with_frm_style .ui-datepicker-next {
	position: absolute !important;
	top: -2px !important;
	width: 28px !important;
	height: 28px !important;
	display: flex !important;
	align-items: center !important;
	justify-content: center !important;
	cursor: pointer !important;
	border-radius: 6px !important;
	background: #ffffff !important;
	border: 1px solid rgba(0, 0, 0, 0.08) !important;
	transition: all 0.2s !important;
	z-index: 10 !important;
}

#ui-datepicker-div.with_frm_style .ui-datepicker-prev {
	left: 0 !important;
	order: 1 !important;
}

#ui-datepicker-div.with_frm_style .ui-datepicker-next {
	right: 0 !important;
	order: 3 !important;
}

#ui-datepicker-div.with_frm_style .ui-datepicker-prev:hover,
#ui-datepicker-div.with_frm_style .ui-datepicker-next:hover {
	background: rgba(7, 101, 72, 0.05) !important;
	border-color: rgba(7, 101, 72, 0.3) !important;
}

#ui-datepicker-div.with_frm_style .ui-datepicker-prev span,
#ui-datepicker-div.with_frm_style .ui-datepicker-next span {
	display: block !important;
	text-indent: -9999px !important;
	overflow: hidden !important;
	background: none !important;
	width: 16px !important;
	height: 16px !important;
	position: relative !important;
	margin: 0 !important;
	left: auto !important;
	top: auto !important;
}

#ui-datepicker-div.with_frm_style .ui-datepicker-prev span::before,
#ui-datepicker-div.with_frm_style .ui-datepicker-next span::before {
	content: '' !important;
	position: absolute !important;
	top: 50% !important;
	left: 50% !important;
	width: 6px !important;
	height: 6px !important;
	border-top: 2px solid #076548 !important;
	border-left: 2px solid #076548 !important;
	display: block !important;
}

#ui-datepicker-div.with_frm_style .ui-datepicker-prev span::before {
	transform: translate(-30%, -50%) rotate(-45deg) !important;
}

#ui-datepicker-div.with_frm_style .ui-datepicker-next span::before {
	transform: translate(-70%, -50%) rotate(135deg) !important;
}

/* Calendar grid */
#ui-datepicker-div.with_frm_style .ui-datepicker-calendar {
	width: 100% !important;
	border-collapse: collapse !important;
	margin: 0 !important;
}

#ui-datepicker-div.with_frm_style .ui-datepicker-calendar th {
	font-size: 11px !important;
	font-weight: 600 !important;
	text-transform: uppercase !important;
	color: #9ca3af !important;
	padding: 6px 0 !important;
	text-align: center !important;
}

#ui-datepicker-div.with_frm_style .ui-datepicker-calendar td {
	padding: 2px !important;
	text-align: center !important;
}

#ui-datepicker-div.with_frm_style .ui-datepicker-calendar td a {
	display: block !important;
	width: 34px !important;
	height: 34px !important;
	line-height: 34px !important;
	text-align: center !important;
	font-size: 13px !important;
	font-weight: 500 !important;
	color: #374151 !important;
	text-decoration: none !important;
	border-radius: 8px !important;
	border: none !important;
	background: transparent !important;
	transition: all 0.15s ease-in-out !important;
	padding: 0 !important;
	box-sizing: border-box !important;
	margin: 0 auto !important;
}

#ui-datepicker-div.with_frm_style .ui-datepicker-calendar td a:hover {
	background-color: rgba(7, 101, 72, 0.08) !important;
	color: #076548 !important;
}

/* Today highlight */
#ui-datepicker-div.with_frm_style .ui-datepicker-calendar td.ui-datepicker-today a {
	color: #FB8207 !important;
	font-weight: 700 !important;
	position: relative !important;
	border: 1px solid rgba(251, 130, 7, 0.3) !important;
}

#ui-datepicker-div.with_frm_style .ui-datepicker-calendar td.ui-datepicker-today a::after {
	content: '' !important;
	position: absolute !important;
	bottom: 4px !important;
	left: 50% !important;
	transform: translateX(-50%) !important;
	width: 4px !important;
	height: 4px !important;
	background-color: #FB8207 !important;
	border-radius: 50% !important;
}

/* Active selected day */
#ui-datepicker-div.with_frm_style .ui-datepicker-calendar td.ui-datepicker-current-day a,
#ui-datepicker-div.with_frm_style .ui-datepicker-calendar td a.ui-state-active {
	background-color: #076548 !important;
	color: #ffffff !important;
	font-weight: 600 !important;
	box-shadow: 0 4px 6px -1px rgba(7, 101, 72, 0.3), 0 2px 4px -1px rgba(7, 101, 72, 0.1) !important;
	border-color: #076548 !important;
}

#ui-datepicker-div.with_frm_style .ui-datepicker-calendar td.ui-datepicker-current-day a::after {
	background-color: #ffffff !important;
}

/* Disabled / Other month days */
#ui-datepicker-div.with_frm_style .ui-datepicker-calendar td.ui-datepicker-other-month,
#ui-datepicker-div.with_frm_style .ui-datepicker-calendar td.ui-state-disabled {
	opacity: 0.3 !important;
}

#ui-datepicker-div.with_frm_style .ui-datepicker-calendar td.ui-datepicker-unselectable {
	background: transparent !important;
	cursor: default !important;
}
