/* =========================================================================
   QUADRONET Layout - Lightbox in Markenfarben (23.10.2026)
   -------------------------------------------------------------------------
   GLightbox + content-lightbox.css kommen aus qn_masonry_gallery und
   bringen das Weinrot von Weingut Hitziger mit (rgba(114,47,55,...)).
   Diese Datei wird von Partials/Media/Vergroesserung.html NACH
   content-lightbox.css per f:asset.css geladen - nur auf Seiten mit
   vergroesserbaren Bildern.

   Bewusst OHNE @layer: Die Bibliotheks-Stile sind ungeschichtet; eine
   Regel in qn.theme wuerde gegen sie immer verlieren. !important nur dort,
   wo content-lightbox.css selbst !important setzt (Diashow-Knopf).
   ========================================================================= */

/* Abdunkelung: Carbon statt Schwarz */
.goverlay {
  background: rgba(13, 20, 25, .94) !important;
}

/* Vor / Zurueck / Schliessen: dunkle Kachel mit oranger Kante */
.glightbox-clean .gnext,
.glightbox-clean .gprev,
.glightbox-clean .gclose {
  background-color: rgba(26, 33, 40, .9);
  border: 1px solid rgba(255, 136, 0, .55);
}
.glightbox-clean .gnext:hover,
.glightbox-clean .gprev:hover,
.glightbox-clean .gclose:hover {
  background-color: #FF8800;
}
.glightbox-clean .gnext:focus-visible,
.glightbox-clean .gprev:focus-visible,
.glightbox-clean .gclose:focus-visible {
  outline: 2px solid #FFA94D;
  outline-offset: 3px;
}

/* Diashow-Knopf (setzt content-lightbox.js ein) */
.qn-glightbox-slideshow-btn {
  background-color: rgba(26, 33, 40, .92) !important;
  border: 1px solid rgba(255, 136, 0, .55) !important;
}
.qn-glightbox-slideshow-btn:hover {
  background-color: #FF8800 !important;
}
.qn-glightbox-slideshow-btn:focus {
  outline: 2px solid #FFA94D !important;
}

/* Bildtext unter dem Bild: dunkel statt weiss, gut lesbar */
.glightbox-clean .gslide-description {
  background: #1A2128;
}
.glightbox-clean .gslide-title {
  color: #E9EEF2;
  margin-bottom: 0;
}
.glightbox-clean .gslide-desc {
  color: #B8C2CC;
}

/* Bildschirmfotos nicht beim Ueberfahren vergroessern - das Raster soll
   ruhig stehen. Der Zeiger (zoom-in) zeigt genug. */
.frame a.glightbox:hover img {
  transform: none;
  opacity: 1;
}
.frame a.glightbox:hover {
  outline: 2px solid #FF8800;
  outline-offset: 2px;
}