/**
 * Product Gallery Root
 */

/**
 * Override Theme Layout
 */

 
.single-product div.product{

	display:grid !important;

	grid-template-columns:minmax(0, 1.3fr) minmax(0, .7fr) !important;

	column-gap:36px !important;

	align-items:start !important;

}


.single-product .riven-product-gallery{
	grid-column:1 !important;
	width:100%;
	max-width:100%;
	min-width:0;
	align-self:start;
	display:block;
}

.riven-product-gallery{
	width:100%;
	position:relative;
}

.riven-gallery-inner{
	display:flex;
	align-items:stretch;
	gap:24px;
	width:100%;
	min-width:0;
}

/*------------------------------------
  Sidebar
------------------------------------*/

.riven-gallery-sidebar{
	flex:0 0 110px;
	width:110px;
}

.riven-gallery-thumbs{
	height:560px;
    padding-right:40px;
}

.riven-gallery-thumbs .swiper-wrapper{
	align-items:flex-start;
}

.riven-gallery-thumbs .swiper-slide{
	cursor:pointer;
	height:auto !important;
	border-radius:12px;
	overflow:hidden;
    width:92px !important;
}

/*------------------------------------
  Main
------------------------------------*/

.riven-gallery-content{
	flex:1;
	min-width:0;
	position:relative;
}

.riven-gallery-main{
	border-radius:18px;
	background:#fff;
	overflow:hidden;
	width:100%;
		aspect-ratio:1 / 1;
}


.riven-gallery-main,
.riven-gallery-main .swiper,
.riven-gallery-main .swiper-wrapper,
.riven-gallery-main .swiper-slide,
.riven-gallery-video{
    height:100%;
}

.riven-gallery-main .swiper-slide{
	display:flex;
	align-items:center;
	justify-content:center;
	width:100%;
	height:100%;
}

.riven-gallery-main .swiper-wrapper{
	display:flex;
	align-items:center;
}

.riven-gallery-popup-trigger{
	display:flex;
	align-items:center;
	justify-content:center;
	width:100%;
	height:100%;
}

.riven-gallery-image{
	max-width:100%;
	max-height:100%;
	width: 100%;
	height: 100%;
	object-fit:contain;
	display:block;
}
/*------------------------------------
  Thumbnail
------------------------------------*/

.riven-thumb-image,
.riven-thumb-video img{

	display:block;

	width:100%;

	aspect-ratio:1;

	object-fit:cover;

	background:#fff;

	border:2px solid transparent;

	border-radius:12px;

	transition:.25s;

}

.riven-gallery-thumbs .swiper-slide-thumb-active img{

	border-color:#7c3aed;

	transform:scale(.96);

	box-shadow:0 8px 20px rgba(0,0,0,.15);

}

.riven-thumb-video {
    position: relative;
    width: 100%;
    background: #FFF;
    padding: 0px !important;
}

.riven-thumb-play{

	position:absolute;

	inset:0;

	display:flex;

	align-items:center;

	justify-content:center;

	font-size:22px;

	color:#fff;

	background:rgba(0,0,0,.35);

	border-radius:12px;

	pointer-events:none;

}

/*------------------------------------
  Video
------------------------------------*/

.riven-gallery-video{
    width:100%;
    height:100%;
    display:flex;
    align-items:center;
    justify-content:center;
    background:#fff;
}

.riven-gallery-video-thumb{
    width:100%;
    height:100%;
    object-fit:cover;
    display:block;
}

.riven-gallery-video-overlay{

	position:absolute;

	inset:0;

	display:flex;

	align-items:center;

	justify-content:center;

}

.riven-gallery-video-play{

	width:74px;

	height:74px;

	border:none;

	border-radius:50%;

	background:rgba(255,255,255,.18);

	backdrop-filter:blur(8px);

	display:flex;

	align-items:center;

	justify-content:center;

	cursor:pointer;

	color:#fff;

	font-size:28px;

	transition:.25s;

}

.riven-gallery-video-play:hover{

	transform:scale(1.08);

}

.riven-gallery-video iframe{

	width:100%;

	height:100%;

	border:0;

	display:block;

}

/*------------------------------------
  Navigation
------------------------------------*/

.riven-gallery-prev,
.riven-gallery-next{

	position:absolute;

	top:50%;

	transform:translateY(-50%);

	width:48px;

	height:48px;

	border:none;

	border-radius:50%;

	background:#fff;

	box-shadow:0 10px 25px rgba(0,0,0,.18);

	display:flex;

	align-items:center;

	justify-content:center;

	cursor:pointer;

	z-index:10;

	transition:.25s;

}

.riven-gallery-prev,
.riven-gallery-next{
	color:#111 !important;
}

