/* Theme-level fixes for News Hero Slider overlap with following content */

/* Scope to front page common wrappers to avoid side effects */
body.home .nhs-hero, 
body.home .news-hero-slider,
body.home .news-hero-slider-wrapper,
body.home .nhs-slider,
body.home .nhs-wrapper,
body.home .hero-slider,
body.home .nhs-container {
  position: relative; /* create stacking context */
  display: flow-root; /* contain floats */
  isolation: isolate; /* prevent z-index bleed */
  z-index: 1;
}

/* Ensure the slider container contains its children and defines height */
body.home .news-hero-slider,
body.home .news-hero-slider-wrapper,
body.home .nhs-slider,
body.home .hero-slider {
  overflow: hidden; /* contain floats/absolutely positioned slides */
}

/* Add bottom spacing so the next section starts below */
body.home .news-hero-slider,
body.home .news-hero-slider-wrapper,
body.home .nhs-hero,
body.home .hero-slider {
  margin-bottom: 48px !important; /* ensure space to next block */
}

/* If the theme uses negative margins on the next block, neutralize at home */
body.home .site-main > *:first-child.nhs-after, 
body.home .site-main > .content-area:first-child {
  clear: both;
}

/* Guard against slides with absolute positioning overlapping following content */
body.home .news-hero-slider .slide,
body.home .nhs-slider .slide,
body.home .news-hero-slider .swiper-slide,
body.home .nhs-slider .swiper-slide,
body.home .news-hero-slider .slick-slide,
body.home .nhs-slider .slick-slide {
  position: relative;
}

/* Fallback: enforce block formatting context on the slider wrapper */
body.home .news-hero-slider-wrapper::after,
body.home .nhs-wrapper::after,
body.home .hero-slider::after {
  content: "";
  display: block;
  clear: both;
}

/* As a robust fallback, make the main content establish a new block formatting context */
body.home .site-main {
  display: flow-root; /* contains floats and absolutely positioned children */
}

/* Provide a little spacing after the first block on home (typically the slider) */
body.home .site-main > *:first-child {
  margin-bottom: 48px !important;
  /* Make sure the first block (slider section) occupies the full row */
  width: 100% !important;
  max-width: 100% !important;
  flex: 0 0 100% !important; /* if parent is flex */
  float: none !important; /* if theme uses floats */
  clear: both !important;
}

/* Ensure the immediate sibling after slider clears and starts below */
body.home .news-hero-slider + *,
body.home .news-hero-slider-wrapper + *,
body.home .nhs-hero + *,
body.home .nhs-slider + *,
body.home .hero-slider + * {
  clear: both;
  position: relative;
  z-index: 2;
  margin-top: 16px;
  /* Ensure the next block also starts on a new row and uses full width */
  width: 100% !important;
  max-width: 100% !important;
  flex: 0 0 100% !important;
  float: none !important;
}

/* Ensure the block after the slider starts below and sits above any slides */
body.home .site-main > *:nth-child(2),
body.home .content-area,
body.home .home .post-list,
body.home .site-content .post-list,
body.home .site-main .post-list {
  position: relative;
  z-index: 2;
  margin-top: 16px;
}

/* Defensive: avoid zero-height slider wrappers if inner slides are absolute */
body.home .news-hero-slider,
body.home .news-hero-slider-wrapper,
body.home .nhs-hero,
body.home .hero-slider {
  min-height: 1px; /* keep formatting context */
}

/* If the plugin uses absolute positioning on images or slide layers, keep them in-bounds */
body.home .news-hero-slider [class*="slide"],
body.home .nhs-slider [class*="slide"],
body.home .hero-slider [class*="slide"] {
  z-index: 1;
}

/* Responsive safe-guards: avoid zero-height on large screens */
@media (min-width: 992px) {
  body.home .news-hero-slider,
  body.home .news-hero-slider-wrapper,
  body.home .nhs-hero,
  body.home .hero-slider {
    min-height: 420px;
  }
}

@media (max-width: 991.98px) and (min-width: 576px) {
  body.home .news-hero-slider,
  body.home .news-hero-slider-wrapper,
  body.home .nhs-hero,
  body.home .hero-slider {
    min-height: 300px;
  }
}

@media (max-width: 575.98px) {
  body.home .news-hero-slider,
  body.home .news-hero-slider-wrapper,
  body.home .nhs-hero,
  body.home .hero-slider {
    min-height: 220px;
  }
}

