/**
 * Front-end Gallery Styles for Smart Gallery.
 */

.sg-gallery-wrap {
	width: 100%;
	max-width: 1200px;
	min-width: 0;
	margin: 20px auto;
	padding: 0;
	box-sizing: border-box;
}

/* --- standard CSS grid --- */
.sg-gallery-grid {
	display: grid !important;
	width: 100% !important;
	max-width: 100% !important;
	min-width: 0 !important;
	margin: 0 !important;
	padding: 0 !important;
	box-sizing: border-box !important;
}

/* Gap Sizes */
.sg-gallery-grid.sg-gap-none,
.sg-gallery-masonry.sg-gap-none {
	gap: 0;
	column-gap: 0;
}
.sg-gallery-grid.sg-gap-tiny,
.sg-gallery-masonry.sg-gap-tiny {
	gap: 2px;
	column-gap: 2px;
}
.sg-gallery-grid.sg-gap-small,
.sg-gallery-masonry.sg-gap-small {
	gap: 10px;
	column-gap: 10px;
}
.sg-gallery-grid.sg-gap-medium,
.sg-gallery-masonry.sg-gap-medium {
	gap: 21px;
	column-gap: 21px;
}
.sg-gallery-grid.sg-gap-large,
.sg-gallery-masonry.sg-gap-large {
	gap: 31px;
	column-gap: 31px;
}

