/*
============================================
COMPONENTS
============================================
*/

/* ITEM */

.item-card {
	position: relative;
	display: block;
	width: 100%;
	transition: scale 600ms var(--ease-out);

	/* &:hover {
		scale: 0.95;
	} */

	&:active {
		scale: 0.95;
	}
}

.item-card-image {
	width: 100%;
	overflow: hidden;
	border-radius: calc(var(--unit-size) / 1.5);
}

.item-card-image-image {
	display: block;
	width: 100%;
	height: 100%;
	object-fit: cover;
	transition: scale 600ms var(--ease-out);

	.item-card:hover & {
		scale: 1.1;
	}
}

.item-card-image-image--position-left {
	object-position: left center;
}

.item-card-image-image--position-center {
	object-position: center;
}

.item-card-image-image--position-right {
	object-position: right center;
}

.item-card .stretched-link {
	position: static;
	display: inline-block;
	margin-top: var(--15);
	padding: 0;
	overflow: visible;
	border-radius: 0;
	background: none;
	color: inherit;
	text-decoration: none;
}

.item-card .stretched-link::before,
.item-card .stretched-link::after {
	display: none;
}

.item-card .stretched-link::after {
	content: "";
	position: absolute;
	inset: 0;
	z-index: 1;
	display: block;
}

.item-card-label {
	display: inline-block;
	margin-top: var(--15);

	&.copper {
		color: var(--text-secondary);
	}
}

/* SLIDER */

.content-slider.swiper {
	width: 100%;
}

.content-slider--start-offset,
.content-slider--start-offset-custom {
	width: 100vw;
	box-sizing: border-box;
	padding-left: var(--content-slider-start-offset, var(--external-padding));
	padding-right: var(--external-padding);
}

.content-slider--start-offset {
	--content-slider-start-offset: var(--external-padding);
}

.content-slider .content-slider-track {
	align-items: stretch;
}

.content-slider:not(.is-swiper-enabled) .content-slider-track {
	display: flex;
	gap: var(--content-slider-gap, var(--30));
}

.content-slider .content-slider-slide {
	width: var(--content-slider-slide-width, min(75vw, 18rem));
	height: auto;
	flex: 0 0 auto;
}

/* Controlli riutilizzabili: compaiono solo nelle fasce estreme del relativo slider. */
.slider-edge-nav {
	position: absolute;
	top: 0;
	height: 100%;
	z-index: 10;
	display: grid;
	place-items: center;
	width: 15vw;
	padding: 0;
	border: 0;
	background: transparent;
	color: var(--text-primary);
	cursor: pointer;
}

.slider-edge-nav--prev { left: 0; }
.slider-edge-nav--next { right: 0; }

.slider-edge-nav span {
	display: block;
	width: 0.72rem;
	aspect-ratio: 1;
	border-block-start: 2px solid currentColor;
	border-inline-end: 2px solid currentColor;
	opacity: 0;
	transition: opacity 0.2s ease;
}

.slider-edge-nav--prev span { transform: rotate(-135deg); }
.slider-edge-nav--next span { transform: rotate(45deg); }

.slider-edge-nav:hover span,
.slider-edge-nav:focus-visible span { opacity: 1; }

.slider-edge-nav:focus-visible {
	outline: 2px solid currentColor;
	outline-offset: 3px;
}

.slider-edge-nav[disabled] {
	pointer-events: none;
	cursor: default;
}

@media (hover: none), (pointer: coarse) {
	.slider-edge-nav { display: none; }
}

.content-slider-image-wrapper {
	width: 100%;
}

.content-slider-lightbox-link {
	display: block;
	color: inherit;
	text-decoration: none;
}

.content-slider-image {
	display: block;
	width: 100%;
	height: 100%;
	object-fit: cover;
}

.content-slider-layout {
	overflow: visible;
}

.content-slider-layout .content-slider {
	width: calc(100vw - var(--content-slider-left, 0px));
}

@media (min-width: 992px) {
	.content-slider--start-offset {
		--content-slider-start-offset: calc(var(--external-padding) + ((100vw - (var(--external-padding) * 2)) / 12));
	}

	.content-slider-layout.offset-lg-1 {
		--content-slider-left: calc(var(--external-padding) + ((100vw - (var(--external-padding) * 2)) / 12));
	}
}

/* GALLERY THUMBS */

.media-gallery-thumbs {
	width: 100%;
}

.media-gallery-thumbs__main,
.media-gallery-thumbs__thumbs {
	width: 100%;
}

.media-gallery-thumbs__lightbox-link {
	display: block;
	color: inherit;
	text-decoration: none;
}

.media-gallery-thumbs__image,
.media-gallery-thumbs__thumb-image {
	width: 100%;
	height: 100%;
}

