/* SAFE PATCH 337
   Clean Desktop Mosaic Layer 2026
   - Saubere neue Mosaic-Ebene NUR für echte Detail-Galerien
   - Original-Galerie bleibt technisch erhalten
   - Desktop: JS baut neue Mosaic-Ebene aus den Originalbildern
   - Mobile/iPhone/Android/Tablet: normale Galerie bleibt sichtbar
*/

@media (hover:hover) and (pointer:fine) and (min-width:901px){
  body.gg-clean-mosaic-ready .gg-gallery-real{
    background:#050505 !important;
    border-color:rgba(229,9,20,.18) !important;
  }

  body.gg-clean-mosaic-ready .gg-gallery-real > .gg-photo-grid{
    display:none !important;
  }



  /* SAFE PATCH 337: Original-Untergalerie sicher verstecken,
     sobald die neue Mosaic-Ebene erzeugt wurde. */
  body.gg-clean-mosaic-ready .gg-gallery-real .gg-photo-grid.gg-clean-source-grid,
  body.gg-clean-mosaic-ready .gg-gallery-real .gg-clean-mosaic-layer + .gg-photo-grid,
  .gg-gallery-real .gg-photo-grid.gg-clean-source-grid{
    display:none !important;
    visibility:hidden !important;
    height:0 !important;
    overflow:hidden !important;
    margin:0 !important;
    padding:0 !important;
  }

  .gg-clean-mosaic-layer{
    --gg-clean-columns:6;
    --gg-clean-gap:18px;
    display:block !important;
    columns:var(--gg-clean-columns) !important;
    column-gap:var(--gg-clean-gap) !important;
    width:100% !important;
    line-height:0 !important;
    margin-top:18px !important;
  }

  .gg-clean-mosaic-card{
    display:block !important;
    width:100% !important;
    height:auto !important;
    min-height:0 !important;
    max-height:none !important;
    margin:0 0 var(--gg-clean-gap) 0 !important;
    padding:0 !important;
    break-inside:avoid !important;
    page-break-inside:avoid !important;
    -webkit-column-break-inside:avoid !important;
    border-radius:10px !important;
    overflow:visible !important;
    background:transparent !important;
    line-height:0 !important;
    position:relative !important;
    z-index:1 !important;
    cursor:default !important;
  }

  .gg-clean-mosaic-card img{
    display:block !important;
    width:100% !important;
    height:auto !important;
    max-height:none !important;
    min-height:0 !important;
    aspect-ratio:auto !important;
    object-fit:initial !important;
    object-position:center center !important;
    border-radius:10px !important;
    background:transparent !important;
    transform:none;
    filter:none;
    box-shadow:none;
    transition:transform .18s ease, filter .18s ease, box-shadow .18s ease !important;
    will-change:transform, filter !important;
    cursor:default !important;
  }

  .gg-clean-mosaic-card:hover{
    z-index:999 !important;
  }

  .gg-clean-mosaic-card:hover img,
  .gg-clean-mosaic-card.gg-clean-hover img{
    transform:scale(1.045) !important;
    filter:contrast(1.06) saturate(1.06) brightness(1.02) !important;
    box-shadow:0 18px 55px rgba(0,0,0,.62), 0 0 0 1px rgba(229,9,20,.36) !important;
  }

  .gg-clean-preview{
    position:fixed !important;
    z-index:999999 !important;
    display:none;
    pointer-events:none !important;
    opacity:0;
    transform:translate3d(0,8px,0) scale(.99);
    transition:opacity .12s ease, transform .12s ease;
    padding:8px !important;
    border-radius:16px !important;
    background:rgba(0,0,0,.82) !important;
    border:1px solid rgba(229,9,20,.34) !important;
    box-shadow:0 24px 90px rgba(0,0,0,.80), 0 0 45px rgba(229,9,20,.20) !important;
    backdrop-filter:blur(10px);
  }

  .gg-clean-preview.is-visible{
    display:block !important;
    opacity:1 !important;
    transform:translate3d(0,0,0) scale(1) !important;
  }

  .gg-clean-preview img{
    display:block !important;
    width:auto !important;
    height:auto !important;
    max-width:min(72vw, 1360px) !important;
    max-height:88vh !important;
    object-fit:contain !important;
    border-radius:10px !important;
    background:#050505 !important;
  }

  .gg-clean-preview.is-portrait img{
    max-width:min(46vw, 850px) !important;
    max-height:91vh !important;
  }

  .gg-clean-preview.is-landscape img{
    max-width:min(74vw, 1400px) !important;
    max-height:86vh !important;
  }
}