/* --------------------------------------------------
Steuerung Anzeige "Bild vergrößern?" unter dem Image
Bedingungen:
 - nur auf Touchscreens
 - nur wenn Display mind. 960px
--------------------------------------------------
Grundlayout
-------------------------------------------------- */
.image-zoom-wrapper { display: inline-block; }
.image-zoom-link { position: relative; display: block; text-decoration: none !important; }
.image-zoom { display: block; max-width: 100%; height: auto; }

/* --------------------------------------------------
Hinweis "Bild vergrößern" standardmäßig ausblenden
-------------------------------------------------- */
.zoom-hint, 
.touch-zoom-link { display: none; }

/* --------------------------------------------------
Touch-Link grundsätzlich von allen Link-Unterstreichungen befreien
-------------------------------------------------- */
a.touch-zoom-link,
a.touch-zoom-link:hover,
a.touch-zoom-link:focus,
a.touch-zoom-link:active,
a.touch-zoom-link:visited { text-decoration: none !important; }

/* --------------------------------------------------
Lupe ausdrücklich als eigenes Element behandeln
-------------------------------------------------- */
.touch-zoom-link .zoom-icon { display: inline-block; flex: 0 0 auto; text-decoration: none !important; }

/* --------------------------------------------------
Nur der eigentliche Text wird unterstrichen
-------------------------------------------------- */
.touch-zoom-link 
.zoom-text { display: inline-block; text-decoration-line: underline; }

/* --------------------------------------------------
Geräte mit Maus / Trackpad
Hover-Hinweis "Vergrößern?"
-------------------------------------------------- */
@media (hover: hover) and (pointer: fine) {
.image-zoom-link:hover
.zoom-hint { display: block; position: absolute; left: 50%; bottom: 15px; transform: translateX(-50%); padding: 6px 12px; color: #fff;
	background: rgba(0, 0, 0, 0.75); font-size: 10pt; line-height: 1.2; border-radius: 3px; white-space: nowrap; pointer-events: none; }
}

/* --------------------------------------------------
Touch-Geräte ab 960 px
-------------------------------------------------- */
@media (hover: none) and (pointer: coarse) and
       (min-width: 960px) and (any-pointer: coarse) {
a.touch-zoom-link { display: inline-flex; align-items: center; gap: 5px; margin-top: 6px; font-size: 10pt;
	line-height: 1.4; text-decoration: none !important; cursor: pointer; }
}

/* --------------------------------------------------
Unter 960 px: beide Hinweise zwingend ausblenden
-------------------------------------------------- */
@media (max-width: 959px) {
.zoom-hint,
.touch-zoom-link {
	display: none !important; }
}