.media-gallery-thumbs__image-image,
.media-gallery-thumbs__thumb-image-image {
	display: block;
	width: 100%;
	height: 100%;
	object-fit: cover;
}

.media-gallery-thumbs__thumbs {
	margin-top: var(--30);
}

.media-gallery-thumbs__thumb {
	display: block;
	height: auto;
	margin: 0;
	padding: 0;
	overflow: visible;
	border: 0;
	border-radius: 0;
	background: none;
	color: inherit;
	cursor: pointer;
	opacity: 0.5;
	transition: opacity 400ms var(--ease-out);
}

.media-gallery-thumbs__thumb::before,
.media-gallery-thumbs__thumb::after {
	display: none;
}

.media-gallery-thumbs__thumb:hover,
.media-gallery-thumbs__thumb:focus-visible,
.media-gallery-thumbs__thumb.is-active {
	opacity: 1;
}

.media-gallery-thumbs__thumb:focus-visible {
	outline: 1px solid var(--text-primary);
	outline-offset: calc(var(--unit-size) * 0.35);
}

.media-gallery-thumbs__thumb-image {
	border-radius: calc(var(--unit-size) * 0.35);
}

.adattocasa-lightbox-gallery .pswp__bg {
	background: var(--surface-primary);
	backdrop-filter: blur(var(--unit-size));
}
/* SLIDER COMPLEMENTI */

.content-slider .complement-term-slide {
	width: var(--content-slider-slide-width, min(75vw, 16rem));
	height: auto;
	flex: 0 0 auto;
}

/* SLIDER FINITURE */

.finiture-slider .finiture-slide {
	position: relative;
	width: var(--finiture-slide-width);
}

.finiture-slider:not(.is-swiper-enabled) .content-slider-track {
	flex-wrap: wrap;
}

.finiture-slider:not(.is-swiper-enabled) .finiture-slide {
	width: var(--finiture-slide-width);
}

.finiture-slider {
	/* Una card completa e circa meta' della successiva. */
	--finiture-slide-width: calc((100vw - (var(--external-padding) * 2) - var(--unit-size)) / 1.5);
}

.finiture-slider--terms {
	padding-top: var(--75);
}

.finiture-slide-term {
	position: absolute;
	bottom: calc(100% + var(--30));
	left: 0;
	width: max-content;
	margin: 0;
}

@media (min-width: 768px) {
	.finiture-slider {
		/* Due card complete e circa meta' della terza. */
		--finiture-slide-width: calc((100vw - (var(--external-padding) * 2) - (var(--unit-size) * 2)) / 2.5);
	}
}

@media (min-width: 992px) {
	.finiture-slider {
		/* Cinque card complete e circa meta' della sesta. */
		--finiture-slide-width: calc((100vw - (var(--external-padding) * 2) - (var(--unit-size) * 5)) / 5.5);
	}
}

.finitura-card-lightbox-link {
	display: block;
	color: inherit;
	text-decoration: none;
}

.finitura-card-image {
	overflow: hidden;
	border-radius: calc(var(--unit-size) / 2);
}

.finitura-card-image-image {
	display: block;
	width: 100%;
	height: 100%;
	object-fit: cover;
}

/* HOME PRODUCTS SLIDER */

.home-products-slider:not(.is-swiper-enabled) .content-slider-track {
	justify-content: space-between;
	gap: 0;
}

.home-products-slider:not(.is-swiper-enabled) .home-product-slide {
	width: 25%;
}

.home-products-slider.is-swiper-enabled .home-product-slide {
	width: 100%;
}

.home-product-slide .item-card {
	width: 100%;
}

/* RELATED COMPLEMENTS SLIDER */

.related-complements-slider:not(.is-swiper-enabled) .content-slider-track {
	justify-content: space-between;
	gap: 0;
}

.related-complements-slider:not(.is-swiper-enabled) .related-complement-slide {
	width: 25%;
}

.related-complements-slider.is-swiper-enabled .related-complement-slide {
	width: 100%;
}

.related-complement-slide .item-card {
	width: 100%;
}

/* BREADCRUMB */

.site-breadcrumbs {
	color: var(--text-primary);
}

.site-breadcrumbs .rank-math-breadcrumb p {
	margin: 0;
	font-size: inherit;
	line-height: inherit;
}

.site-breadcrumbs a {
	color: var(--text-primary);
	text-decoration: none;
	position: relative;

	&::before {
		content: '';
		position: absolute;
		bottom: calc(-1 * (var(--unit-size) * 0.25));
		right: 0;
		width: 0;
		height: 1px;
		background-color: var(--surface-tertiary);
		transition: width 600ms var(--ease-in-out);
	}

	&:hover::before,
	&:focus-visible::before {
		right: unset;
		left: 0;
		width: 100%;
		transition: width 600ms var(--ease-out);
	}
}

.site-breadcrumbs .separator {
	opacity: 0.5;
}