/* Site-wide ad slot constraints to prevent layout shifts and ensure consistent spacing */
.ad-slot {
  position: relative;
  margin: 18px auto;
  width: min(100%, 1200px);
  min-height: var(--ad-h, 120px);
  background: transparent;
}

/* Centering helper */
.ad-slot.ad-center { text-align: center; }

/* Skeleton placeholder to stabilize layout before fill */
.ad-slot::before {
  content: "";
  display: block;
  height: var(--ad-h, 120px);
  background: linear-gradient(90deg, rgba(0,0,0,0.06), rgba(0,0,0,0.1), rgba(0,0,0,0.06));
  background-size: 240px 100%;
  animation: ad-skeleton 1.2s ease-in-out infinite;
  border-radius: 10px;
}

/* When AdSense fills, hide placeholder to reveal the ad */
.ad-slot.ad-filled::before { display: none; }

/* If unfilled or timed out, keep a compact placeholder to avoid large blank gaps */
.ad-slot.ad-timeout::before {
  height: clamp(40px, calc(var(--ad-h, 120px) * 0.45), 90px);
  opacity: 0.55;
}

/* If confirmed unfilled, collapse entirely and remove margin */
.ad-slot.ad-collapsed {
  margin: 0 !important;
  min-height: 0 !important;
}
.ad-slot.ad-collapsed::before { display: none; }

/* Normalize AdSense container sizing */
.ad-slot ins.adsbygoogle {
  display: block !important;
  width: 100% !important;
  min-height: var(--ad-h, 120px) !important;
}

/* Kinds (fine-tuned defaults) */
.ad-slot.ad-banner { --ad-h: 120px; }
.ad-slot.ad-in-article { --ad-h: 180px; }
.ad-slot.ad-rectangle { --ad-h: 250px; }

/* Responsive tweaks */
@media (max-width: 991.98px) {
  .ad-slot { width: min(100%, 980px); margin: 14px auto; }
  .ad-slot.ad-banner { --ad-h: 100px; }
  .ad-slot.ad-rectangle { --ad-h: 250px; }
}
@media (max-width: 575.98px) {
  .ad-slot { width: 100%; margin: 12px auto; }
  .ad-slot.ad-banner { --ad-h: 90px; }
  .ad-slot.ad-in-article { --ad-h: 160px; }
}

@keyframes ad-skeleton {
  0% { background-position: -240px 0; }
  100% { background-position: 240px 0; }
}

/* Fix AdSense Auto Ads breaking flex row layouts */
.row > .google-auto-placed,
.row > ins.adsbygoogle {
  width: 100% !important;
  flex: 0 0 100% !important;
  text-align: center;
  clear: both;
  margin: 15px 0 !important;
}