/* Grid Columns Configuration */
.sg-gallery-grid.sg-cols-2 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.sg-gallery-grid.sg-cols-3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.sg-gallery-grid.sg-cols-4 { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.sg-gallery-grid.sg-cols-5 { grid-template-columns: repeat(5, minmax(0, 1fr)); }
.sg-gallery-grid.sg-cols-6 { grid-template-columns: repeat(6, minmax(0, 1fr)); }

/* --- Masonry Layout --- */
.sg-gallery-masonry {
	display: block !important;
	width: 100% !important;
	box-sizing: border-box !important;
}
.sg-gallery-masonry.sg-cols-2 { column-count: 2; }
.sg-gallery-masonry.sg-cols-3 { column-count: 3; }
.sg-gallery-masonry.sg-cols-4 { column-count: 4; }
.sg-gallery-masonry.sg-cols-5 { column-count: 5; }
.sg-gallery-masonry.sg-cols-6 { column-count: 6; }

/* Masonry Item Gaps (Margins) */
.sg-gallery-masonry.sg-gap-none > a,
.sg-gallery-masonry.sg-gap-none > img,
.sg-gallery-masonry.sg-gap-none > .sg-image-no-click {
	margin-bottom: 0px !important;
}
.sg-gallery-masonry.sg-gap-tiny > a,
.sg-gallery-masonry.sg-gap-tiny > img,
.sg-gallery-masonry.sg-gap-tiny > .sg-image-no-click {
	margin-bottom: 2px !important;
}
.sg-gallery-masonry.sg-gap-small > a,
.sg-gallery-masonry.sg-gap-small > img,
.sg-gallery-masonry.sg-gap-small > .sg-image-no-click {
	margin-bottom: 10px !important;
}
.sg-gallery-masonry.sg-gap-medium > a,
.sg-gallery-masonry.sg-gap-medium > img,
.sg-gallery-masonry.sg-gap-medium > .sg-image-no-click {
	margin-bottom: 20px !important;
}
.sg-gallery-masonry.sg-gap-large > a,
.sg-gallery-masonry.sg-gap-large > img,
.sg-gallery-masonry.sg-gap-large > .sg-image-no-click {
	margin-bottom: 30px !important;
}

/* Base Gallery Item Styles */
.sg-gallery-grid > a,
.sg-gallery-grid > img,
.sg-gallery-grid > .sg-image-no-click,
.sg-gallery-masonry > a,
.sg-gallery-masonry > img,
.sg-gallery-masonry > .sg-image-no-click {
	display: block !important;
	position: relative !important;
	width: 100% !important;
	box-sizing: border-box !important;
	overflow: hidden !important;
	box-shadow: 0 4px 6px rgba(0, 0, 0, 0.05);
	transition: transform 0.3s cubic-bezier(0.25, 0.46, 0.45, 0.94), 
				box-shadow 0.3s cubic-bezier(0.25, 0.46, 0.45, 0.94);
	text-decoration: none;
	background: #f0f0f1;
}

.sg-gallery-masonry > a,
.sg-gallery-masonry > img,
.sg-gallery-masonry > .sg-image-no-click {
	display: inline-block !important;
	break-inside: avoid !important;
}

/* Aspect Ratio Options (Grid Only - Masonry uses auto) */
.sg-gallery-grid.sg-aspect-1-1 > a,
.sg-gallery-grid.sg-aspect-1-1 > img,
.sg-gallery-grid.sg-aspect-1-1 > .sg-image-no-click {
	aspect-ratio: 1 / 1 !important;
}
.sg-gallery-grid.sg-aspect-4-3 > a,
.sg-gallery-grid.sg-aspect-4-3 > img,
.sg-gallery-grid.sg-aspect-4-3 > .sg-image-no-click {
	aspect-ratio: 4 / 3 !important;
}
.sg-gallery-grid.sg-aspect-3-4 > a,
.sg-gallery-grid.sg-aspect-3-4 > img,
.sg-gallery-grid.sg-aspect-3-4 > .sg-image-no-click {
	aspect-ratio: 3 / 4 !important;
}
.sg-gallery-grid.sg-aspect-original > a,
.sg-gallery-grid.sg-aspect-original > img,
.sg-gallery-grid.sg-aspect-original > .sg-image-no-click {
	aspect-ratio: auto !important;
}

/* Image Fit Options */
.sg-gallery-grid.sg-fit-cover img.sg-gallery-img,
.sg-gallery-masonry.sg-fit-cover img.sg-gallery-img {
	object-fit: cover !important;
}
.sg-gallery-grid.sg-fit-contain img.sg-gallery-img,
.sg-gallery-masonry.sg-fit-contain img.sg-gallery-img {
	object-fit: contain !important;
}

/* Rounded Corners Options */
.sg-rounded-no > a,
.sg-rounded-no > img,
.sg-rounded-no > .sg-image-no-click {
	border-radius: 0px !important;
}
.sg-rounded-small > a,
.sg-rounded-small > img,
.sg-rounded-small > .sg-image-no-click {
	border-radius: 6px !important;
}
.sg-rounded-medium > a,
.sg-rounded-medium > img,
.sg-rounded-medium > .sg-image-no-click {
	border-radius: 12px !important;
}
.sg-rounded-large > a,
.sg-rounded-large > img,
.sg-rounded-large > .sg-image-no-click {
	border-radius: 20px !important;
}

/* Caption Overlay Styles */
.sg-caption-overlay {
	position: absolute !important;
	top: 0 !important;
	left: 0 !important;
	right: 0 !important;
	bottom: 0 !important;
/* 	background-color: var(--sg-hover-color, rgba(156, 4, 60, 0.9)) !important; */
	display: flex !important;
	align-items: center !important;
	justify-content: center !important;
	padding: 20px !important;
	opacity: 0 !important;
	visibility: hidden !important;
	z-index: 5 !important;
	transition: opacity 0.35s cubic-bezier(0.25, 0.46, 0.45, 0.94),
				visibility 0.35s cubic-bezier(0.25, 0.46, 0.45, 0.94) !important;
}

.sg-caption-text {
	color: #ffffff !important;
	font-size: 15px !important;
	line-height: 1.5 !important;
	text-align: center !important;
	font-weight: 500 !important;
	font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif !important;
	transform: translate(-100%)  !important;
	transition: transform 0.5s cubic-bezier(0.25, 0.46, 0.45, 0.94) !important;
}

/* Hover States triggers */
.sg-gallery-grid > a:hover,
.sg-gallery-grid > .sg-image-no-click:hover,
.sg-gallery-masonry > a:hover,
.sg-gallery-masonry > .sg-image-no-click:hover {
	transform: translateY(-4px);
	box-shadow: 0 10px 20px rgba(0, 0, 0, 0.12);
	z-index: 2;
}

.sg-gallery-grid > a:hover .sg-caption-overlay,
.sg-gallery-grid > .sg-image-no-click:hover .sg-caption-overlay,
.sg-gallery-masonry > a:hover .sg-caption-overlay,
.sg-gallery-masonry > .sg-image-no-click:hover .sg-caption-overlay {
	opacity: 1 !important;
	visibility: visible !important;
}

.sg-gallery-grid > a:hover .sg-caption-text,
.sg-gallery-grid > .sg-image-no-click:hover .sg-caption-text,
.sg-gallery-masonry > a:hover .sg-caption-text,
.sg-gallery-masonry > .sg-image-no-click:hover .sg-caption-text {
	transform: translateX(0) !important;
}

/* Image inside Gallery Items */
.sg-gallery-grid img.sg-gallery-img,
.sg-gallery-masonry img.sg-gallery-img {
	width: 100% !important;
	max-width: 100% !important;
	height: 100% !important;
	display: block !important;
	transition: transform 0.5s cubic-bezier(0.25, 0.46, 0.45, 0.94) !important;
}

/* Zoom Only effect */
.sg-hover-zoom > a:hover img.sg-gallery-img,
.sg-hover-zoom > .sg-image-no-click:hover img.sg-gallery-img,
.sg-hover-zoom-lift > a:hover img.sg-gallery-img,
.sg-hover-zoom-lift > .sg-image-no-click:hover img.sg-gallery-img {
	transform: scale(1.08) !important;
}

/* No effect on non-hover configs */
.sg-hover-flat > a:hover,
.sg-hover-flat > .sg-image-no-click:hover {
	transform: none !important;
	box-shadow: 0 4px 6px rgba(0, 0, 0, 0.05) !important;
}
.sg-hover-flat > a:hover img.sg-gallery-img,
.sg-hover-flat > .sg-image-no-click:hover img.sg-gallery-img {
	transform: none !important;
}

/* Lift Only (No Zoom) */
.sg-hover-lift > a:hover img.sg-gallery-img,
.sg-hover-lift > .sg-image-no-click:hover img.sg-gallery-img {
	transform: none !important;
}

/* --- Split Slide (b-link-stroke) Hover Effect --- */
.b-link-stroke {
	position: relative;
	overflow: hidden;
}

/* Default — panels hidden OFF screen */
.b-link-stroke .b-top-line {
	position: absolute;
	top: -100%;
	left: 0;
	width: 50%;
	height: 100%;
	background: rgba(10, 194, 210, 0.5); /* Teal semi-transparent color */
	transition: all 0.5s ease;
	z-index: 4;
	pointer-events: none;
}

.b-link-stroke .b-bottom-line {
	position: absolute;
	bottom: -100%;
	right: 0;
	width: 50%;
	height: 100%;
	background: rgba(10, 194, 210, 0.5); /* Teal semi-transparent color */
	transition: all 0.5s ease;
	z-index: 4;
	pointer-events: none;
}

/* On hover — panels slide INTO view in 0.5s */
.b-link-stroke:hover .b-top-line {
	top: 0;
}

.b-link-stroke:hover .b-bottom-line {
	bottom: 0;
}

/* Caption Overlay resets for this effect */
.b-link-stroke .sg-caption-overlay {
	background-color: transparent !important;
	opacity: 1 !important;
	visibility: visible !important;
	z-index: 5;
}

/* Default — text is hidden 100% to the left */
.b-link-stroke .sg-caption-text {
	transform: none !important;
}

.b-from-left {
	position: relative;
	left: -100%;
	transition: left 0.5s ease, visibility 0.5s ease !important;
}

/* On hover — slides to its natural position */
.b-animate-go:hover .b-from-left {
	left: 0;
}

/* Caption visibility toggled */
.b-animate {
	visibility: hidden;
}

.b-animate-go:hover .b-animate {
	visibility: visible;
}

/* Delay transition */
.b-delay03 {
	transition-delay: 0.3s !important;
}

/* Disable default hover lifts/zooms when stroke effect is active */
.sg-hover-stroke > a:hover,
.sg-hover-stroke > .sg-image-no-click:hover {
	transform: none !important;
	box-shadow: 0 4px 6px rgba(0, 0, 0, 0.05) !important;
}

.sg-hover-stroke > a:hover img.sg-gallery-img,
.sg-hover-stroke > .sg-image-no-click:hover img.sg-gallery-img {
	transform: none !important;
}

.sg-lightbox-trigger::before,
.sg-lightbox-trigger::after{
    content:"";
    position:absolute;
    width:50%;
    height:2px;
    background:rgba(140,0,76,0.4) ;
    transition:all .5s ease;
    z-index:1;
}

.sg-lightbox-trigger::before{
    left:0;
    top:-100%;
}

.sg-lightbox-trigger::after{
    right:0;
    bottom:-100%;
}

.sg-lightbox-trigger:hover::before{
    top:0;
    height:100%;
}

.sg-lightbox-trigger:hover::after{
    bottom:0;
    height:100%;
}

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

/* Tablets & Medium Screens */
@media screen and (max-width: 992px) {
	.sg-gallery-grid.sg-cols-4,
	.sg-gallery-grid.sg-cols-5,
	.sg-gallery-grid.sg-cols-6 {
		grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
	}
	.sg-gallery-masonry.sg-cols-4,
	.sg-gallery-masonry.sg-cols-5,
	.sg-gallery-masonry.sg-cols-6 {
		column-count: 3 !important;
	}
}

/* Small Tablets */
@media screen and (max-width: 768px) {
	.sg-gallery-grid.sg-cols-3,
	.sg-gallery-grid.sg-cols-4,
	.sg-gallery-grid.sg-cols-5,
	.sg-gallery-grid.sg-cols-6 {
		grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
	}
	.sg-gallery-masonry.sg-cols-3,
	.sg-gallery-masonry.sg-cols-4,
	.sg-gallery-masonry.sg-cols-5,
	.sg-gallery-masonry.sg-cols-6 {
		column-count: 2 !important;
	}
	
	/* Reduce gap slightly on tablets */
	.sg-gallery-grid.sg-gap-large,
	.sg-gallery-masonry.sg-gap-large {
		gap: 21px !important;
		column-gap: 21px !important;
	}
}

/* Mobile Devices */
@media screen and (max-width: 480px) {
	.sg-gallery-grid.sg-cols-2,
	.sg-gallery-grid.sg-cols-3,
	.sg-gallery-grid.sg-cols-4,
	.sg-gallery-grid.sg-cols-5,
	.sg-gallery-grid.sg-cols-6 {
		grid-template-columns: minmax(0, 1fr) !important;
	}
	.sg-gallery-masonry.sg-cols-2,
	.sg-gallery-masonry.sg-cols-3,
	.sg-gallery-masonry.sg-cols-4,
	.sg-gallery-masonry.sg-cols-5,
	.sg-gallery-masonry.sg-cols-6 {
		column-count: 1 !important;
	}
	
	/* Reduce gap more on mobile */
	.sg-gallery-grid.sg-gap-medium,
	.sg-gallery-masonry.sg-gap-medium {
		gap: 13px !important;
		column-gap: 13px !important;
	}
	.sg-gallery-grid.sg-gap-large,
	.sg-gallery-masonry.sg-gap-large {
		gap: 15px !important;
		column-gap: 15px !important;
	}
	
	.sg-gallery-grid:not([class*="sg-aspect-"]) > a,
	.sg-gallery-grid:not([class*="sg-aspect-"]) > img,
	.sg-gallery-grid:not([class*="sg-aspect-"]) > .sg-image-no-click {
		aspect-ratio: 3 / 2 !important;
	}
}