/* Smooth image switch */
.apcm-image-switching {
	opacity: .08 !important;
	transition: opacity 150ms ease !important;
}

/* HOME JETENGINE CARD */
.apcm-home-card-ready {
	overflow: visible !important;
}

.apcm-home-layout {
	display: grid !important;
	grid-template-columns: minmax(0, 1fr) 58px !important;
	grid-template-areas: "visual thumbs" !important;
	column-gap: 10px !important;
	align-items: stretch !important;

	width: 100% !important;
	max-width: 100% !important;
	min-width: 0 !important;

	margin: 0 !important;
	padding: 0 !important;

	direction: ltr !important;
	box-sizing: border-box !important;
	overflow: visible !important;
}

.apcm-home-visual {
	grid-area: visual !important;
	min-width: 0 !important;
	width: 100% !important;
	max-width: 100% !important;
	direction: rtl !important;
}

.apcm-home-visual > div[data-elementor-type="jet-listing-items"] {
	width: 100% !important;
	max-width: 100% !important;
}

.apcm-home-thumbs {
	grid-area: thumbs !important;
	display: flex !important;
	flex-direction: column !important;
	gap: 8px !important;
	align-items: stretch !important;
	justify-content: flex-start !important;

	width: 58px !important;
	min-width: 58px !important;
	max-width: 58px !important;

	margin: 8px 0 0 !important;
	padding: 0 !important;

	background: transparent !important;
	direction: ltr !important;
}

.apcm-home-thumbs .apcm-thumb,
.apcm-home-thumbs button.apcm-thumb {
	-webkit-appearance: none !important;
	appearance: none !important;

	display: block !important;
	width: 58px !important;
	min-width: 58px !important;
	max-width: 58px !important;
	height: 66px !important;
	min-height: 66px !important;
	max-height: 66px !important;

	margin: 0 !important;
	padding: 3px !important;

	border: 1px solid #E5DED7 !important;
	border-radius: 8px !important;

	background: #fff !important;
	background-image: none !important;
	box-shadow: 0 2px 8px rgba(20,24,40,.05) !important;

	font-size: 0 !important;
	line-height: 0 !important;
	color: transparent !important;

	cursor: pointer !important;
	overflow: hidden !important;
	transition: border-color .18s ease, transform .18s ease, box-shadow .18s ease !important;
}

.apcm-home-thumbs .apcm-thumb::before,
.apcm-home-thumbs .apcm-thumb::after {
	display: none !important;
	content: none !important;
}

.apcm-home-thumbs .apcm-thumb:hover {
	border-color: #B07A4A !important;
	transform: translateY(-1px) !important;
}

.apcm-home-thumbs .apcm-thumb.is-active {
	border-color: #1E2A63 !important;
	box-shadow: 0 0 0 1px #1E2A63 inset !important;
}

.apcm-home-thumbs .apcm-thumb-image {
	display: block !important;
	width: 100% !important;
	height: 100% !important;
	margin: 0 !important;
	padding: 0 !important;
	border: 0 !important;
	border-radius: 5px !important;
	object-fit: cover !important;
	object-position: center !important;
	opacity: 1 !important;
	visibility: visible !important;
	filter: none !important;
}

/* WORKING ARCHIVE HOVER */
.apcm-hover-ready {
	position: relative !important;
	overflow: hidden !important;
}

.apcm-hover-ready img {
	transition: opacity 150ms ease !important;
}

@media (max-width: 1024px) and (min-width: 768px) {
	.apcm-home-layout {
		grid-template-columns: minmax(0, 1fr) 50px !important;
		column-gap: 8px !important;
	}

	.apcm-home-thumbs {
		width: 50px !important;
		min-width: 50px !important;
		max-width: 50px !important;
	}

	.apcm-home-thumbs .apcm-thumb {
		width: 50px !important;
		min-width: 50px !important;
		max-width: 50px !important;
		height: 58px !important;
		min-height: 58px !important;
		max-height: 58px !important;
	}
}

@media (max-width: 767px) {
	.apcm-home-layout {
		grid-template-columns: 1fr !important;
		grid-template-areas:
			"visual"
			"thumbs" !important;
		row-gap: 8px !important;
	}

	.apcm-home-thumbs {
		width: 100% !important;
		min-width: 0 !important;
		max-width: 100% !important;
		flex-direction: row !important;
		overflow-x: auto !important;
		margin-top: 0 !important;
	}

	.apcm-home-thumbs .apcm-thumb {
		flex: 0 0 52px !important;
		width: 52px !important;
		min-width: 52px !important;
		max-width: 52px !important;
		height: 58px !important;
		min-height: 58px !important;
		max-height: 58px !important;
	}
}