/* InputfieldCoraltreeProperties. Uses the site's CSS tokens when present, neutral fallbacks otherwise (PW admin). */

.ct-props {
	--ct-props-accent: var(--brand, #e85a50);
	--ct-props-text: var(--boardroom, #2e4149);
	--ct-props-muted: var(--driftwood, #5e584d);
	--ct-props-border: var(--grey-10, #d3d1c7);
	--ct-props-card: var(--sandstone, #f3f2ee);
	position: relative;
}

/* Selected cards */
.ct-props-cards {
	display: flex;
	flex-wrap: wrap;
	gap: 8px;
}
.ct-props-cards:not(:empty) {
	margin-top: 12px;
}
.ct-props-card {
	display: inline-flex;
	align-items: center;
	gap: 10px;
	max-width: 100%;
	padding: 8px 8px 8px 14px;
	background: var(--ct-props-card);
	border: 1px solid var(--ct-props-border);
	border-radius: 0 12px 0 12px;
	color: var(--ct-props-text);
	line-height: 1.3;
}
.ct-props-card-text {
	display: flex;
	flex-direction: column;
	min-width: 0;
}
.ct-props-card-title {
	font-weight: 500;
}
.ct-props-card-location {
	font-size: 0.85em;
	color: var(--ct-props-muted);
}
.ct-props-card-remove {
	flex: none;
	width: 28px;
	height: 28px;
	border: 0;
	border-radius: 50%;
	background: transparent;
	color: var(--ct-props-muted);
	font-size: 20px;
	line-height: 1;
	cursor: pointer;
}
.ct-props-card-remove:hover,
.ct-props-card-remove:focus-visible {
	background: #fff;
	color: var(--ct-props-accent);
}

/* Search + dropdown */
.ct-props-picker {
	position: relative;
}
.ct-props-search {
	position: relative;
}
.ct-props-search-icon {
	position: absolute;
	left: 12px;
	top: 50%;
	transform: translateY(-50%);
	color: var(--ct-props-muted);
	pointer-events: none;
}
.ct-props-search input {
	padding-left: 40px;
	background: #fff;
	border: 1px solid var(--ct-props-border);
	border-radius: 3px;
}
.ct-props-search input:focus {
	border-color: var(--ct-props-accent);
}

.ct-props.is-enhanced .ct-props-list {
	display: none;
	position: absolute;
	z-index: 30;
	left: 0;
	right: 0;
	top: calc(100% + 4px);
	max-height: 320px;
	overflow-y: auto;
	padding: 6px 0;
	background: #fff;
	border: 1px solid var(--ct-props-border);
	border-radius: 3px;
	box-shadow: 0 16px 32px rgba(46, 65, 73, 0.12);
}
.ct-props.is-enhanced.is-open .ct-props-list {
	display: block;
}
.ct-props.is-enhanced .ct-props-list ul {
	margin: 0;
	padding: 0;
	list-style: none;
}
.ct-props.is-enhanced .ct-props-list li {
	float: none !important;
	width: 100% !important;
	margin: 0;
}
.ct-props.is-enhanced .ct-props-list li[hidden] {
	display: none !important;
}
.ct-props.is-enhanced .ct-props-list label {
	display: flex;
	align-items: center;
	gap: 10px;
	padding: 8px 14px;
	cursor: pointer;
	color: var(--ct-props-text);
}
.ct-props.is-enhanced .ct-props-list label:hover,
.ct-props.is-enhanced .ct-props-list label:focus-within {
	background: var(--ct-props-card);
}
.ct-props-empty {
	margin: 0;
	padding: 8px 14px;
	color: var(--ct-props-muted);
}