/* ============================================
   MODEFREEFINDS.COM - COMPLETE CSS
   Merged: Existing + New Ad Fixes
   Date: December 15, 2025
   ============================================ */


/* ===========================================
   SECTION 1: OVERFLOW & LAYOUT PROTECTION
   (Your existing styles - kept as-is)
   =========================================== */

/* Contain accidental overflows on mobile */
html, body { overflow-x: hidden !important; }

/* Ensure embeds don't exceed viewport */
img, video, iframe { max-width: 100% !important; }

/* Guard full-width sections */
.alignfull,
.wp-block-cover.alignfull,
.wp-block-group.alignfull {
  overflow-x: clip;
}

/* Safety net for columns/rows */
.wp-block-columns,
.wp-block-group {
  max-width: 100% !important;
}

/* Defensive rule for ad/3P containers */
body * { word-break: break-word; }


/* ===========================================
   SECTION 2: FEATURED IMAGE STYLING
   (Your existing styles - kept as-is)
   =========================================== */

.wp-block-post-featured-image {
  width: 100% !important;
  max-width: 100% !important;
  margin: 0 auto;
  display: block;
}

.wp-block-post-featured-image img {
  width: 100% !important;
  max-width: 100% !important;
}


/* ===========================================
   SECTION 3: EXPIRED POSTS STYLING
   (Your existing styles - kept as-is)
   =========================================== */

/* Gray out expired post images */
.blog article.category-expired .wp-block-post-featured-image img,
.archive article.category-expired .wp-block-post-featured-image img,
.blog .wp-block-post.category-expired .wp-block-post-featured-image img,
.archive .wp-block-post.category-expired .wp-block-post-featured-image img,
.blog article.category-expired .wp-block-cover,
.archive article.category-expired .wp-block-cover,
.blog .wp-block-post.category-expired .wp-block-cover,
.archive .wp-block-post.category-expired .wp-block-cover,
.blog article.category-expired .wp-block-cover__image-background,
.archive article.category-expired .wp-block-cover__image-background,
.blog .wp-block-post.category-expired .wp-block-cover__image-background,
.archive .wp-block-post.category-expired .wp-block-cover__image-background {
  filter: grayscale(100%) contrast(.9) brightness(.95);
}

/* Positioning for expired badge */
.blog article.category-expired,
.archive article.category-expired,
.blog .wp-block-post.category-expired,
.archive .wp-block-post.category-expired {
  position: relative;
  overflow: hidden;
}

/* Expired pill badge - purple gradient */
.blog article.category-expired::before,
.archive article.category-expired::before,
.blog .wp-block-post.category-expired::before,
.archive .wp-block-post.category-expired::before {
  content: "Expired";
  position: absolute;
  top: 10px;
  left: 50%;
  transform: translateX(-50%);
  background: linear-gradient(90deg, #7c3aed, #ec4899);
  color: #fff;
  font-weight: 800;
  letter-spacing: .04em;
  padding: 6px 14px;
  border-radius: 9999px;
  z-index: 10;
  pointer-events: none;
  box-shadow: 0 2px 6px rgba(0,0,0,.15);
  text-shadow: 0 1px 2px rgba(0,0,0,.25);
}

/* Disable clicks on expired posts */
.blog article.category-expired a,
.archive article.category-expired a,
.blog .wp-block-post.category-expired a,
.archive .wp-block-post.category-expired a {
  pointer-events: none;
  cursor: not-allowed;
}


/* ===========================================
   SECTION 4: COLUMNS GRID LAYOUT
   (Your existing styles - kept as-is)
   =========================================== */

.columns-3 {
  max-width: 70% !important;
  width: 70% !important;
  margin: 0 auto !important;
  display: grid !important;
  grid-template-columns: repeat(3, 1fr) !important;
  gap: 1rem !important;
  overflow: hidden !important;
}

/* Tablet */
@media (max-width: 768px) {
  .columns-3 {
    max-width: 100% !important;
    width: 100% !important;
    grid-template-columns: repeat(2, 1fr) !important;
  }
}

/* Mobile */
@media (max-width: 480px) {
  .columns-3 {
    max-width: 100% !important;
    width: 100% !important;
    grid-template-columns: repeat(1, 1fr) !important;
  }
}

/* Homepage columns */
body.home .columns-3,
body.blog .columns-3 {
  width: 100% !important;
  max-width: 100% !important;
  margin: 0 !important;
}


/* ===========================================
   SECTION 5: AD PADDING & SPACING
   ★ NEW - Fixes tight ad placement ★
   =========================================== */

/* Ezoic Ad Containers - breathing room */
[id*="ezoic-pub-ad-placeholder"],
[id*="ezoic-ad"],
.ezoic-ad,
.ez-video-wrap,
.ezoic-ad-adaptive {
  margin: 24px auto !important;
  padding: 12px 0 !important;
  max-width: 100% !important;
  box-sizing: border-box !important;
}



/* Google AdSense */
.adsbygoogle,
ins.adsbygoogle {
  margin: 20px auto !important;
  display: block;
}

/* Sidebar Ads */
.sidebar [id*="ezoic"],
.widget-area [id*="ezoic"],
aside [id*="ezoic"] {
  margin-bottom: 20px !important;
}

/* Sticky Footer Ad shadow */
.ezoic-floating-bottom {
  box-shadow: 0 -2px 10px rgba(0,0,0,0.1);
}


/* ===========================================
   SECTION 6: CONTENT/AD SEPARATION
   ★ NEW - Better visual flow ★
   =========================================== */

/* Space between paragraphs and ads */
.entry-content p + [id*="ezoic"],
.entry-content [id*="ezoic"] + p,
.post-content p + [id*="ezoic"],
.post-content [id*="ezoic"] + p {
  margin-top: 28px;
}

/* Space between lists and ads */
.entry-content ul + [id*="ezoic"],
.entry-content ol + [id*="ezoic"],
.entry-content [id*="ezoic"] + ul,
.entry-content [id*="ezoic"] + ol {
  margin-top: 24px;
}


/* ===========================================
   SECTION 7: MOBILE AD OPTIMIZATIONS
   ★ NEW - Mobile-specific fixes ★
   =========================================== */

/* Fix consent overlay mobile overflow */
#_cm-css-reset,
[id*="cm-cookie"],
.cookie-consent-overlay {
  max-width: 100vw !important;
  overflow-x: hidden !important;
  box-sizing: border-box !important;
}

/* Long URLs in Privacy/Terms */
.privacy-policy-content a,
.terms-content a,
.entry-content a {
  word-break: break-all;
  hyphens: auto;
}

/* Responsive tables */
.entry-content table,
.post-content table {
  display: block;
  max-width: 100%;
  overflow-x: auto;
}

@media screen and (max-width: 768px) {
  /* Ad overflow prevention */
  [id*="ezoic"],
  [id*="taboola"],
  .adsbygoogle,
  iframe[id*="google_ads"] {
    max-width: 100% !important;
    box-sizing: border-box !important;
    overflow: hidden !important;
  }

  /* Tighter ad margins on mobile */
  [id*="ezoic-pub-ad-placeholder"],
  .ezoic-ad {
    margin: 16px auto !important;
    padding: 8px 0 !important;
  }

  /* Taboola mobile spacing */
  [id*="taboola-"] {
    margin: 20px -10px !important;
    padding: 15px 10px !important;
  }
}


/* ===========================================
   END OF MODEFREEFINDS CSS
   =========================================== */