.riven-gallery-prev svg,
.riven-gallery-next svg{

	width:20px !important;
	min-width:20px !important;

	height:20px !important;
	min-height:20px !important;

	display:block !important;
	flex:0 0 20px !important;

	overflow:visible !important;

}

.riven-gallery-prev path,
.riven-gallery-next path{
	stroke:#111;
	stroke-width:2.5;
}

.riven-gallery-prev{

	left:18px;

}

.riven-gallery-next{

	right:18px;

}

.riven-gallery-prev:hover,
.riven-gallery-next:hover{

	transform:translateY(-50%) scale(1.08);

}

/*------------------------------------
  Counter
------------------------------------*/

.riven-gallery-counter{

	position:absolute;

	top:18px;

	right:18px;

	padding:8px 14px;

	background:rgba(17,24,39,.85);

	color:#fff;

	border-radius:999px;

	font-size:13px;

	font-weight:600;

	line-height:1;

	z-index:20;

}


/*------------------------------------
  Responsive
------------------------------------*/

@media (max-width:991px){

	.riven-gallery-inner{

		flex-direction:column;

	}

	.riven-gallery-sidebar{

		order:2;

		width:100%;

		flex:unset;

	}

	.riven-gallery-content{

		order:1;

	}

	.riven-gallery-thumbs{

		height:auto;

		margin-top:15px;

	}

	.riven-gallery-main{
		width:100%;
		aspect-ratio:1 / 1;
	}

}

@media (max-width:767px){

	.riven-gallery-main{
		width:100%;
		aspect-ratio:1 / 1;
	}

	.riven-gallery-prev,
	.riven-gallery-next{

		width:40px;
		height:40px;

	}

	.riven-gallery-counter{

		top:12px;
		right:12px;

		font-size:12px;

	}

}

@media (max-width:768px){

	.single-product div.product{

		display:grid !important;

		grid-template-columns:minmax(0,1fr) !important;

		row-gap:24px;

		column-gap:0;

	}

	.single-product div.product > *{

		grid-column:1 / -1 !important;

		min-width:0 !important;

		width:100% !important;

		max-width:100% !important;

	}

	.riven-product-gallery{

		min-width:0 !important;

		width:100% !important;

		overflow:hidden;

	}

	.riven-gallery-inner{

		flex-direction:column;

		width:100%;

		min-width:0;

		gap:16px;

	}

	.riven-gallery-content{

		width:100%;

		min-width:0;

	}

	.riven-gallery-sidebar{

		width:100%;

		min-width:0;

		flex:none;

	}

}

.single-product div.product > .summary{

	min-width:0 !important;

	width:100% !important;

	max-width:100% !important;

	overflow:hidden;

}





/*====================================================
Popup Overlay
====================================================*/

.riven-gallery-popup{

	position:fixed;

	inset:0;

	display:none;

	align-items:center;

	justify-content:center;

	padding:40px;

	background:rgba(10,10,10,.85);

	backdrop-filter:blur(10px);

	-webkit-backdrop-filter:blur(10px);

	z-index:999999;

	opacity:0;

	visibility:hidden;

	transition:opacity .3s ease, visibility .3s ease;

}

.riven-gallery-popup.is-open{

	display:flex;

	opacity:1;

	visibility:visible;

}

/*====================================================
Overlay
====================================================*/

.riven-gallery-popup-overlay{

	position:absolute;

	inset:0;

	cursor:pointer;

}

/*====================================================
Popup Container
====================================================*/

.riven-gallery-popup-inner{

	position:relative;

	z-index:2;

	width:min(1350px,92vw);

	height:min(860px,95vh);

	border-radius:20px;

	box-shadow:0 30px 80px rgba(0,0,0,.35);

	display:flex;

	flex-direction:column;

	overflow:hidden;

}

/*====================================================
Main Swiper
====================================================*/

.riven-popup-main{

	position:relative;

	flex:1;

	width:100%;

	min-height:0;

	background: transparent;

}

.riven-popup-main .swiper-wrapper{

	height:100%;

}

.riven-popup-main .swiper-slide{

	display:flex;

	align-items:center;

	justify-content:center;

	user-select:none;

}

.riven-popup-image{

	display:block;

	width:100%;

	height:100%;

	object-fit:contain;

	-webkit-user-drag:none;

	user-select:none;

	padding:30px;

}

/*====================================================
Video
====================================================*/

.riven-popup-video{

	position:relative;

	width:100%;

	height:100%;

	display:flex;

	align-items:center;

	justify-content:center;

	background:#000;

}

.riven-popup-video-thumb{

	width:100%;

	height:100%;

	object-fit:contain;

	display:block;

}

