/*---------------------------*/
/* !RD PHOTO GALLERY – Styles */
/*---------------------------*/

.rd-gallery-editor-wrap {
	display : block;
	width   : 100%;
}

.rd-photo-gallery {
	--rdgal-cols  : 3;
	--rdgal-gap   : 12px;
	--rdgal-ratio : 4/3;
	--rdgal-radius: 0px;
	width          : 100%;
	box-sizing     : border-box;
	padding-top    : var(--rdgb-gallery-pt, 0);
	padding-bottom : var(--rdgb-gallery-pb, 0);
	padding-left   : var(--rdgb-gallery-pl, 0);
	padding-right  : var(--rdgb-gallery-pr, 0);
	margin-top     : var(--rdgb-gallery-mt, 0);
	margin-bottom  : var(--rdgb-gallery-mb, 0);
	margin-left    : var(--rdgb-gallery-ml, 0);
	margin-right   : var(--rdgb-gallery-mr, 0);
}

/*--------------*/
/* !Ausrichtung */
/*--------------*/

.rd-gallery--align-center { margin-left: auto; margin-right: auto; }
.rd-gallery--align-right  { margin-left: auto; margin-right: 0;    }
.rd-gallery--align-left   { margin-left: 0;    margin-right: auto; }

/*----------*/
/* !Radius  */
/*----------*/

.rd-gallery--radius-sm { --rdgal-radius: 6px;    }
.rd-gallery--radius-md { --rdgal-radius: 12px;   }
.rd-gallery--radius-lg { --rdgal-radius: 20px;   }
.rd-gallery--radius-xl { --rdgal-radius: 32px;   }

/*----------------------------------------------*/
/* !Grid-Item universal (img + picture-Wrapper)  */
/*----------------------------------------------*/

/* Flex-Container: Kind streckt sich und füllt die Zelle */
.rd-photo-gallery .rdgal-item {
	margin       : 0;
	padding      : 0;
	overflow     : hidden;
	border-radius: var(--rdgal-radius);
	display      : flex;
	align-items  : stretch;
}

/* Direktes Kind (<img> oder <picture>) füllt den Container */
.rd-photo-gallery .rdgal-item > img,
.rd-photo-gallery .rdgal-item > picture {
	flex           : 1 1 0%;
	min-width      : 0;
	min-height     : 0;
	display        : block;
	width          : 100%;
	object-fit     : cover;
	object-position: center;
}

/* Bild innerhalb <picture> (Theme-spezifischer Wrapper) */
.rd-photo-gallery .rdgal-item > picture > img {
	width          : 100%;
	height         : 100%;
	object-fit     : cover;
	object-position: center;
	display        : block;
}

/* Klasse rdgal-img direkt auf img oder picture */
.rd-photo-gallery .rdgal-img {
	display        : block;
	width          : 100%;
	object-fit     : cover;
	object-position: center;
}

/*----------*/
/* !GRID    */
/*----------*/

.rd-gallery--grid {
	display              : grid;
	grid-template-columns: repeat(var(--rdgal-cols), 1fr);
	gap                  : var(--rdgal-gap);
}

.rd-gallery--grid .rdgal-item {
	aspect-ratio: var(--rdgal-ratio, auto);
}

/*-----------*/
/* !MASONRY  */
/*-----------*/

.rd-gallery--masonry {
	display              : grid;
	grid-template-columns: repeat(4, 1fr);
	gap                  : var(--rdgal-gap);
}

.rd-gallery--masonry .rdgal-item:nth-child(1) { grid-column: 1;          grid-row: 1 / span 2; }
.rd-gallery--masonry .rdgal-item:nth-child(2) { grid-column: 2;          grid-row: 1;          aspect-ratio: 1/1; }
.rd-gallery--masonry .rdgal-item:nth-child(3) { grid-column: 3;          grid-row: 1;          aspect-ratio: 1/1; }
.rd-gallery--masonry .rdgal-item:nth-child(4) { grid-column: 2 / span 2; grid-row: 2;          aspect-ratio: 2/1; }
.rd-gallery--masonry .rdgal-item:nth-child(5) { grid-column: 4;          grid-row: 1 / span 2; }
.rd-gallery--masonry .rdgal-item:nth-child(6) { grid-column: 1 / span 2; grid-row: 3;          aspect-ratio: 2/1; }
.rd-gallery--masonry .rdgal-item:nth-child(7) { grid-column: 3;          grid-row: 3;          aspect-ratio: 1/1; }
.rd-gallery--masonry .rdgal-item:nth-child(8) { grid-column: 4;          grid-row: 3;          aspect-ratio: 1/1; }
.rd-gallery--masonry .rdgal-item:nth-child(n+9) { display: none; }

