.tta-universal-gallery.tta-uni-gallery {
	width: 100%;
	min-height: unset;
	display: block;
	overflow: hidden;
}

.tta-gallery-strip {
	display: flex;
	gap: .5rem;
	width: 100%;
	height: 150px;
	max-height: 150px;
	overflow-x: auto;
	overflow-y: hidden;
	scrollbar-width: none;
	justify-content: center;
}

.tta-gallery-strip::-webkit-scrollbar {
	display: none;
}

.tta-gallery-thumb {
	flex: 1;
	padding: 0;
	border: 0;
	background: none;
	cursor: pointer;
	overflow: hidden;
	flex: 0 0 150px;
	height: 150px;
	overflow: hidden;
	position: relative;
}

.tta-gallery-thumb img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	transform: scale(1);
	transition: transform .4s ease, filter .3s ease;
	filter: grayscale(1) brightness(.85);
}

.tta-gallery-thumb:hover img {
	transform: scale(1.08);
	filter: grayscale(0) brightness(1);
}

.tta-gallery-thumb::after {
	content: "";
	position: absolute;
	inset: 0;
	background: linear-gradient(
		to top,
		rgba(0,0,0,.25),
		rgba(0,0,0,0)
	);
	opacity: 0;
	transition: opacity .3s ease;
	pointer-events: none;
}

.tta-gallery-thumb:hover::after {
	opacity: 1;
}


/* LIGHTBOX */
.tta-gallery-lightbox {
	position: fixed;
	inset: 0;
	background: rgba(0,0,0,0.6);
	backdrop-filter: blur(8px);
	display: grid;
	grid-template-columns: 80px 1fr 80px;
	align-items: center;
	z-index: 9999;
	
}

.tta-gallery-lightbox img {
	max-width: 100%;
	max-height: 70vh;
	margin: auto;
	display: block;
}

.tta-gallery-prev,
.tta-gallery-next,
.tta-gallery-close {
	background: none;
	border: 0;
	color: #fff;
	font-size: 48px;
	cursor: pointer;
	opacity: 0.6;
}

.tta-gallery-close {
	position: absolute;
	top: 20px;
	right: 20px;
	font-size: 32px;
}

.tta-gallery-prev:hover,
.tta-gallery-next:hover,
.tta-gallery-close:hover {
	opacity: 1;
}


.tta-gallery-lightbox[hidden] {
	display: none !important;
}

.tta-gallery-lightbox {
	position: fixed;
	inset: 0;
	background: rgba(0,0,0,.7);
	backdrop-filter: blur(8px);
	display: grid;
	grid-template-rows: 1fr auto;
	z-index: 9999;
}

.tta-gallery-stage {
	display: flex;
	align-items: center;
	justify-content: center;
	padding: 2rem;
}

.tta-gallery-full {
	max-width: 100%;
	max-height: 80vh;
	object-fit: contain;
}

.tta-gallery-strip {
	display: flex;
	gap: .5rem;
	width: 100%;
	height: 210px;
	max-height: 210px;
	overflow-x: auto;
	overflow-y: hidden;
	scrollbar-width: none;
	justify-content: center;
	padding: 1.5rem;
}

.tta-gallery-thumb img {
	border-radius: var(--btn-padding-y);
}

.tta-gallery-lightbox {
	position: fixed;
	inset: 0;
	background: rgba(0,0,0,.7);
	backdrop-filter: blur(8px);
	display: grid;
	grid-template-rows: 1fr auto;
	z-index: 9999;
}

.tta-gallery-stage {
	display: flex;
	align-items: center;
	justify-content: center;
	padding: 2rem;
}

.tta-gallery-full {
	max-width: 100%;
	max-height: 80vh;
	object-fit: contain;
}

.tta-gallery-lightbox-strip {
	display: flex;
	gap: .5rem;
	padding: .75rem;
	background: rgba(0,0,0,.6);
	overflow-x: auto;
	width: 100vw;
	justify-content: center;
}

.tta-gallery-lightbox-strip .tta-gallery-thumb {
	flex: 0 0 80px;
	height: 80px;
	opacity: .6;
}

.tta-gallery-lightbox-strip .tta-gallery-thumb:hover,
.tta-gallery-lightbox-strip .tta-gallery-thumb.active {
	opacity: 1;
}
