/* ============================================================================
   CLS Prevention - Ad Container Min-Height Rules
   HERA-3158: Prevent Cumulative Layout Shift with reserved space
   ============================================================================ */

/* CSS Custom Properties for Standard IAB Ad Sizes */
:root {
  --ad-leaderboard-height: 90px;        /* 728x90 */
  --ad-medium-rectangle-height: 250px;  /* 300x250 */
  --ad-wide-skyscraper-height: 600px;   /* 160x600 */
  --ad-mobile-banner-height: 50px;      /* 320x50 */
  --ad-mobile-leaderboard-height: 100px;/* 320x100 */
  --ad-billboard-height: 250px;         /* 970x250 */
  --ad-half-page-height: 600px;         /* 300x600 */
}

/* Base Ad Slot - Reserve Space for CLS Prevention */
.mycode-connect-ad-slot {
  min-height: var(--ad-medium-rectangle-height);
}

/* Mobile: Reserve space based on mobile ad sizes */
@media (max-width: 767px) {
  .mycode-connect-ad-slot {
    min-height: var(--ad-mobile-banner-height);
  }

  .mycode-connect-ad-slot[data-size*="320x50"],
  .mycode-connect-ad-slot[data-size*="[320,50]"] {
    min-height: var(--ad-mobile-banner-height);
  }

  .mycode-connect-ad-slot[data-size*="320x100"],
  .mycode-connect-ad-slot[data-size*="[320,100]"] {
    min-height: var(--ad-mobile-leaderboard-height);
  }

  .mycode-connect-ad-slot[data-size*="300x250"],
  .mycode-connect-ad-slot[data-size*="[300,250]"] {
    min-height: var(--ad-medium-rectangle-height);
  }
}

/* Tablet and Desktop: Reserve space based on desktop ad sizes */
@media (min-width: 768px) {
  .mycode-connect-ad-slot[data-size*="728x90"],
  .mycode-connect-ad-slot[data-size*="[728,90]"] {
    min-height: var(--ad-leaderboard-height);
  }

  .mycode-connect-ad-slot[data-size*="300x250"],
  .mycode-connect-ad-slot[data-size*="[300,250]"] {
    min-height: var(--ad-medium-rectangle-height);
  }

  .mycode-connect-ad-slot[data-size*="160x600"],
  .mycode-connect-ad-slot[data-size*="[160,600]"] {
    min-height: var(--ad-wide-skyscraper-height);
  }

  .mycode-connect-ad-slot[data-size*="300x600"],
  .mycode-connect-ad-slot[data-size*="[300,600]"] {
    min-height: var(--ad-half-page-height);
  }

  .mycode-connect-ad-slot[data-size*="970x250"],
  .mycode-connect-ad-slot[data-size*="[970,250]"] {
    min-height: var(--ad-billboard-height);
  }
}

/* Large Desktop */
@media (min-width: 1024px) {
  .mycode-connect-ad-slot[data-size*="970x90"],
  .mycode-connect-ad-slot[data-size*="[970,90]"] {
    min-height: var(--ad-leaderboard-height);
  }
}

/* Shortcode Container - CLS Prevention */
.mycode-connect-shortcode-container {
  min-height: var(--ad-medium-rectangle-height);
}