/* The dropdown sits over the top of the canvas, so the canvas wrapper has to be its positioning context. */
.wp3dconf-preview {
	position: relative;
}

.wp3dconf-morph-trigger {
	position: absolute;
	top: 12px;
	right: 30px;
	z-index: 5;
}

/* Two-class selectors and explicit values, so a theme's own button and list
   styles do not leak into the dropdown. */
.wp3dconf-morph-trigger .wp3dconf-morph-trigger-button {
	display: inline-flex;
	align-items: center;
	justify-content: space-between;
	gap: 12px;
	min-width: 10rem;
	max-width: 80vw;
	margin: 0;
	padding: 9px 14px;
	border: 0;
	border-radius: 8px;
	background: #fff;
	box-shadow: 0 1px 2px rgba(16, 24, 40, 0.06);
	color: #1a1a1a;
	font: inherit;
	font-size: 14px;
	font-weight: 500;
	line-height: 1.3;
	letter-spacing: normal;
	text-align: left;
	text-transform: none;
	cursor: pointer;
	transition: border-color 0.15s ease, box-shadow 0.15s ease;
}

.wp3dconf-morph-trigger .wp3dconf-morph-trigger-button:hover,
.wp3dconf-morph-trigger .wp3dconf-morph-trigger-button:focus {
	background: #fff;
	color: #1a1a1a;
}

.wp3dconf-morph-trigger .wp3dconf-morph-trigger-button:focus-visible,
.wp3dconf-morph-trigger.is-open .wp3dconf-morph-trigger-button {
	outline: none;
}

.wp3dconf-morph-trigger .wp3dconf-morph-trigger-button.is-empty .wp3dconf-morph-trigger-label {
	color: #6b7280;
	font-weight: 400;
}

.wp3dconf-morph-trigger .wp3dconf-morph-trigger-icon {
	flex-shrink: 0;
	color: #6b7280;
	transition: transform 0.15s ease;
}

.wp3dconf-morph-trigger.is-open .wp3dconf-morph-trigger-icon {
	transform: rotate(180deg);
}

.wp3dconf-morph-trigger .wp3dconf-morph-trigger-list {
	position: absolute;
	top: calc(100% + 6px);
	right: 0;
	min-width: 100%;
	max-height: 16rem;
	margin: 0;
	padding: 4px;
	overflow-y: auto;
	border: 1px solid #e2e4e9;
	border-radius: 8px;
	background: #fff;
	box-shadow: 0 10px 24px rgba(16, 24, 40, 0.14);
	list-style: none;
}

.wp3dconf-morph-trigger .wp3dconf-morph-trigger-list[hidden] {
	display: none !important;
}

.wp3dconf-morph-trigger .wp3dconf-morph-trigger-option {
	margin: 0;
	padding: 8px 12px;
	border-radius: 6px;
	color: #1a1a1a;
	font-size: 14px;
	line-height: 1.3;
	white-space: nowrap;
	cursor: pointer;
	list-style: none;
}

.wp3dconf-morph-trigger .wp3dconf-morph-trigger-option:hover,
.wp3dconf-morph-trigger .wp3dconf-morph-trigger-option:focus {
	outline: none;
}

.wp3dconf-morph-trigger .wp3dconf-morph-trigger-option[aria-selected="true"] {
	font-weight: 600;
}