/* ============================================================
   LucidHive Ad Engine — Edge-to-Edge Ad Splitters & Zones
   ============================================================ */

/* --- Sitewide Edge-to-Edge Ad Splitter --- */
.lh-ad-splitter {
  display: block;
  width: 100vw;
  margin-left: calc(-50vw + 50%);
  margin-right: calc(-50vw + 50%);
  padding: 20px calc(50vw - 50%);
  background: var(--ad-bg, #0a0a0a);
  border-top: 1px solid rgba(255,255,255,0.05);
  border-bottom: 1px solid rgba(255,255,255,0.05);
  box-sizing: border-box;
  overflow: hidden;
}

.lh-ad-splitter .lh-ad-label {
  text-align: center;
  font-size: 10px;
  letter-spacing: 2px;
  text-transform: uppercase;
  color: rgba(255,255,255,0.25);
  margin-bottom: 8px;
  font-family: inherit;
}

.lh-ad-splitter .lh-ad-slot {
  width: 100%;
  max-width: var(--ad-max-width, 900px);
  min-height: var(--ad-height, 90px);
  margin: 0 auto;
  display: flex;
  align-items: center;
  justify-content: center;
}

.lh-ad-placeholder {
  width: 100%;
  height: 100%;
  min-height: inherit;
  display: flex;
  align-items: center;
  justify-content: center;
  border: 1px dashed rgba(255,255,255,0.08);
  border-radius: 4px;
  background: rgba(255,255,255,0.02);
}

.lh-ad-size {
  font-size: 11px;
  color: rgba(255,255,255,0.15);
  letter-spacing: 1px;
}

/* --- Responsive Ad Zones 300x600 -> 900px --- */
.lh-ad-zone-responsive {
  display: block;
  width: 100vw;
  margin-left: calc(-50vw + 50%);
  margin-right: calc(-50vw + 50%);
  padding: 20px calc(50vw - 50%);
  background: var(--ad-bg, #0d0d0d);
  border-top: 1px solid rgba(255,255,255,0.05);
  border-bottom: 1px solid rgba(255,255,255,0.05);
  box-sizing: border-box;
}

.lh-ad-zone-responsive .lh-ad-label {
  text-align: center;
  font-size: 10px;
  letter-spacing: 2px;
  text-transform: uppercase;
  color: rgba(255,255,255,0.2);
  margin-bottom: 8px;
}

.lh-ad-zone-responsive .lh-ad-clamp {
  width: 100%;
  max-width: var(--ad-max-w, 900px);
  min-height: var(--ad-min-h, 90px);
  margin: 0 auto;
  display: flex;
  align-items: center;
  justify-content: center;
}

/* Clamp width from min to max based on viewport */
@media (min-width: 768px) {
  .lh-ad-zone-responsive .lh-ad-clamp {
    width: clamp(var(--ad-min-w, 300px), 60vw, var(--ad-max-w, 900px));
  }
}

/* --- Slider Between Posts --- */
.lh-slider-between {
  display: block;
  width: 100vw;
  margin-left: calc(-50vw + 50%);
  margin-right: calc(-50vw + 50%);
  padding: 20px calc(50vw - 50%) 30px;
  background: #0a0a0a;
  border-top: 1px solid rgba(255,255,255,0.05);
  border-bottom: 1px solid rgba(255,255,255,0.05);
}

.lh-slider-between .lh-slider-content {
  max-width: 1200px;
  margin: 0 auto;
}

.lh-slider-between .lh-ad-label {
  text-align: center;
  font-size: 10px;
  letter-spacing: 2px;
  text-transform: uppercase;
  color: rgba(255,255,255,0.2);
  margin-bottom: 12px;
}

/* --- ALM Infinite Scroll -- Ensure loaded posts get proper spacing --- */
.alm-listing .alm-posts-wrapper .lh-ad-splitter,
.alm-listing .lh-ad-splitter {
  grid-column: 1 / -1;
  width: 100%;
}

/* Make ad splitter span full width in Foxiz grid layouts */
.block-wrap .lh-ad-splitter,
.blog-content .lh-ad-splitter {
  grid-column: 1 / -1;
  width: 100vw;
  margin-left: calc(-50vw + 50%);
  margin-right: calc(-50vw + 50%);
}

/* --- Dark mode support for Foxiz --- */
[data-mode="dark"] .lh-ad-splitter,
[data-mode="dark"] .lh-ad-zone-responsive,
[data-mode="dark"] .lh-slider-between {
  border-top-color: rgba(255,255,255,0.08);
  border-bottom-color: rgba(255,255,255,0.08);
}

/* --- Edge case: inside Foxiz container fix --- */
.rb-container .lh-ad-splitter,
.edge-padding .lh-ad-splitter {
  width: auto;
  margin-left: 0;
  margin-right: 0;
}

/* --- Print styles --- */
@media print {
  .lh-ad-splitter,
  .lh-ad-zone-responsive,
  .lh-slider-between {
    display: none;
  }
}