/*-----------*/
/* !GALLERY  */
/*-----------*/

/*
 * Variante B: 4 Spalten, editoriales Layout, feste Zeilenhöhe 220px
 */
.rd-gallery--gallery.rd-gallery--variant-B {
	display              : grid;
	grid-template-columns: repeat(4, 1fr);
	grid-auto-rows       : 220px;
	gap                  : var(--rdgal-gap);
}

.rd-gallery--gallery.rd-gallery--variant-B .rdgal-item--pos-1 { grid-column: 1;          grid-row: 1; }
.rd-gallery--gallery.rd-gallery--variant-B .rdgal-item--pos-2 { grid-column: 2;          grid-row: 1; }
.rd-gallery--gallery.rd-gallery--variant-B .rdgal-item--pos-3 { grid-column: 3;          grid-row: 1; }
.rd-gallery--gallery.rd-gallery--variant-B .rdgal-item--pos-4 { grid-column: 4;          grid-row: 1 / span 2; }
.rd-gallery--gallery.rd-gallery--variant-B .rdgal-item--pos-5 { grid-column: 1;          grid-row: 2 / span 2; }
.rd-gallery--gallery.rd-gallery--variant-B .rdgal-item--pos-6 { grid-column: 2 / span 2; grid-row: 2; }
.rd-gallery--gallery.rd-gallery--variant-B .rdgal-item--pos-7 { grid-column: 1 / span 2; grid-row: 3; }
.rd-gallery--gallery.rd-gallery--variant-B .rdgal-item--pos-8 { grid-column: 3;          grid-row: 3; }
.rd-gallery--gallery.rd-gallery--variant-B .rdgal-item--pos-9 { grid-column: 4;          grid-row: 3; }

.rd-gallery--gallery.rd-gallery--variant-B .rdgal-item:nth-child(n+10) {
	grid-column: auto;
	grid-row   : auto;
}

/*
 * Variante C: erstes Bild full-width, Rest 3-spaltig
 */
.rd-gallery--gallery.rd-gallery--variant-C {
	display              : grid;
	grid-template-columns: repeat(3, 1fr);
	gap                  : var(--rdgal-gap);
}

.rd-gallery--gallery.rd-gallery--variant-C .rdgal-item--pos-1 {
	grid-column : 1 / -1;
	aspect-ratio: 16/6;
}

.rd-gallery--gallery.rd-gallery--variant-C .rdgal-item:not(.rdgal-item--pos-1) {
	aspect-ratio: 4/3;
}

/*-----------*/
/* !SLIDER   */
/*-----------*/

.rd-gallery-slider {
	width          : 100%;
	box-sizing     : border-box;
	position       : relative;
	padding-top    : var(--rdgb-gallery-pt, 0);
	padding-bottom : var(--rdgb-gallery-pb, 0);
	padding-left   : var(--rdgb-gallery-pl, 0);
	padding-right  : var(--rdgb-gallery-pr, 0);
	margin-top     : var(--rdgb-gallery-mt, 0);
	margin-bottom  : var(--rdgb-gallery-mb, 0);
	margin-left    : var(--rdgb-gallery-ml, 0);
	margin-right   : var(--rdgb-gallery-mr, 0);
}

.rd-gallery-slider .swiper {
	width   : 100%;
	overflow: hidden;
}

.rd-gallery-slider .swiper-slide {
	box-sizing  : border-box;
	overflow    : hidden;
	height      : var(--rdgal-slide-h, auto);
	aspect-ratio: 16/9;
}

/* Wenn Höhe explizit gesetzt: aspect-ratio deaktivieren */
.rd-gallery-slider[style*="--rdgal-slide-h"] .swiper-slide {
	aspect-ratio: unset;
}

.rd-gallery-slider .swiper-slide img,
.rd-gallery-slider .swiper-slide picture {
	width          : 100%;
	height         : 100%;
	display        : block;
	object-fit     : cover;
	object-position: center;
}

