/**
 * HD Estatik Search - collapsible advanced-search filters.
 */

/* filter groups: animated collapse/expand */
.hd-sf-collapsible {
	overflow: hidden;
	max-height: 1400px;
	opacity: 1;
}
/* transitions only after first paint - applying them in the initial style
   pass wedges padding/margin/opacity at their pre-collapse values */
form.hd-sf-anim .hd-sf-collapsible {
	transition: max-height .45s ease, opacity .3s ease, margin .3s ease, padding .3s ease;
}
.hd-sf-collapsed {
	max-height: 0 !important;
	border-width: 0 !important; /* bordered checkbox fields leave 16px slivers otherwise */
	min-height: 0 !important;
	opacity: 0;
	margin-top: 0 !important;
	margin-bottom: 0 !important;
	padding-top: 0 !important;
	padding-bottom: 0 !important;
	pointer-events: none;
}

/* "More Filters" toggle */
.hd-search-more {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	margin: 10px 0 14px;
	padding: 8px 16px;
	background: #fff;
	border: 1px solid #16add0;
	border-radius: 100px;
	color: #16add0;
	font-size: 13px;
	font-weight: 600;
	letter-spacing: 0.4px;
	text-transform: uppercase;
	cursor: pointer;
	transition: background .2s ease, color .2s ease, box-shadow .2s ease;
}
.hd-search-more:hover {
	background: #16add0;
	color: #fff;
}
.hd-search-more:hover .hd-search-more__count {
	background: #fff;
	color: #16add0;
}

/* hidden-filter count badge with a gentle attention pulse */
.hd-search-more__count {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-width: 20px;
	height: 20px;
	padding: 0 5px;
	background: #16add0;
	color: #fff;
	border-radius: 100px;
	font-size: 11px;
	line-height: 1;
	animation: hd-pulse 2.4s ease-out infinite;
	transition: background .2s ease, color .2s ease;
}
@keyframes hd-pulse {
	0%   { box-shadow: 0 0 0 0 rgba(22, 173, 208, 0.45); }
	60%  { box-shadow: 0 0 0 9px rgba(22, 173, 208, 0); }
	100% { box-shadow: 0 0 0 0 rgba(22, 173, 208, 0); }
}
.hd-search-more--open .hd-search-more__count {
	animation: none;
}

/* chevron with a subtle bob, rotates when expanded */
.hd-search-more__chevron {
	width: 8px;
	height: 8px;
	border-right: 2px solid currentColor;
	border-bottom: 2px solid currentColor;
	transform: rotate(45deg);
	margin-top: -4px;
	animation: hd-bob 2.4s ease-in-out infinite;
	transition: transform .3s ease;
}
.hd-search-more--open .hd-search-more__chevron {
	transform: rotate(225deg);
	margin-top: 4px;
	animation: none;
}
@keyframes hd-bob {
	0%, 100% { translate: 0 0; }
	50%      { translate: 0 2px; }
}

@media (prefers-reduced-motion: reduce) {
	.hd-search-more__count,
	.hd-search-more__chevron {
		animation: none;
	}
}

/* Estatik's built-in "More filters" link is redundant once our collapsible
   toggle is active on the form - hide it only in that case */
form[data-hd-collapsible-done] .js-es-search-more {
	display: none !important;
}

/* estatik's vertical-layout field rules out-rank the base collapse reset */
html body .es-search .es-field.hd-sf-collapsed,
html body .hd-sf-collapsed {
	padding-top: 0 !important;
	padding-bottom: 0 !important;
	margin-top: 0 !important;
	margin-bottom: 0 !important;
}