/* ============== ABSOLUTE POST CONTAINER RESET (root cause fix) ============== */
/*
  Some themes/plugins may set the post list/container as position:absolute; top:0;
  which causes it to overlap with the hero slider above. The following rules
  explicitly target common post containers that appear AFTER the slider and reset
  them to normal flow on the homepage only.
*/
body.home .news-hero-slider ~ #primary,
body.home .news-hero-slider-wrapper ~ #primary,
body.home .nhs-hero ~ #primary,
body.home .hero-slider ~ #primary,

body.home .news-hero-slider ~ .site-content,
body.home .news-hero-slider-wrapper ~ .site-content,
body.home .nhs-hero ~ .site-content,
body.home .hero-slider ~ .site-content,

body.home .news-hero-slider ~ .site-main,
body.home .news-hero-slider-wrapper ~ .site-main,
body.home .nhs-hero ~ .site-main,
body.home .hero-slider ~ .site-main,

/* common post list wrappers under main content */
body.home .news-hero-slider ~ .site-main .posts,
body.home .news-hero-slider ~ .site-main .post-list,
body.home .news-hero-slider ~ .site-main .latest-posts,
body.home .news-hero-slider ~ .site-main .blog-posts,
body.home .news-hero-slider ~ .site-main .nm-latest-posts,
body.home .news-hero-slider ~ .site-main .home-posts,

body.home .news-hero-slider-wrapper ~ .site-main .posts,
body.home .news-hero-slider-wrapper ~ .site-main .post-list,
body.home .news-hero-slider-wrapper ~ .site-main .latest-posts,
body.home .news-hero-slider-wrapper ~ .site-main .blog-posts,
body.home .news-hero-slider-wrapper ~ .site-main .nm-latest-posts,
body.home .news-hero-slider-wrapper ~ .site-main .home-posts,

body.home .nhs-hero ~ .site-main .posts,
body.home .nhs-hero ~ .site-main .post-list,
body.home .nhs-hero ~ .site-main .latest-posts,
body.home .nhs-hero ~ .site-main .blog-posts,
body.home .nhs-hero ~ .site-main .nm-latest-posts,
body.home .nhs-hero ~ .site-main .home-posts,

body.home .hero-slider ~ .site-main .posts,
body.home .hero-slider ~ .site-main .post-list,
body.home .hero-slider ~ .site-main .latest-posts,
body.home .hero-slider ~ .site-main .blog-posts,
body.home .hero-slider ~ .site-main .nm-latest-posts,
body.home .hero-slider ~ .site-main .home-posts {
  position: relative !important;
  top: auto !important;
  left: auto !important;
  right: auto !important;
  bottom: auto !important;
}

/* Also correct direct article containers if they were absolutely positioned */
body.home .news-hero-slider ~ .site-main article,
body.home .news-hero-slider-wrapper ~ .site-main article,
body.home .nhs-hero ~ .site-main article,
body.home .hero-slider ~ .site-main article {
  position: relative !important;
  top: auto !important;
}

/* If a masonry/isotope layout is used, disable absolute layout on home as fallback */
body.home .masonry,
body.home .isotope,
body.home .packery,
body.home .grid {
  position: relative !important;
  height: auto !important;
  width: 100% !important;
}