.rd-gallery-slider .swiper-slide picture > img {
	width          : 100%;
	height         : 100%;
	object-fit     : cover;
	object-position: center;
	display        : block;
}

/* Pagination */
.rd-gallery-slider .swiper-pagination {
	position   : static;
	margin-top : 12px;
	text-align : center;
}

.rd-gallery-slider .swiper-pagination-bullet {
	background : var(--rdgb-color-primary, currentColor);
	opacity    : 0.35;
	width      : 10px;
	height     : 10px;
	transition : opacity 0.2s ease, transform 0.2s ease;
}

.rd-gallery-slider .swiper-pagination-bullet-active {
	opacity   : 1;
	transform : scale(1.25);
}

/* Navigation */
.rd-gallery-slider .swiper-button-prev,
.rd-gallery-slider .swiper-button-next {
	color            : var(--rdgb-color-primary, #fff);
	background-color : rgba(0, 0, 0, 0.35);
	border-radius    : 50%;
	width            : 44px;
	height           : 44px;
	transition       : background-color 0.2s ease;
}

.rd-gallery-slider .swiper-button-prev:hover,
.rd-gallery-slider .swiper-button-next:hover {
	background-color: rgba(0, 0, 0, 0.6);
}

.rd-gallery-slider .swiper-button-prev::after,
.rd-gallery-slider .swiper-button-next::after {
	font-size: 18px;
}

.rd-gallery-slider .swiper-button-disabled {
	opacity       : 0.3;
	pointer-events: none;
}

/*-----------*/
/* !LIGHTBOX */
/*-----------*/

.rdgal-lb {
	position  : fixed;
	inset     : 0;
	z-index   : 99999;
	display   : flex;
	align-items: center;
	justify-content: center;
}

.rdgal-lb[hidden] { display: none; }

.rdgal-lb__backdrop {
	position  : absolute;
	inset     : 0;
	background: rgba(0, 0, 0, 0.88);
	cursor    : pointer;
}

.rdgal-lb__inner {
	position    : relative;
	z-index     : 1;
	max-width   : 90vw;
	max-height  : 90vh;
	display     : flex;
	align-items : center;
	gap         : 12px;
}

.rdgal-lb__img {
	display   : block;
	max-width : 80vw;
	max-height: 88vh;
	object-fit: contain;
	border-radius: 4px;
}

.rdgal-lb__btn {
	background   : rgba(255, 255, 255, 0.15);
	border       : none;
	border-radius: 50%;
	width        : 48px;
	height       : 48px;
	color        : #fff;
	font-size    : 24px;
	cursor       : pointer;
	display      : flex;
	align-items  : center;
	justify-content: center;
	flex-shrink  : 0;
	transition   : background 0.2s ease;
	line-height  : 1;
}

.rdgal-lb__btn:hover { background: rgba(255, 255, 255, 0.3); }

.rdgal-lb__close {
	position  : absolute;
	top       : -20px;
	right     : -20px;
	width     : 36px;
	height    : 36px;
	font-size : 18px;
	background: rgba(255, 255, 255, 0.2);
	border    : none;
	border-radius: 50%;
	color     : #fff;
	cursor    : pointer;
	display   : flex;
	align-items: center;
	justify-content: center;
	transition: background 0.2s ease;
}

.rdgal-lb__close:hover { background: rgba(255, 255, 255, 0.4); }

/* Lightbox-Cursor + Lupe-Overlay auf Items */
.rdgal-lightbox-on .rdgal-item {
	cursor  : zoom-in;
	position: relative;
}

.rdgal-lightbox-on .rdgal-item::after {
	content         : '';
	position        : absolute;
	inset           : 0;
	background-color: transparent;
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='40' height='40' viewBox='0 0 24 24'%3E%3Ccircle cx='10.5' cy='10.5' r='6.5' fill='none' stroke='%23fff' stroke-width='2'/%3E%3Cline x1='15.5' y1='15.5' x2='21' y2='21' stroke='%23fff' stroke-width='2' stroke-linecap='round'/%3E%3C/svg%3E");
	background-repeat  : no-repeat;
	background-position: center;
	background-size    : 40px;
	opacity        : 0;
	transition     : opacity 0.2s ease, background-color 0.2s ease;
	pointer-events : none;
}

.rdgal-lightbox-on .rdgal-item:hover::after {
	opacity         : 1;
	background-color: rgba(0, 0, 0, 0.32);
}

/* Lightbox-Bild: klickbar (weiterblättern) */
.rdgal-lb__img { cursor: pointer; }

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

@media ( max-width: 768px ) {
	.rd-gallery--grid { --rdgal-cols: 2; }

	.rd-gallery--masonry {
		grid-template-columns: repeat(2, 1fr);
	}

	.rd-gallery--masonry .rdgal-item:nth-child(-n+8) {
		grid-column  : auto;
		grid-row     : auto;
		aspect-ratio : 4/3;
	}

	.rd-gallery--gallery.rd-gallery--variant-B {
		grid-template-columns: repeat(2, 1fr);
		grid-auto-rows        : 160px;
	}

	.rd-gallery--gallery.rd-gallery--variant-B .rdgal-item {
		grid-column: auto !important;
		grid-row   : auto !important;
	}

	.rd-gallery--gallery.rd-gallery--variant-C {
		grid-template-columns: repeat(2, 1fr);
	}

	.rd-gallery--gallery.rd-gallery--variant-C .rdgal-item--pos-1 {
		aspect-ratio: 16/8;
	}

	.rdgal-lb__btn { width: 36px; height: 36px; font-size: 18px; }
}

@media ( max-width: 480px ) {
	.rd-gallery--grid { --rdgal-cols: 1; }


	.rd-gallery--gallery.rd-gallery--variant-B,
	.rd-gallery--gallery.rd-gallery--variant-C {
		grid-template-columns: 1fr;
	}

	.rd-gallery--gallery .rdgal-item,
	.rd-gallery--gallery .rdgal-item--pos-1 {
		grid-column  : auto !important;
		grid-row     : auto !important;
		aspect-ratio : 4/3 !important;
	}

	.rdgal-lb__img { max-width: 90vw; }
	.rdgal-lb__btn { display: none; }
}
/* ── Responsive: Tablet ≤768px ──────────────────────────────── */
@media (max-width: 768px) {
	.rd-photo-gallery,
	.rd-gallery-slider {
		padding-top    : var(--rdgb-gallery-pt-768, var(--rdgb-gallery-pt, 0));
		padding-bottom : var(--rdgb-gallery-pb-768, var(--rdgb-gallery-pb, 0));
		padding-left   : var(--rdgb-gallery-pl-768, var(--rdgb-gallery-pl, 0));
		padding-right  : var(--rdgb-gallery-pr-768, var(--rdgb-gallery-pr, 0));
		margin-top     : var(--rdgb-gallery-mt-768, var(--rdgb-gallery-mt, 0));
		margin-bottom  : var(--rdgb-gallery-mb-768, var(--rdgb-gallery-mb, 0));
		margin-left    : var(--rdgb-gallery-ml-768, var(--rdgb-gallery-ml, 0));
		margin-right   : var(--rdgb-gallery-mr-768, var(--rdgb-gallery-mr, 0));
	}
}
/* ── Responsive: Mobil ≤589px ───────────────────────────────── */
@media (max-width: 589px) {
	.rd-photo-gallery,
	.rd-gallery-slider {
		padding-top    : var(--rdgb-gallery-pt-589, var(--rdgb-gallery-pt-768, var(--rdgb-gallery-pt, 0)));
		padding-bottom : var(--rdgb-gallery-pb-589, var(--rdgb-gallery-pb-768, var(--rdgb-gallery-pb, 0)));
		padding-left   : var(--rdgb-gallery-pl-589, var(--rdgb-gallery-pl-768, var(--rdgb-gallery-pl, 0)));
		padding-right  : var(--rdgb-gallery-pr-589, var(--rdgb-gallery-pr-768, var(--rdgb-gallery-pr, 0)));
		margin-top     : var(--rdgb-gallery-mt-589, var(--rdgb-gallery-mt-768, var(--rdgb-gallery-mt, 0)));
		margin-bottom  : var(--rdgb-gallery-mb-589, var(--rdgb-gallery-mb-768, var(--rdgb-gallery-mb, 0)));
		margin-left    : var(--rdgb-gallery-ml-589, var(--rdgb-gallery-ml-768, var(--rdgb-gallery-ml, 0)));
		margin-right   : var(--rdgb-gallery-mr-589, var(--rdgb-gallery-mr-768, var(--rdgb-gallery-mr, 0)));
	}
}