/* Fotoalben – Frontend. Farben/Schriften kommen aus Elementor (globale Farben), sonst Fallbacks. */
.fa-wrap {
	--fa-accent: var(--e-global-color-primary, #1d4f91);
	--fa-accent-2: var(--e-global-color-accent, var(--e-global-color-secondary, #7a1f3d));
	--fa-text: var(--e-global-color-text, #2b2b2b);
	--fa-border: rgba(0, 0, 0, .12);
	--fa-radius: 10px;
	color: var(--fa-text);
	font-family: inherit;
}
.fa-wrap *, .fa-wrap *::before, .fa-wrap *::after { box-sizing: border-box; }

/* Filter */
.fa-filter { display: flex; flex-wrap: wrap; gap: .75rem; align-items: center; margin: 0 0 1.5rem; }
.fa-sr { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
.fa-search, .fa-year {
	font: inherit; padding: .55rem .8rem; border: 1px solid var(--fa-border);
	border-radius: 999px; background: #fff; color: inherit; min-width: 0;
}
.fa-search { flex: 1 1 14rem; max-width: 22rem; }
.fa-pills { display: flex; flex-wrap: wrap; gap: .4rem; }
.fa-pill {
	font: inherit; font-size: .9em; cursor: pointer; padding: .4rem .9rem; border-radius: 999px;
	border: 1px solid var(--fa-accent); background: transparent; color: var(--fa-accent);
	transition: background .15s, color .15s;
}
.fa-pill:hover { background: color-mix(in srgb, var(--fa-accent) 12%, transparent); }
.fa-pill.is-active { background: var(--fa-accent); color: #fff; }
.fa-pill:focus-visible, .fa-search:focus-visible, .fa-year:focus-visible { outline: 3px solid var(--fa-accent-2); outline-offset: 2px; }

/* Karten */
.fa-cards { display: grid; grid-template-columns: repeat(auto-fill, minmax(260px, 1fr)); gap: 1.5rem; }
.fa-card { display: flex; flex-direction: column; background: #fff; border: 1px solid var(--fa-border); border-radius: var(--fa-radius); overflow: hidden; transition: box-shadow .2s, transform .2s; }
.fa-card:hover { box-shadow: 0 6px 20px rgba(0, 0, 0, .12); transform: translateY(-2px); }
.fa-card[hidden] { display: none; }
.fa-cover { display: block; aspect-ratio: 4 / 3; background: #eef0f3; overflow: hidden; }
.fa-cover-img { width: 100%; height: 100%; object-fit: cover; display: block; }
.fa-nocover { display: flex; align-items: center; justify-content: center; width: 100%; height: 100%; font-size: 3rem; opacity: .5; }
.fa-body { padding: 1rem 1.1rem 1.2rem; display: flex; flex-direction: column; gap: .5rem; flex: 1; }
.fa-title { margin: 0; font-size: 1.15rem; line-height: 1.3; }
.fa-title a { color: var(--fa-accent); text-decoration: none; }
.fa-title a:hover { text-decoration: underline; }
.fa-meta { display: flex; flex-wrap: wrap; gap: .4rem .6rem; align-items: center; font-size: .85em; opacity: .85; }
.fa-tag { background: color-mix(in srgb, var(--fa-accent) 12%, transparent); color: var(--fa-accent); padding: .1rem .55rem; border-radius: 999px; font-size: .9em; }
.fa-excerpt { margin: 0; font-size: .95em; }
.fa-more { margin: auto 0 0; padding-top: .3rem; }
.fa-more a { color: var(--fa-accent-2); font-weight: 600; text-decoration: none; }
.fa-more a:hover { text-decoration: underline; }
.fa-count { opacity: .7; font-size: .9em; }
.fa-empty, .fa-none { padding: 1rem 0; opacity: .8; }

/* Einzelalbum */
.fa-back { margin: 0 0 .5rem; }
.fa-back a { color: var(--fa-accent); text-decoration: none; }
.fa-desc { margin: 1rem 0 1.5rem; }
.fa-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(210px, 1fr)); gap: .6rem; margin-top: 1.2rem; }
.fa-photo { display: block; aspect-ratio: 4 / 3; overflow: hidden; border-radius: 6px; background: #eef0f3; }
.fa-photo img { width: 100%; height: 100%; object-fit: cover; display: block; transition: transform .25s; }
.fa-photo:hover img { transform: scale(1.04); }
.fa-photo:focus-visible { outline: 3px solid var(--fa-accent-2); outline-offset: 2px; }

/* Lightbox */
.fa-lb { position: fixed; inset: 0; z-index: 999999; background: rgba(10, 12, 16, .94); display: none; align-items: center; justify-content: center; touch-action: pan-y; }
.fa-lb.is-open { display: flex; }
.fa-lb-img { max-width: 94vw; max-height: 86vh; object-fit: contain; user-select: none; -webkit-user-drag: none; }
.fa-lb button { position: absolute; background: rgba(255, 255, 255, .12); color: #fff; border: 0; border-radius: 50%; width: 48px; height: 48px; font-size: 26px; line-height: 1; cursor: pointer; display: flex; align-items: center; justify-content: center; padding: 0; }
.fa-lb button:hover { background: rgba(255, 255, 255, .28); }
.fa-lb button:focus-visible { outline: 3px solid #fff; }
.fa-lb-close { top: 14px; right: 14px; }
.fa-lb-prev { left: 14px; top: 50%; transform: translateY(-50%); }
.fa-lb-next { right: 14px; top: 50%; transform: translateY(-50%); }
.fa-lb-count { position: absolute; bottom: 14px; left: 0; right: 0; text-align: center; color: #fff; opacity: .8; font-size: .9rem; }
@media (max-width: 600px) {
	.fa-cards { grid-template-columns: 1fr; }
	.fa-grid { grid-template-columns: repeat(2, 1fr); }
	.fa-lb button { width: 42px; height: 42px; }
	.fa-lb-prev { left: 6px; } .fa-lb-next { right: 6px; }
}
body.fa-lb-lock { overflow: hidden; }
@media (prefers-reduced-motion: reduce) { .fa-card, .fa-photo img { transition: none; } }

/* Einzelalbum: volle Breite, ohne Theme-Seitenleiste (Fallback, falls der Layout-Filter nicht greift) */
body.single-fotoalbum #right-sidebar,
body.single-fotoalbum #left-sidebar { display: none; }
body.single-fotoalbum #primary,
body.single-fotoalbum .content-area { width: 100%; border: 0; padding-right: 0; }