/**
 * @file ad-banners.css
 * Verid — Werbebannerplatzhalter (Symplr / MSO Digital)
 *
 * Vollständige Slot-Liste — alle Symplr-IDs vorbereitet:
 *   #weltderbwl_bb_1          Billboard       970×250  (oberhalb Inhalt, volle Breite)
 *   #weltderbwl_lb_1          Leaderboard     728×90   (unter Artikel-Headline)
 *   #weltderbwl_incontent_1   In-Content 1   300×250   (nach ~4. Absatz, per JS injiziert)
 *   #weltderbwl_incontent_2   In-Content 2   300×250   (am Ende des Artikels)
 *   #weltderbwl_sitebar_1     Sitebar 1      300×250   (Sidebar)
 *   #weltderbwl_sitebar_2     Sitebar 2      300×250   (Sidebar, unter Sitebar 1)
 *   #weltderbwl_sky_1         Skyscraper     160×600   (Desktop, außen seitlich)
 *   #weltderbwl_sticky_footer Sticky Footer  728×90    (fixiert am unteren Bildschirmrand)
 *
 *   Interstitial + Outstream Video + Teads + Seedtag:
 *   kein DOM-Container — vollständig von Symplr/SDK gesteuert.
 *
 * Live-Aktivierung:
 *   1. Symplr-Script in verid.theme einkommentieren (cdns.symplr.de/…/welt-der-bwl.js)
 *   2. .verid-ad__label + ::before-Pseudo-Element per CSS ausblenden
 *   3. Hintergrundfüllung entfernen (Symplr füllt die Slots selbst)
 */

/* ─── Werbung auf bestimmten Seiten ausblenden ──────────────── */

.verid-no-ads .verid-ad,
.verid-no-ads .verid-ad-wrap--billboard {
  display: none !important;
}

/* ─── Basis ────────────────────────────────────────────────── */

.verid-ad {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  overflow: hidden;
  position: relative;
}

/* Platzhalter-Label ausblenden (Live-Betrieb) */
.verid-ad::before {
  content: none;
}

.verid-ad__label {
  display: none;
}

/* ─── Leaderboard (728 × 90 px) ────────────────────────────── */
/* Position: direkt unterhalb der Artikel-Überschrift           */

.verid-ad--leaderboard {
  width: 100%;
  max-width: 728px;
  height: 90px;
  margin: 1.25rem auto 1.75rem;
}

/* ─── Sidebar Rectangle (300 × 250 px) ─────────────────────── */
/* Position: Sidebar, unterhalb der Buchnavigation              */

.verid-ad--sidebar-rect {
  width: 100%;
  max-width: 300px;
  height: 250px;
  margin: 1.5rem auto 0;
}

/* ─── Billboard (970 × 250 px) ─────────────────────────────── */
/* #weltderbwl_bb_1 — unterhalb Navigation, volle Seitenbreite  */

.verid-ad-wrap--billboard {
  width: 100%;
}

.verid-ad--billboard {
  width: 100%;
  max-width: 970px;
  height: 250px;
  margin: 0 auto;
  border: none;
  border-radius: 0;
  background: transparent;
}

/* ─── In-Content (300 × 250 px) ────────────────────────────── */
/* #weltderbwl_incontent_1 — per JS nach 4. Absatz injiziert    */
/* #weltderbwl_incontent_2 — Ende des Artikels, vor Pager       */

.verid-ad--incontent {
  width: 100%;
  max-width: 300px;
  height: 250px;
  margin: 2rem auto;
}

/* ─── Sitebar 2 (300 × 250 px) ─────────────────────────────── */
/* #weltderbwl_sitebar_2 — Sidebar, unterhalb Sitebar 1         */

.verid-ad--sidebar-rect-2 {
  margin-top: 1.25rem;
}

/* ─── Skyscraper (160 × 600 px) ────────────────────────────── */
/* #weltderbwl_sky_1 — Desktop only, außen seitlich             */
/* Sitzt in der Sidebar-Wrapper-Spalte und wird per CSS          */
/* als sticky außerhalb des Content-Bereichs positioniert        */

.verid-ad--skyscraper {
  width: 160px;
  height: 600px;
  margin: 1.5rem auto 0;
  position: sticky;
  top: 1.5rem;
}

/* ─── Sticky Footer (728 × 90 px) ──────────────────────────── */
/* #weltderbwl_sticky_footer — fixiert am unteren Bildschirmrand */

.verid-ad--sticky-footer {
  position: fixed;
  bottom: 0;
  left: 50%;
  transform: translateX(-50%);
  width: 100%;
  max-width: 728px;
  height: 90px;
  z-index: 900;
  border-radius: 0;
  border-left: none;
  border-right: none;
  border-bottom: none;
  box-shadow: 0 -2px 8px rgba(0, 0, 0, 0.12);
}

/* ─── Responsive ────────────────────────────────────────────── */

@media (max-width: 800px) {
  /* Billboard auf Mobile: Mobile-Größe (320×100) */
  .verid-ad--billboard {
    height: 100px;
  }

  /* Leaderboard auf Mobile ausblenden */
  .verid-ad--leaderboard {
    display: none;
  }

  /* Sidebar-Rectangle: etwas kompakter */
  .verid-ad--sidebar-rect {
    max-width: 100%;
    height: 180px;
  }

  /* Skyscraper nur auf Desktop */
  .verid-ad--skyscraper {
    display: none;
  }

  /* Sticky Footer: Mobile-Größe (320×50) */
  .verid-ad--sticky-footer {
    max-width: 100%;
    height: 50px;
  }
}

@media (min-width: 801px) and (max-width: 1023px) {
  /* Billboard auf Tablet: 728×90 */
  .verid-ad--billboard {
    height: 90px;
  }

  .verid-ad--skyscraper {
    display: none;
  }
}
