/**
 * Projektdetail: poolar/project-hero-image, project-facts, projekt-kategorie-pills,
 * project-gallery-section.
 * Hinweis (Projektregel): nicht in style.css — eigener Block-/Template-Style.
 */

.poolar-block-project-hero-image,
.poolar-block-project-facts,
.poolar-block-projekt-kategorie-pills,
.poolar-block-project-gallery-section {
	margin: 0;
}

/* Gleiche Pill-Variablen wie Projekte-Grid (Kartenfilter), ohne Grid-CSS laden zu müssen. */
.poolar-block-projekt-kategorie-pills {
	--ppg-color-text: var(--wp--preset--color--main, #141414);
	--ppg-filter-inactive-bg: var(--wp--preset--color--border-light, rgba(0, 0, 51, 0.06));
	--ppg-filter-inactive-text: color-mix(in srgb, var(--wp--preset--color--main, #141414) 62%, transparent);
	--ppg-radius-filter: 0.25rem;
	--ppg-font: var(--wp--preset--font-family--geist, system-ui, sans-serif);
	margin-top: var(--wp--preset--spacing--small, 0.5rem);
}

.poolar-block-projekt-kategorie-pills .poolar-project-card__terms {
	display: flex;
	flex-wrap: wrap;
	gap: var(--wp--preset--spacing--small, 0.5rem);
}

.poolar-block-projekt-kategorie-pills .poolar-project-card__term-pill {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 0.5rem;
	padding: 0.25rem 0.625rem;
	border: 0;
	border-radius: var(--ppg-radius-filter);
	background: var(--ppg-filter-inactive-bg);
	color: var(--ppg-filter-inactive-text);
	font-family: var(--ppg-font);
	font-size: var(--wp--preset--font-size--x-small, 0.875rem);
	font-style: normal;
	font-weight: 500;
	line-height: 1.4286;
	letter-spacing: 0;
}

.poolar-block-projekt-kategorie-pills .poolar-project-card__term-pill p {
	margin: 0;
	color: inherit;
}

/* Galerie: gleiche Wide-Breite wie Hero, falls Block nicht in alignwide-Wrapper (z. B. alter Template-Stand) */
.wp-block-group.is-layout-constrained .poolar-block-project-gallery-section {
	box-sizing: border-box;
	width: 100%;
	max-width: var(--wp--style--global--wide-size);
	margin-inline: auto;
}

/* Editor: Platzhalter, wenn kein Projekt-Kontext für ServerSideRender */
.poolar-project-detail-block-edit__placeholder {
	margin: 0;
	padding: 1rem 1.125rem;
	border: 1px dashed color-mix(in srgb, currentColor 35%, transparent);
	font-size: var(--wp--preset--font-size--small, 0.875rem);
	line-height: 1.45;
	color: var(--wp--preset--color--main, inherit);
}

/*
 * Hero: im constrained Layout sind Kinder standardmäßig „content“-breit.
 * Wide-Breite (theme.json wideSize) erzwingen, ohne alignwide nur auf der inneren figure.
 */
.wp-block-group.is-layout-constrained .poolar-block-project-hero-image:not(.alignfull) {
	box-sizing: border-box;
	width: 100%;
	max-width: var(--wp--style--global--wide-size);
	margin-inline: auto;
}

/* Hero: Bild + Copyright rechts */
.poolar-project-hero-figure {
	margin: 0;
}

.poolar-project-hero-figure .poolar-project-hero-img {
	display: block;
	width: 100%;
	height: auto;
	border-radius: var(--wp--preset--border-radius--lg, 12px);
}

/*
 * Bildunterschriften Projektdetail: gegen globale style.css (Rand links, größere Schrift ab 782px).
 * 0,75rem ≈ 12px bei 16px-Root.
 */
.poolar-project-hero-figure.wp-block-image figcaption,
.poolar-project-gallery-section .gallery-item figcaption,
.poolar-project-gallery-section .wp-block-image figcaption,
.poolar-project-gallery-section .wp-block-gallery.has-nested-images figcaption {
	box-sizing: border-box;
	margin: 5px 0 0;
	margin-left: 0;
	margin-bottom: 0;
	padding: 0 16px 0 0;
	border: none;
	border-left: none;
	text-align: right;
	font-size: 0.75rem;
	font-weight: 400;
	line-height: 1.4;
	color: var(--wp--preset--color--main, #141414);
}

@media (min-width: 782px) {
	.poolar-project-hero-figure.wp-block-image figcaption,
	.poolar-project-gallery-section .gallery-item figcaption,
	.poolar-project-gallery-section .wp-block-image figcaption,
	.poolar-project-gallery-section .wp-block-gallery.has-nested-images figcaption {
		font-size: 0.75rem;
	}
}

/* Meta-Spalte */
.poolar-project-import-facts__grid {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: var(--wp--preset--spacing--medium, 1.5rem);
}

.poolar-project-import-facts__cell {
	display: flex;
	flex-direction: column;
	gap: 8px;
	min-width: 0;
}

.poolar-project-import-facts__cell h3 {
	margin: 0;
}

.poolar-project-import-facts__value {
	min-width: 0;
}

.poolar-project-import-facts__value p {
	margin: 0;
	font-size: var(--wp--preset--font-size--text-small, 0.875rem);
}

@media (max-width: 781px) {
	.poolar-project-import-facts__grid {
		grid-template-columns: 1fr;
	}
}

/* Galerie-Block: volle Breite (alignfull), Außen-Padding, Überschrift in wide links, Galerie zentriert */
.poolar-block-project-gallery-section.poolar-project-gallery-shell {
	box-sizing: border-box;
	width: 100%;
	padding-inline: var(--wp--preset--spacing--large, 2rem);
}

.poolar-project-gallery__heading-row {
	box-sizing: border-box;
	width: 100%;
	max-width: var(--wp--style--global--wide-size);
	margin-inline: auto;
}

/* Ein Bild: Überschrift + Galerie gemeinsam in wide, linksbündig */
.poolar-project-gallery__stack-wide {
	box-sizing: border-box;
	display: flex;
	flex-direction: column;
	gap: var(--wp--preset--spacing--medium, 1.5rem);
	width: 100%;
	max-width: var(--wp--style--global--wide-size);
	margin-inline: auto;
}

.poolar-project-gallery-section__title {
	margin: 0;
	text-align: start;
}

.poolar-project-gallery__fullwidth {
	width: 100%;
	margin-top: var(--wp--preset--spacing--medium, 1.5rem);
}

.poolar-project-gallery__fullwidth .poolar-project-gallery-section {
	margin: 0;
}

/* Galerie-Abschnitt (vertikaler Rhythmus: Template-Gruppe is-style-section-xl) */
.poolar-project-gallery-section {
	display: flex;
	flex-direction: column;
	gap: var(--wp--preset--spacing--medium, 1.5rem);
}

.poolar-project-gallery-section__gallery .gallery,
.poolar-project-gallery-section__gallery .blocks-gallery-grid {
	margin: 0;
}

/*
 * ACF-Galerie: Spaltenanzahl über PHP (--cols-1/2/3), Breakpoints an Core „medium“ (782px).
 */
.poolar-project-gallery-section__gallery .gallery .gallery-item {
	float: none !important; /* gegen Core-Default-Galerie-Styles (#gallery-n) */
	width: auto !important;
	max-width: none;
	margin: 0;
	padding: 0;
}

.poolar-project-gallery-section__gallery--cols-1 .wp-block-gallery.has-nested-images,
.poolar-project-gallery-section__gallery--cols-1 .blocks-gallery-grid,
.poolar-project-gallery-section__gallery--cols-1 .gallery {
	display: grid;
	gap: var(--wp--preset--spacing--medium, 1.5rem);
	grid-template-columns: minmax(0, 1fr);
	justify-items: start;
}

.poolar-project-gallery-section__gallery--cols-2 .wp-block-gallery.has-nested-images,
.poolar-project-gallery-section__gallery--cols-2 .blocks-gallery-grid,
.poolar-project-gallery-section__gallery--cols-2 .gallery {
	display: grid;
	gap: var(--wp--preset--spacing--medium, 1.5rem);
	grid-template-columns: minmax(0, 1fr);
}

@media (min-width: 600px) {
	.poolar-project-gallery-section__gallery--cols-2 .wp-block-gallery.has-nested-images,
	.poolar-project-gallery-section__gallery--cols-2 .blocks-gallery-grid,
	.poolar-project-gallery-section__gallery--cols-2 .gallery {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}
}

.poolar-project-gallery-section__gallery--cols-3 .wp-block-gallery.has-nested-images,
.poolar-project-gallery-section__gallery--cols-3 .blocks-gallery-grid,
.poolar-project-gallery-section__gallery--cols-3 .gallery {
	display: grid;
	gap: var(--wp--preset--spacing--medium, 1.5rem);
	grid-template-columns: minmax(0, 1fr);
}

@media (min-width: 600px) {
	.poolar-project-gallery-section__gallery--cols-3 .wp-block-gallery.has-nested-images,
	.poolar-project-gallery-section__gallery--cols-3 .blocks-gallery-grid,
	.poolar-project-gallery-section__gallery--cols-3 .gallery {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}
}

@media (min-width: 782px) {
	.poolar-project-gallery-section__gallery--cols-3 .wp-block-gallery.has-nested-images,
	.poolar-project-gallery-section__gallery--cols-3 .blocks-gallery-grid,
	.poolar-project-gallery-section__gallery--cols-3 .gallery {
		grid-template-columns: repeat(3, minmax(0, 1fr));
	}
}

/* Zwei Bilder: Raster als wide-Band horizontal zentrieren */
.poolar-project-gallery-shell--count-2 .poolar-project-gallery__fullwidth .poolar-project-gallery-section__gallery {
	box-sizing: border-box;
	width: 100%;
	max-width: var(--wp--style--global--wide-size);
	margin-inline: auto;
}

.poolar-project-gallery-shell--count-2 .poolar-project-gallery__fullwidth .poolar-project-gallery-section__gallery .wp-block-gallery.has-nested-images,
.poolar-project-gallery-shell--count-2 .poolar-project-gallery__fullwidth .poolar-project-gallery-section__gallery .blocks-gallery-grid,
.poolar-project-gallery-shell--count-2 .poolar-project-gallery__fullwidth .poolar-project-gallery-section__gallery .gallery {
	justify-items: center;
	justify-content: center;
}

/* Drei und mehr: volle Shell-Breite, Raster zentrieren */
.poolar-project-gallery-shell--count-many .poolar-project-gallery__fullwidth .poolar-project-gallery-section__gallery .wp-block-gallery.has-nested-images,
.poolar-project-gallery-shell--count-many .poolar-project-gallery__fullwidth .poolar-project-gallery-section__gallery .blocks-gallery-grid,
.poolar-project-gallery-shell--count-many .poolar-project-gallery__fullwidth .poolar-project-gallery-section__gallery .gallery {
	justify-items: center;
	justify-content: center;
}

/* ACF-/Shortcode-Galerie: gleicher Radius wie Hero (Large = 1rem ≈ 16px bei Standard-Root) */
.poolar-project-gallery-section__gallery .wp-block-gallery img,
.poolar-project-gallery-section__gallery .gallery img {
	display: block;
	width: 100%;
	height: auto;
	border-radius: var(--wp--preset--border-radius--lg, 1rem);
}
