/* ==========================================================
   Regio360 – AudioPlayer für POIs (InfoWindow)
   Gilt für ALLE POIs mit .audio-player innerhalb .poi-card
   ========================================================== */

/* Grundlayout im InfoWindow */
.poi-card .audio-player {
  position: static;
  top: auto;
  left: auto;
  transform: none;

  width: 100%;
  max-width: 100%;
  box-sizing: border-box;

  margin: 10px 0 6px 0;

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

  overflow: hidden;
}

/* Text darf im Flex-Layout umbrechen */
.poi-card .audio-label {
  flex: 1 1 auto;
  min-width: 0;

  white-space: normal;
  line-height: 1.2;

  overflow-wrap: anywhere;
  word-break: break-word;
}

/* ==========================================
   Mobile Optimierung
   ========================================== */
@media (max-width: 480px) {

  /* POI-Card begrenzen, damit InfoWindow nicht "aufzieht" */
  .poi-card {
    width: min(340px, calc(100vw - 28px));
    max-width: 100%;
    box-sizing: border-box;
      margin-top: 10px;
  }

  .poi-card .audio-label {
    font-size: 11px;
  }

  /* Button & Rahmen dezent (Mobile) */
  .poi-card .audio-button {
    border: 1px solid rgba(30, 70, 120, 0.30) !important;
    background: rgba(255, 255, 255, 0.18) !important;

    outline: none !important;
    box-shadow: none !important;

    -webkit-appearance: none !important;
    appearance: none !important;
    -webkit-tap-highlight-color: transparent;
  }

  .poi-card .audio-player {
    border: 1px solid rgba(30, 70, 120, 0.30) !important;
  }
}



/* Google Maps InfoWindow: AudioPlayer definitiv im Flow halten */
.gm-style-iw .poi-card .audio-player,
.gm-style-iw-d .poi-card .audio-player,
.poi-card .audio-player {
  position: static !important;
  top: auto !important;
  right: auto !important;
  bottom: auto !important;
  left: auto !important;
  inset: auto !important;
  transform: none !important;
}



/* Sicherstellen, dass die POI-Card normal in der IW scroll-area fließt */
.gm-style-iw-d .poi-card {
  position: static !important;
  display: block !important;
}