.outliyr-hts {
	position: absolute;
	z-index: 1000;
	display: flex;
	align-items: center;
	background: #1a202c;
	border-radius: 4px;
	box-shadow: 0 2px 8px rgba(0, 0, 0, 0.15);
	opacity: 0;
	transition: opacity 150ms ease;
	pointer-events: none;
}

.outliyr-hts--visible {
	opacity: 1;
	pointer-events: auto;
}

.outliyr-hts--fixed {
	position: fixed;
}

.outliyr-hts__caret {
	position: absolute;
	bottom: -6px;
	left: 50%;
	transform: translateX(-50%);
	width: 0;
	height: 0;
	border-left: 6px solid transparent;
	border-right: 6px solid transparent;
	border-top: 6px solid #1a202c;
}

.outliyr-hts--flipped .outliyr-hts__caret {
	bottom: auto;
	top: -6px;
	border-top: none;
	border-bottom: 6px solid #1a202c;
}

.outliyr-hts__btn {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 44px;
	height: 40px;
	padding: 0;
	border: none;
	background: transparent;
	cursor: pointer;
	color: #fff;
	transition: background 100ms ease;
}

.outliyr-hts__btn:hover {
	background: rgba(255, 255, 255, 0.1);
}

.outliyr-hts__btn:first-child {
	border-radius: 4px 0 0 4px;
}

.outliyr-hts__btn:last-child {
	border-radius: 0 4px 4px 0;
}

.outliyr-hts__btn svg {
	width: 18px;
	height: 18px;
	fill: currentColor;
}

.outliyr-hts__btn--copied svg {
	color: #48bb78;
}

@media (max-width: 1000px) {
	.outliyr-hts__btn {
		height: 48px;
	}
}

@media (prefers-reduced-motion: reduce) {
	.outliyr-hts {
		transition: none;
	}
}
