/* Ergänzungen zum übernommenen Stylesheet (site.css) – Custom CMS */
/* Die Bildpipeline (lib/publish.php) schreibt width/height des Originals ans <img>. Wo site.css nur die
   Breite festlegt, bliebe sonst die Pixelhöhe stehen. :where() hat keine Spezifität – jede Regel aus
   site.css (z. B. Galerie height:300px) gewinnt weiterhin. Seitenverhältnisse stehen inline (thorus_img). */
:where(img) { height: auto; max-width: 100%; }
picture { display: contents; }

/* Videos in Galerien: Play-Symbol in der Mitte (Galerie-Block und Anlass-Seite, thorus_galerie_element()).
   Ersetzt das kleine «Video»-Etikett aus dem übernommenen Stylesheet. */
.gallery-item .gallery-media.is-video { position: relative; display: block; }
.gallery-item .gallery-media.is-video::after {
  content: ''; position: absolute; left: 50%; top: 50%; width: 64px; height: 64px; margin: -32px 0 0 -32px;
  border-radius: 50%; background: rgba(0, 0, 0, .45) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M9 6.5v11l9-5.5z' fill='%23fff'/%3E%3C/svg%3E") center / 30px no-repeat;
  border: 2px solid rgba(255, 255, 255, .85); box-shadow: 0 2px 10px rgba(0, 0, 0, .35);
  pointer-events: none; transition: transform .2s ease, background-color .2s ease;
}
.gallery-item .gallery-media.is-video:hover::after { transform: scale(1.08); background-color: rgba(0, 0, 0, .65); }
.gallery-item .video-badge { display: none; }
@media (max-width: 768px) { .gallery-item .gallery-media.is-video::after { width: 52px; height: 52px; margin: -26px 0 0 -26px; background-size: 24px; } }
