/* ------------------------------------------------------------ *\
	Variables
\* ------------------------------------------------------------ */

/*  Fallback Colors  */

.widget-search { /* Text */ --primary-color: #337cbc; --secondary-color: #022d72; /*  Select  */ --select-border-color: #848484; /*  Button  */ --btn-bg-color: #337cbc; --btn-color: #fff; --btn-hover-bg-color: transparent; --btn-disabled-color: rgba(255, 255, 255, 0.5); --btn-disabled-bg-color: rgba(51, 124, 188, 0.5); /*  Button secondary  */ --btn-secondary-bg-color: transparent; --btn-secondary-color: #848484; --btn-secondary-hover-bg-color: #848484; /* Popup/Dropdown buttons */ --btn-utility-hover-bg-color: rgba(2, 45, 114, 0.05); /*  Radio  */ --radio-color: #696969; --radio-border-color: #707070; /*  Datepicker  */ --datepicker-selected: #ffa900; --datepicker-available: #f8f9fb; --datepicker-selected-color: #ffa900; --datepicker-available-color: #f8f9fb; --bg-color: #fff; }

/* ------------------------------------------------------------ *\
	Widget
\* ------------------------------------------------------------ */

.widget-search { position: relative; border-radius: 8px; background-color: var(--bg-color, #fff); }

	.widget-search::after { position: absolute; top: 0; left: 0; width: 100%; height: 22px; content: ''; background: linear-gradient(0deg, rgba(255, 255, 255, 1) 0%, rgba(128, 128, 128, 1) 100%); opacity: 0.1; pointer-events: none; z-index: 0; }

	/*  Container/Inner  */

	.widget-search .widget__inner { display: flex; align-items: center; justify-content: space-between; position: relative; }

@media (max-width: 767px) {
	.widget-search { background-color: transparent; }
		.widget-search .widget__inner { display: block; position: relative; margin: 0px 20px; }
	}

/*  Main  */

.widget-search .widget__main { flex: 1; margin-right: 12px; }

@media (max-width: 767px) {
	.widget-search .widget__main { margin-right: 0; }
}

/*  Actions  */

.widget-search .widget__actions { padding-right: 56px; z-index: 1; position: relative; }

@media (max-width: 1023px) {
	.widget-search .widget__actions { padding-right: 10px; }
}

@media (max-width: 767px) {
	.widget-search .widget__actions { margin-top: 20px; padding: 0 15px; text-align: center; }
}

#sw-wrapper[data-orientation="vertical"] .widget-search .widget__inner { display: block; position:relative;}
#sw-wrapper[data-orientation="vertical"] .widget-search .widget__utilities { display: flex; flex-direction: row; gap: 1rem; }

#sw-wrapper[data-orientation="vertical"] .widget-search .widget__utilities { display: flex; flex-direction: column; gap: 1rem; }

#sw-wrapper[data-orientation="vertical"] .widget-search .widget__main,
#sw-wrapper[data-orientation="vertical"] .widget-search .widget__actions { flex-direction: column; align-items: stretch; }
#sw-wrapper[data-orientation="vertical"] .widget-search .widget__actions { margin-top: 1rem; padding: 0 15px; text-align: center; }
#sw-wrapper[data-orientation="vertical"] .widget-search .widget__utilities li + li::before { display:none; }

.widget-search .widget__actions button + button { margin-left: 14px; }

.widget-search .widget__actions button { min-width: 151px; font-size: 16px; line-height: 1.125; }

@media (max-width: 1023px) {
	.widget-search .widget__actions button { min-width: 102px; font-size: 14px; line-height: 1.125; margin-bottom: 20px; }
}

.widget-search .widget__actions--popup { display: flex; align-items: center; justify-content: center; padding-right: 0; }

@media (max-width: 767px) {
	.widget-search .widget__actions--popup { padding: 0; }
}

/*  Utilities  */

.widget-search .widget__utilities { list-style-type: none; padding-left: 0; display: flex; flex-wrap: wrap; margin-bottom: 0px; margin-top: 2px; }

@media (max-width: 767px) {
	.widget-search .widget__utilities { display: block; position: relative; }
}

.widget-search .widget__utilities li { flex: 1; position: relative; height: inherit; display: flex; }

@media (min-width: 768px) {
	.widget-search .widget__utilities li + li::before { position: absolute; top: 12px; bottom: 17px; left: 0; width: 1px; content: ''; background-color: #707070; opacity: 0.32; }
}
@media (max-width: 768px) {
	.widget-search .widget__utilities li { background-color: var(--bg-color, #fff); border-radius: 8px; margin-bottom: 10px; min-height: 67px; }
}
	.widget-search .widget__utilities figure { display: block; margin: 0 20px 0 0; color: var(--primary-color, #337cbc); background-color: currentColor; mask-repeat: no-repeat; mask-position: center center; mask-size: contain; width: 25px; }

		.widget-search .widget__utilities figure img { opacity: 0; }

	.widget-search .widget__utilities li > a,
	.widget-search .widget__utilities li > button { display: flex; align-items: center; outline: none; background-color: transparent; border: none; color: var(--secondary-color, #022d72); font-size: 16px; line-height: 1.375; padding: 28px 20px; transition: background-color 0.4s; width: 100%; text-decoration: none; text-align: left; }

	@media (max-width: 1023px) {
		.widget-search .widget__utilities li > a,
		.widget-search .widget__utilities li > button { padding: 14px 10px; font-size: 14px; }
	}

	.widget-search .widget__utilities li > a:hover,
	.widget-search .widget__utilities li > button:hover,
	.widget-search .widget__utilities > li:hover > a,
	.widget-search .widget__utilities > li:hover > button { background-color: var(--btn-utility-hover-bg-color, rgba(2, 45, 114, 0.05)); }

	.widget-search .widget__utilities li:hover .widget__dropdown { /* opacity: 1;
	pointer-events: auto; */ }

	.widget-search .widget__dropdown.is-open { opacity: 1; pointer-events: auto; }

	/*  Buttons */

.widget-search .widget__button { outline: none; background-color: var(--btn-bg-color, #337cbc); border: 1px solid; border-color: var(--btn-bg-color, #337cbc); border-radius: 8px; padding: 11px; color: var(--btn-color, #fff); font-size: 16px; line-height: 1; min-width: 121px; transition: background-color 0.4s, color 0.4s; cursor: pointer; }

		.widget-search .widget__button:hover { background-color: var(--btn-hover-bg-color, transparent); color: var(--btn-bg-color, #337cbc); }

	.widget-search .widget__button--alt { background-color: transparent; border-color: var(--btn-secondary-color, #848484); color: var(--btn-secondary-color, #848484); }

		.widget-search .widget__button--alt:hover { background-color: var(--btn-secondary-hover-bg-color, #848484); color: #fff; }

	.widget-search .widget__button:disabled { background-color: var(--btn-disabled-bg-color); color: var(--btn-disabled-color); pointer-events: none; border: none; padding: 12px; }

	/*  Dropdown  */

	.widget-search .widget__dropdown { position: absolute; top: 100%; left: 0; width: 100%; height: auto; pointer-events: none; opacity: 0; transition: opacity 0.4s; padding: 20px 12px 18px 15px; box-shadow: 0 3px 10px rgba(0, 0, 0, 0.16); z-index: 99; background: #fff; }

		.widget-search .widget__dropdown h5 { font-size: 14px; line-height: 1.1428; margin-bottom: 21px; color: var(--secondary-color, #022d72); font-weight: 400; }

	.widget-search .widget__dropdown-actions { display: flex; align-items: center; justify-content: center; }

	/*  Counter  */

	.widget-search .widget__counter button { border-radius: 50%; font-size: 18px; line-height: normal; width: 26px; height: 26px; background-color: var(--btn-bg-color, #337cbc); color: var(--btn-color, #fff); border: none; transition: opacity 0.4s; text-align: center; display: inline-flex; align-items: center; justify-content: center; cursor: pointer; }

		.widget-search .widget__counter button small { font-size: inherit; position: relative; top: -1px; }

	.widget-search .widget__counter { display: flex; flex-wrap: wrap; align-items: center; margin-bottom: 20px; }

		.widget-search .widget__counter:last-child { margin-bottom: 0; }

		.widget-search .widget__counter h6 { flex: 0 0 100%; margin-bottom: 6px; font-size: 12px; line-height: 1.17; color: #505050; font-weight: 400; }

		.widget-search .widget__counter button:hover { opacity: 0.7; }

		.widget-search .widget__counter button:disabled { opacity: 0.3; }

		.widget-search .widget__counter button span { display: block; margin-bottom: 0; line-height: 1; }

		.widget-search .widget__counter > span { flex: 1; border: 1px solid #848484; padding: 10px; text-align: center; margin: 0 10px 0; }

	/*  Popup  */

	.widget-search-popup { position: relative; background-color: #ffffff; padding: 24px 35px 31px 35px; width: 54.9rem; max-width: calc(100vw - 20px); margin: 0 auto; }

	@media (max-width: 767px) {
		.widget-search-popup { padding: 25px 15px; }
	}

	.widget-search-popup .mfp-close { display: none; }

	.widget-search-popup .widget__popup-close { position: absolute; top: 10px; right: 10px; width: 18px; height: 18px; transition: opacity 0.4s; }

		.widget-search-popup .widget__popup-close:hover { opacity: 0.6; }

	/*  Select  */

	.widget-search .selectric-wrapper .label { padding: 9px 45px 9px 17px; font-size: 14px; line-height: 1.1428; font-weight: 300; border: 1px solid var(--select-border-color, #848484); position: relative; }

	.widget-search .selectric-wrapper .selectric,
	.widget-search .selectric-wrapper .label { background-color: #fff; }

		.widget-search .selectric-wrapper .selectric:after { position: absolute; top: 50%; right: 17px; width: 14px; height: 14px; transform: translateY(-50%); content: ''; mask: url('../searchwidget/images/temp/ico-widget-arrow-down.svg') 0 0 no-repeat; mask-size: contain; mask-position: center center; background-color: var(--select-border-color, #848484); transition: transform 0.4s; opacity: 1 !important; }

	.widget-search .selectric-wrapper .selectric-items { background-color: #fff; padding: 28px 27px 29px; box-shadow: 0 3px 6px rgba(0, 0, 0, 0.16); z-index: 2; border: none; }

		.widget-search .selectric-wrapper .selectric-items li { background-color: #fff; border: none; color: var(--secondary-color, #022d72); font-size: 18px; line-height: 1.38; margin-bottom: 18px; padding: 0; transition: opacity 0.4s; }

			.widget-search .selectric-wrapper .selectric-items li:hover { opacity: 0.6; }

			.widget-search .selectric-wrapper .selectric-items li:last-child { margin-bottom: 0; }

	.widget-search .widget__select--sm .selectric-wrapper .label { font-size: 14px; }

	.widget-search .widget__select--sm .selectric-wrapper .selectric-items li:not(:last-child) { margin-bottom: 17px; }

	.widget-search .widget__select--sm .selectric-wrapper .selectric-items { padding: 28px 17px 28px 21px; }

	.widget-search .widget__selects { display: flex; flex-wrap: wrap; margin: -15px; }

	@media (max-width: 767px) {
		.widget-search .widget__selects { margin: -10px; }
	}

	.widget-search .widget__selects .widget__select { flex: 0 0 50%; max-width: 50%; padding: 15px; }

	@media (max-width: 767px) {
		.widget-search .widget__selects .widget__select { max-width: 100%; flex: 0 0 100%; padding: 10px; }
	}

	/*  Radios grid */

	.widget-search .widget__radios ul { columns: 2; padding-left: 0; list-style-type: none; }

	.widget-search .widget__radios li { padding: 8px 4px; }

	/*  Radio  */

	.widget-search .widget__radio input { appearance: none; position: absolute; top: 0; left: 0; }

		.widget-search .widget__radio input:checked + label::after { opacity: 1; }

	.widget-search .widget__radio label { display: inline-block; position: relative; padding-left: 40px; font-size: 14px; line-height: 1.4285; color: var(--radio-color, #696969); }

		.widget-search .widget__radio label::before { position: absolute; top: -3px; left: -1px; width: 22px; height: 22px; border: 1px solid var(--radio-border-color, #707070); border-radius: 50%; overflow: hidden; content: ''; }

		.widget-search .widget__radio label::after { position: absolute; top: 1px; left: 3px; width: 14px; height: 14px; background-color: var(--primary-color, #337cbc); border-radius: 50%; overflow: hidden; content: ''; opacity: 0; transition: opacity 0.4s; }

	/*  Field  */

	.widget-search .widget__field { padding: 31px 0 26px; position: relative; }

		.widget-search .widget__field h5 { font-size: 16px; line-height: 1.375; color: var(--primary-color, #337cbc); font-weight: 500; margin-bottom: 15px; }

			.widget-search .widget__field h5 + h6 { margin-top: 34px; }

		.widget-search .widget__field h6 { font-size: 12px; font-weight: 400; margin-bottom: 11px; color: var(--primary-color, #337cbc); }

		.widget-search .widget__field:not(.widget__field--calendar)::after { position: absolute; bottom: 0; left: 0; width: 100%; height: 1px; content: ''; background-color: rgba(112, 112, 112, 0.28); }

		.widget-search .widget__field:last-child:after { display: none; padding-bottom: 0; }

		.widget-search .widget__field:first-child { padding-top: 0; }

	.widget-search .widget__field--calendar { padding-bottom: 0; }

		.widget-search .widget__field--calendar + .widget__field { padding-top: 15px; }

	.widget-search .widget__field.widget__field--calendar::after { display: block; }

	.widget-search .widget__field--calendar h6 + .widget__datepicker { margin-top: 22px; }

	.widget-search .widget__fields { margin-bottom: 30px; }

		.widget-search .widget__fields:last-child { margin-bottom: 0; }

	/*  Helpers  */

	.widget-search [hidden],
	.widget-search .hidden { display: none !important; }

	.widget-search [secret],
	.widget-search .secret { opacity: 0; pointer-events: none; }

	/*  Popup  */

	.mfp-bg,
	.mfp-content { transition: opacity 0.6s; }

	.mfp-bg { opacity: 0; }

	.mfp-content { opacity: 0.5; }

	.mfp-bg.mfp-ready { opacity: 0.6; }

	.mfp-wrap.mfp-ready .mfp-content { opacity: 1; }

	/* ------------------------------------------------------------ *\
	Datepicker
\* ------------------------------------------------------------ */

	.widget__datepicker .ui-datepicker { width: auto !important; padding: 0; border-radius: 0; border: 0; margin: 0 -25px 0 -20px; }

	@media (max-width: 767px) {
		.widget__datepicker .ui-datepicker { margin: 0; }
	}

	.widget__datepicker .ui-datepicker thead { font-size: 10px; line-height: 1.1; font-weight: 500; text-transform: uppercase; color: var(--secondary-color, #022d72); }

	.widget__datepicker .ui-datepicker td { padding: 0; font-size: 10px; font-weight: 300; line-height: 1.1; color: #5a5a5a; }

	.widget__datepicker .highlighted a,
	.widget__datepicker .highlighted span { background-color: color-mix(in srgb, var(--datepicker-selected-color,#fbd280), transparent 66%); }

	.widget__datepicker td.ui-datepicker-other-month { pointer-events: none; opacity: 0 !important; }

.widget__datepicker .ui-datepicker td a,
.widget__datepicker .ui-datepicker td span { border: none !important; text-align: center; padding: 12px 0 10px; font-size: 12px; }

	.widget__datepicker .ui-datepicker td:not(.highlighted) span.ui-state-default { background-color: #fff; }

	.widget__datepicker .ui-datepicker .ui-state-highlight { background-color: #f6f6f6; }

	.widget__datepicker .ui-datepicker td a.ui-priority-secondary { pointer-events: none; opacity: 0; }

	.widget__datepicker td a.ui-state-active { background-color: #f6f6f6; color: #454545; }

	.widget__datepicker .departdate:not(.ui-datepicker-other-month) { opacity: 1 !important; }

	.widget__datepicker td a.ui-state-active:hover { background-color: #ededed; }

	.widget__datepicker .startdate a:not(.ui-priority-secondary),
	.widget__datepicker .departdate a:not(.ui-priority-secondary),
	.widget__datepicker .startdate span:not(.ui-priority-secondary),
	.widget__datepicker .departdate span:not(.ui-priority-secondary) { background-color: var(--datepicker-selected-color, #ffa900) !important; color: #fff !important; opacity: 1 !important; }

	.widget__datepicker .ui-datepicker-group .ui-datepicker-calendar { margin: 0; width: 100%; }

	.widget__datepicker .ui-datepicker-group { position: relative; }

		.widget__datepicker .ui-datepicker-group:nth-child(2)::before { position: absolute; top: 0; left: 0; width: 1px; height: 97%; content: ''; background-color: #aaadb1; }

	.widget__datepicker .ui-datepicker-header { background-color: transparent; border: none; border-radius: 0; }

	.widget__datepicker .ui-datepicker-title { font-weight: 300; font-size: 14px; line-height: 1.1428; }

	.widget__datepicker .ui-datepicker .ui-datepicker-prev { left: 13px; }

	.widget__datepicker .ui-datepicker .ui-icon { display: none; }

	.widget__datepicker .ui-datepicker .ui-datepicker-next { right: 13px; }

	.widget__datepicker .ui-datepicker .ui-datepicker-prev,
	.widget__datepicker .ui-datepicker .ui-datepicker-next { display: inline-block; width: 19px; height: 19px; border: none; background-color: var(--btn-bg-color, #337cbc); color: #fff; border-radius: 50%; padding: 0; top: 2px; }

		.widget__datepicker .ui-datepicker .ui-datepicker-prev::before,
		.widget__datepicker .ui-datepicker .ui-datepicker-next::before { position: absolute; top: 50%; left: 50%; width: 8px; height: 12px; background-color: currentColor; mask: url('../searchwidget/images/temp/ico-widget-arrow-down.svg') 0 0 no-repeat; mask-size: contain; mask-position: center center; content: ''; }

		.widget__datepicker .ui-datepicker .ui-datepicker-prev::before { transform: translate(-50%, -50%) rotate(90deg); }

		.widget__datepicker .ui-datepicker .ui-datepicker-next::before { transform: translate(-50%, -50%) rotate(-90deg); }

	.widget__datepicker .widget__datepicker-hints { display: flex; justify-content: space-between; align-items: center; font-size: 10px; font-weight: 300; line-height: 1.1; color: #24515f; list-style-type: none; padding-left: 0; margin-top: 23px; }

		.widget__datepicker .widget__datepicker-hints span { display: inline-block; width: 24px; height: 24px; margin-right: 10px; }

		.widget__datepicker .widget__datepicker-hints li { display: flex; align-items: center; max-width: 50%; flex: 0 0 50%; padding-right: 3rem; }

	.widget__datepicker .widget__hint--available { background-color: var(--datepicker-available-color, #f8f9fb); }

	.widget__datepicker .widget__hint--selected { background-color: var(--datepicker-selected-color, #ffa900); }

	-hints { display: flex; justify-content: space-between; align-items: center; font-size: 10px; font-weight: 300; line-height: 1.1; color: #24515f; list-style-type: none; padding-left: 0; margin-top: 23px; }

	.widget__datepicker .widget__datepicker-hints span { display: inline-block; width: 24px; height: 24px; margin-right: 10px; }

	.widget__datepicker .widget__datepicker-hints li { display: flex; align-items: center; max-width: 50%; flex: 0 0 50%; padding-right: 3rem; }
@media (max-width: 767px) {
	.widget__datepicker .widget__datepicker-hints { display: block; max-width: 100%; }
	.widget__datepicker .widget__datepicker-hints li { max-width: 100%; }
	}
	.widget__datepicker .widget__hint--available { background-color: var(--datepicker-available-color, #f8f9fb); }

	.widget__datepicker .widget__hint--selected { background-color: var(--datepicker-selected-color, #ffa900); }
	.widget__datepicker .ui-state-default, .ui-widget-content .ui-state-default, .ui-widget-header .ui-state-default, .ui-button, html .ui-button.ui-state-disabled:hover, html .ui-button.ui-state-disabled:active { background-color: var(--datepicker-available-color, #f8f9fb); }


	/* ------------------------------------------------------------ *\
	Validation States
\* ------------------------------------------------------------ */

	/* Disabled state for utility items */
	.widget-search .widget__utilities li.is-disabled { opacity: 0.5; pointer-events: none; }

		.widget-search .widget__utilities li.is-disabled > a,
		.widget-search .widget__utilities li.is-disabled > button { cursor: not-allowed; }

	/* Error state for utility items */
	.widget-search .widget__utilities li.has-error > a,
	.widget-search .widget__utilities li.has-error > button { background-color: rgba(255, 0, 0, 0.1); border: 0px solid #ff0000; animation: shake 0.5s; }

	@keyframes shake {
		0%, 100% { transform: translateX(0); }
		10%, 30%, 50%, 70%, 90% { transform: translateX(-5px); }
		20%, 40%, 60%, 80% { transform: translateX(5px); }
	}

	/* Error state for popup button */
	.widget-search .widget__button--location.has-error { border-color: #ff0000; background-color: rgba(255, 0, 0, 0.1); color: #ff0000; }