.riven-popup-video-overlay{

	position:absolute;

	inset:0;

	display:flex;

	align-items:center;

	justify-content:center;

}

.riven-popup-video iframe{

	width:100%;

	height:100%;

	border:0;

	display:block;

}

/*====================================================
Popup Close Button
====================================================*/

.riven-gallery-popup-close{

	position:absolute;

	top:20px;

	right:20px;

	width:48px;

	height:48px;

	border:none;

	border-radius:50%;

	background:#fff;

	color:#111827;

	display:flex;

	align-items:center;

	justify-content:center;

	cursor:pointer;

	z-index:50;

	box-shadow:0 10px 30px rgba(0,0,0,.18);

	transition:.25s;

}

.riven-gallery-popup-close:hover{

	transform:scale(1.08);

	background:#111827;

	color:#fff;

}

.riven-gallery-popup-close svg{

	width:22px !important;

	height:22px !important;

	min-width:22px !important;

	min-height:22px !important;

	flex:0 0 22px !important;

	display:block !important;

	overflow:visible !important;

}

.riven-gallery-popup-close path{

	stroke:currentColor !important;

	stroke-width:2.2 !important;

	fill:none !important;

}

.riven-gallery-popup-close path{

	stroke:currentColor;

}


/*====================================================
Popup Navigation
====================================================*/

.riven-popup-prev,
.riven-popup-next{

	position:absolute;

	top:50%;

	transform:translateY(-50%);

	width:52px;

	height:52px;

	border:none;

	border-radius:50%;

	background:#fff;

	color:#111827;

	display:flex;

	align-items:center;

	justify-content:center;

	cursor:pointer;

	z-index:40;

	box-shadow:0 10px 30px rgba(0,0,0,.18);

	transition:.25s;

}

.riven-popup-prev{

	left:20px;

}

.riven-popup-next{

	right:20px;

}

.riven-popup-prev:hover,
.riven-popup-next:hover{

	transform:translateY(-50%) scale(1.08);

	background:#111827;

	color:#fff;

}

.riven-popup-prev svg,
.riven-popup-next svg{

	width:22px !important;

	height:22px !important;

	min-width:22px !important;

	min-height:22px !important;

	flex:0 0 22px !important;

	display:block !important;

	overflow:visible !important;

}

.riven-popup-prev path,
.riven-popup-next path{

	stroke:currentColor !important;

	stroke-width:2.5 !important;

	fill:none !important;

}

.riven-popup-prev path,
.riven-popup-next path{

	stroke:currentColor;

	stroke-width:2.5;

	fill:none;

}


/*====================================================
Popup Video Play
====================================================*/

.riven-popup-video-play{

	width:78px;

	height:78px;

	border:none;

	border-radius:50%;

	background:rgba(255,255,255,.18);

	backdrop-filter:blur(8px);

	-webkit-backdrop-filter:blur(8px);

	display:flex;

	align-items:center;

	justify-content:center;

	cursor:pointer;

	color:#fff;

	padding:0;

	transition:.25s;

}

.riven-popup-video-play:hover{

	transform:scale(1.08);

	background:rgba(255,255,255,.28);

}

.riven-popup-video-play svg{

	width:78px;

	height:78px;

	display:block;

}


/*====================================================
Loading Cursor
====================================================*/

.riven-popup-video.is-playing{

	cursor:default;

}


/*====================================================
Counter
====================================================*/

.riven-popup-counter{

	position:absolute;

	top:22px;

	left:24px;

	z-index:30;

	display:flex;

	align-items:center;

	gap:8px;

	padding:8px 14px;

	border-radius:999px;

	background:rgba(17,24,39,.85);

	color:#fff;

	font-size:13px;

	font-weight:600;

	line-height:1;

}

.riven-popup-separator{

	opacity:.6;

}


/*====================================================
Body Lock
====================================================*/

body.riven-popup-open{

	overflow:hidden;

}


/*====================================================
Responsive
====================================================*/

@media (max-width:991px){

	.riven-gallery-popup{

		padding:20px;

	}

	.riven-gallery-popup-inner{

		width:100%;

		height:95vh;

		border-radius:16px;

	}

	.riven-popup-image{

		padding:20px;

	}


}


@media (max-width:767px){

	.riven-gallery-popup{

		padding:0;

	}

	.riven-gallery-popup-inner{

		width:100vw;

		height:100vh;

		border-radius:0;

	}

	.riven-popup-image{

		padding:15px;

	}

	.riven-popup-prev,
	.riven-popup-next{

		width:42px;

		height:42px;

	}

	.riven-gallery-popup-close{

		width:42px;

		height:42px;

	}

	.riven-popup-counter{

		top:15px;

		left:15px;

		font-size:12px;

		padding:6px 12px;

	}

}