
/* =========================================================
   CHOR RAPPACH – FLYER POPUP
   ========================================================= */

.flyer-popup{
  width:min(960px,calc(100vw - 32px));
  max-width:none;

  height:auto;
  max-height:calc(100dvh - 32px);

  margin:auto;
  padding:0;

  border:0;
  border-radius:18px;

  background:#071f16;

  box-shadow:
    0 30px 110px rgba(0,0,0,.58);

  overflow:hidden;
}

.flyer-popup::backdrop{
  background:rgba(1,15,10,.88);

  backdrop-filter:blur(7px);
  -webkit-backdrop-filter:blur(7px);
}

.flyer-popup-inner{
  position:relative;

  display:flex;
  align-items:center;
  justify-content:center;

  width:100%;
  height:100%;

  min-height:300px;
  max-height:calc(100dvh - 32px);

  padding:22px;

  background:
    radial-gradient(
      circle at center,
      rgba(255,255,255,.06),
      transparent 68%
    );
}

.flyer-popup-image{
  display:block;

  width:auto;
  height:auto;

  max-width:100%;
  max-height:calc(100dvh - 76px);

  object-fit:contain;

  border-radius:8px;

  box-shadow:
    0 18px 55px rgba(0,0,0,.38);
}

.flyer-popup-close{
  position:absolute;

  top:14px;
  right:14px;

  z-index:10;

  width:44px;
  height:44px;

  display:grid;
  place-items:center;

  padding:0;

  border:1px solid rgba(255,255,255,.35);
  border-radius:50%;

  background:rgba(6,63,38,.94);
  color:#fff;

  font-size:18px;

  cursor:pointer;

  box-shadow:
    0 8px 24px rgba(0,0,0,.28);

  transition:
    transform .2s ease,
    background .2s ease,
    color .2s ease;
}

.flyer-popup-close:hover{
  transform:scale(1.06);

  background:#d2aa52;
  color:#142f20;
}


/* Detailseiten-Flyer zeigt an, dass er anklickbar ist */

body img[src*="rudel-karaoke-30-10-2026"]{
  cursor:zoom-in;
}


@media(max-width:680px){

  .flyer-popup{
    width:calc(100vw - 12px);
    max-height:calc(100dvh - 12px);

    border-radius:13px;
  }

  .flyer-popup-inner{
    max-height:calc(100dvh - 12px);

    padding:8px;
  }

  .flyer-popup-image{
    max-height:calc(100dvh - 28px);

    border-radius:6px;
  }

  .flyer-popup-close{
    top:9px;
    right:9px;

    width:40px;
    height:40px;
  }

}

/* ======================================================= */
