.wp-block-hpinc-hotspot-viewer {
	position: relative;
}

.wp-block-hpinc-hotspot-viewer.is-adding-poi {
	cursor: crosshair;
	-webkit-user-select: none;
	-moz-user-select: none;
	user-select: none;
}

.wp-block-hpinc-hotspot-viewer__add-poi-button {
	border-radius: .25rem;
}

.wp-block-hpinc-hotspot-viewer__add-poi-button.is-active:before {
	background-color: var(--wp--preset--color--primary);
	color: var(--wp--preset--color--white);
}

.wp-block-hpinc-hotspot-viewer__add-poi-button.is-active svg path {
	fill: var(--wp--preset--color--white);
}

.wp-block-hpinc-hotspot-viewer__image {
	width: 100%;
}

.wp-block-hpinc-hotspot-viewer__image-container {
	position: relative;
}

.wp-block-hpinc-hotspot-viewer.alignfull .wp-block-hpinc-hotspot-viewer__image-container-inner img {
	border-radius: 0;
}

.wp-block-hpinc-hotspot-viewer__image-container-inner {
	--offset: .5rem;
	position: relative;
}

.wp-block-hpinc-hotspot-viewer__image-container-inner img {
	border-radius: 1rem;
	display: block;
	transition: .2s ease-in-out;
	width: 100%;
}

.wp-block-hpinc-hotspot-viewer__image-container-inner:after {
	border: 2px solid hsla(0, 0%, 100%, .5);
	border-radius: .5rem;
	content: "";
	display: block;
	height: calc(100% - var(--offset) * 2);
	left: var(--offset);
	pointer-events: none;
	position: absolute;
	top: var(--offset);
	width: calc(100% - var(--offset) * 2);
}

@media (min-width:768px) {
	.wp-block-hpinc-hotspot-viewer__image-container-inner:after {
		--offset: 2rem;
		border-radius: 3rem;
	}
	
	.wp-block-hpinc-hotspot-viewer__image-container-inner img {
		border-radius: 4.375rem;
	}
}

.is-adding-poi .wp-block-hpinc-hotspot-viewer__image-container img {
	opacity: .5;
	transition: .2s ease-in-out;
}

.wp-block-hpinc-hotspot-viewer.has-image:not(.has-carousel) .wp-block-hpinc-hotspot-viewer__points-of-interest {
	bottom: 0;
	height: 100%;
	left: 0;
	position: absolute;
	right: 0;
	top: 0;
	width: 100%;
	z-index: 10;
}

.has-carousel .wp-block-hpinc-hotspot-viewer__carousel {
	display: block;
}

.wp-block-hpinc-hotspot-viewer__carousel {
	background-color: var(--wp--custom--color--surface--secondary);
	display: none;
	max-width: 100vw;
	padding-bottom: 1.5rem;
	padding-left: var(--wp--style--root--padding-right);
	padding-right: var(--wp--style--root--padding-right);
	padding-top: 1.5rem;
}

.wp-block-hpinc-hotspot-viewer__carousel .splide__list, .wp-block-hpinc-hotspot-viewer__carousel .wp-block-hpinc-hotspot-poi__content {
	width: 100%;
}

.wp-block-hpinc-hotspot-viewer__carousel .splide__arrow {
	background-color: var(--wp--custom--color--blue--dark-blue);
	height: 2.5rem;
	opacity: 1;
	position: static;
	transform: none;
	width: 2.5rem;
}

.wp-block-hpinc-hotspot-viewer__carousel .splide__arrows {
	display: flex;
	justify-content: space-between;
	margin-top: 1.5rem;
}

.wp-block-hpinc-hotspot-viewer__carousel .splide__slide .wp-block-group {
	height: 100%;
}

.wp-block-hpinc-hotspot-viewer__carousel .splide__pagination__page {
	opacity: 1;
}

.wp-block-hpinc-hotspot-viewer__carousel .splide__pagination__page.is-active {
	background-color: var(--wp--custom--color--blue--dark-blue);
	transform: none;
}

:root {
	--wp--custom--site-content-width: calc(var(--wp--custom--full-viewport-width) - var(--wp--custom--site-outer-padding) * 2);
}

@media (max-width:768px) {
	:root {
		--wp--custom--site-content-width: calc(100vw - var(--wp--custom--site-outer-padding) * 2);
	}
}