/* Enforce two-column using classic floats for .col-sm-6 */
@media (min-width: 768px) {
  body.home .grid .col-sm-6.grid-item,
  body.home .masonry .col-sm-6.grid-item,
  body.home .isotope .col-sm-6.grid-item,
  body.home .packery .col-sm-6.grid-item {
    float: left !important;
    width: 50% !important;
    box-sizing: border-box;
    /* default: no clear so items stack naturally */
    clear: none !important;
    margin-bottom: 24px;
  }
  /* prevent first item from becoming full width */
  body.home .grid .col-sm-6.grid-item:first-child,
  body.home .masonry .col-sm-6.grid-item:first-child,
  body.home .isotope .col-sm-6.grid-item:first-child,
  body.home .packery .col-sm-6.grid-item:first-child {
    float: left !important;
    width: 50% !important;
  }

  /* base rule: every odd ARTICLE starts a new row (strict two-column) */
  body.home .grid > article.grid-item:nth-of-type(odd),
  body.home .masonry > article.grid-item:nth-of-type(odd),
  body.home .isotope > article.grid-item:nth-of-type(odd),
  body.home .packery > article.grid-item:nth-of-type(odd) {
    clear: left !important;
  }

  /* if previous sibling is an ad/hidden placeholder, don't clear: fill the right slot of the current row */
  body.home .grid > [style*="display:none"] + article.grid-item:nth-of-type(odd),
  body.home .grid > .ad + article.grid-item:nth-of-type(odd),
  body.home .grid > .ads + article.grid-item:nth-of-type(odd),
  body.home .grid > .advert + article.grid-item:nth-of-type(odd),
  body.home .grid > .adsbygoogle + article.grid-item:nth-of-type(odd),
  body.home .grid > .promo + article.grid-item:nth-of-type(odd),
  body.home .grid > .hidden + article.grid-item:nth-of-type(odd),

  body.home .masonry > [style*="display:none"] + article.grid-item:nth-of-type(odd),
  body.home .masonry > .ad + article.grid-item:nth-of-type(odd),
  body.home .masonry > .ads + article.grid-item:nth-of-type(odd),
  body.home .masonry > .advert + article.grid-item:nth-of-type(odd),
  body.home .masonry > .adsbygoogle + article.grid-item:nth-of-type(odd),
  body.home .masonry > .promo + article.grid-item:nth-of-type(odd),
  body.home .masonry > .hidden + article.grid-item:nth-of-type(odd),

  body.home .isotope > [style*="display:none"] + article.grid-item:nth-of-type(odd),
  body.home .isotope > .ad + article.grid-item:nth-of-type(odd),
  body.home .isotope > .ads + article.grid-item:nth-of-type(odd),
  body.home .isotope > .advert + article.grid-item:nth-of-type(odd),
  body.home .isotope > .adsbygoogle + article.grid-item:nth-of-type(odd),
  body.home .isotope > .promo + article.grid-item:nth-of-type(odd),
  body.home .isotope > .hidden + article.grid-item:nth-of-type(odd),

  body.home .packery > [style*="display:none"] + article.grid-item:nth-of-type(odd),
  body.home .packery > .ad + article.grid-item:nth-of-type(odd),
  body.home .packery > .ads + article.grid-item:nth-of-type(odd),
  body.home .packery > .advert + article.grid-item:nth-of-type(odd),
  body.home .packery > .adsbygoogle + article.grid-item:nth-of-type(odd),
  body.home .packery > .promo + article.grid-item:nth-of-type(odd),
  body.home .packery > .hidden + article.grid-item:nth-of-type(odd) {
    clear: none !important;
  }
}

/* Fallback: arrange grid items using CSS columns to preserve grid look without absolute positioning */
/* Restore predictable two-column layout using flex instead of CSS columns */
/* Scope: the posts container immediately after the slider block on home */
body.home .site-main > *:first-child + .grid,
body.home .site-main > *:first-child + .masonry,
body.home .site-main > *:first-child + .isotope,
body.home .site-main > *:first-child + .packery,
body.home .site-main > *:first-child + .site-content .grid,
body.home .site-main > *:first-child + .site-content .masonry,
body.home .site-main > *:first-child + .site-content .isotope,
body.home .site-main > *:first-child + .site-content .packery {
  /* revert to block so Bootstrap floats can work as intended */
  display: block !important;
  column-count: initial !important;
  column-gap: normal !important;
}

/* clearfix for grid containers so floats don't collapse */
body.home .grid::after,
body.home .masonry::after,
body.home .isotope::after,
body.home .packery::after {
  content: "";
  display: table;
  clear: both;
}

/* force override any inline absolute on grid items (first one included) */
body.home article.grid-item[style],
body.home .grid .grid-item[style],
body.home .masonry .grid-item[style],
body.home .isotope .grid-item[style],
body.home .packery .grid-item[style] {
  position: static !important;
  top: auto !important;
  left: auto !important;
  right: auto !important;
  bottom: auto !important;
  transform: none !important;
  height: auto !important;
}

/* Dedicated fix for masonry-like items that force inline absolute positioning */
body.home article.grid-item,
body.home .grid .grid-item,
body.home [class*="grid"] .grid-item,
body.home [class*="posts"] article.grid-item,
body.home .post-list article.grid-item,
body.home .latest-posts article.grid-item {
  position: static !important;
  top: auto !important;
  left: auto !important;
  right: auto !important;
  bottom: auto !important;
  transform: none !important;
  height: auto !important;
}