/* Use .blogpost-container to target imported blogs */
/* .single-post:not(:has(.blogpost-container))
  .wp-block-post-content
  > div:first-child {
  margin-top: 13vh !important;
  padding-top: 10vh !important;
  padding-bottom: 10vh !important;
  padding-right: 22vw !important;
  padding-left: 22vw !important;
} */

.single-post main > div:last-child {
  margin-top: 0 !important;
}

/* Blog Post Container Styling */
.blogpost-container {
  background-color: rgb(93, 81, 121);
  /* padding-top: 10vh;
  padding-bottom: 10vh;
  padding-right: 22vw;
  padding-left: 22vw; */
  margin-top: 13vh !important;
  padding-top: 10vh !important;
  padding-bottom: 10vh !important;
  padding-right: 22vw !important;
  padding-left: 22vw !important;
  color: #ffffff;
  max-width: 100vw;
}

/* Heading Styling */
.single-post main h1 {
  font-size: 4.5rem !important;
  line-height: 1.2 !important;
  margin-bottom: 2rem;
  overflow-wrap: break-word;
}

h1.blogpost-title,
.blogpost-container h1 {
  color: #ffffff;
  /* font-size: 2.5rem; */
  font-weight: 700;
  /* line-height: 1.2; */
  margin-top: 0;
  margin-bottom: 2rem;
}

.single-post main h2,
.single-post main h3,
.single-post main h4 {
  margin-top: 2rem;
  margin-bottom: 1.5rem;
  line-height: 1.2 !important;
}

.single-post main h2 {
  font-size: 4rem !important;
}

.single-post main h3 {
  font-size: 2rem !important;
}

.single-post main h4 {
  font-size: 3rem !important;
}

/* .single-post h3,
.single-post h4,
.blogpost-container h3,
.blogpost-container h4 {
  margin-top: 2rem;
  margin-bottom: 1.5rem;
} */

h3.blogpost,
h4.blogpost {
  color: #ffffff;
  /* font-weight: 600; */
  /* margin-top: 2rem; */
  /* margin-bottom: 1rem; */
}

/* h3.blogpost {
  font-size: 1.5rem;
}

h4.blogpost {
  font-size: 1.25rem;
} */

p.blogpost-p:has(strong.blogpost-featured) {
  background-color: #ffffff4d;
  padding-top: 20px !important;
  padding-bottom: 20px !important;
  padding-left: 5% !important;
  padding-right: 5% !important;
  text-align: left;
}

/* Featured Paragraph with Bold Text */
.blogpost-featured {
  font-weight: 700;
  color: #ffffff;
  font-size: 1.05em;
  line-height: 1.6;
}

/* Regular Paragraph Styling */
.blogpost-p {
  color: #ffffff;
  line-height: 1.8;
  margin-top: 0;
  margin-bottom: 1.5rem;
  padding: 0;
}

.blogpost-p span {
  color: #ffffff !important;
}

/* Link */
.blogpost-p a,
.blogpost-container .faq-accordion a,
.blogpost-container ul.wp-block-list li a,
.blogpost-container ol.wp-block-list li a {
  color: var(--color-yk-secondary);
  text-decoration: none !important;
}

.blogpost-p a:hover,
.blogpost-container .faq-accordion a:hover,
.blogpost-container ul.wp-block-list li a:hover {
  text-decoration: underline !important;
}

.blogpost-container .faq-accordion p {
  margin-bottom: 1.5rem;
}

/* Featured Image */
/* .blogpost-container .wp-block-image:first-of-type img {
  max-height: 500px;
  aspect-ratio: 3/2;
  object-fit: contain;
} */

/* Image */
.single-post .wp-block-image img,
.blogpost-container .wp-block-image img {
  max-height: 500px;
  /* aspect-ratio: 3/2; */
  object-fit: contain;
  margin-bottom: 1.5rem;
}

/* Package */
.single-post .blogpost-container .package-section {
  margin-bottom: var(--wp--preset--spacing--40) !important;
}

/* Contact Shortainer */
/* One shortainer */
.single-post .shortainer:not(.shortainer + .shortainer),
.blogpost-container .shortainer:not(.shortainer + .shortainer) {
  margin-top: var(--wp--preset--spacing--40);
}

/* Two shortainers */
.single-post .shortainer:not(.shortainer + .shortainer),
.blogpost-container .shortainer:has(+ .shortainer) {
  margin-top: var(--wp--preset--spacing--40);
}

.blogpost-container .shortainer > div:first-child {
  padding-left: unset !important;
  padding-right: unset !important;
}

/* Team Member Image */
.blogpost-container .shortainer img {
  margin-bottom: unset !important;
  max-height: unset;
  aspect-ratio: unset;
}

.blogpost-image {
  width: 100%;
  height: auto;
  display: block;
  margin: 1.5rem 0;
}

/* .blogpost-container .wp-block-quote {
  margin: 1rem 0rem 1rem 1.5rem; 
  font-size: 16px !important;
  font-style: italic;
  position: relative;
} */

/* Quote */
p.blogpost-p:has(em) {
  padding-left: 1rem;
  padding-right: 1rem;
  font-size: 16px !important;
  font-style: italic;
}

p.blogpost-p:has(em.blogpost-source) {
  padding-left: 0;
  padding-right: 0;
}

/* List */
.blogpost-container ul.wp-block-list,
.blogpost-container ol.wp-block-list {
  margin-left: 1.5rem;
  margin: 1.5rem;
}

.blogpost-container ul.wp-block-list li {
  list-style-type: disc !important;
}

.blogpost-container ol.wp-block-list li {
  list-style-type: decimal !important;
}

.blogpost-container ul.wp-block-list li,
.blogpost-container ol.wp-block-list li {
  font-size: 16px !important;
  margin-bottom: 0.5rem;
}

.blogpost-container ul.wp-block-list li:last-child,
.blogpost-container ol.wp-block-list li:last-child {
  margin-bottom: 0.5rem !important;
}

.blogpost-container ul.wp-block-list li:first-child,
.blogpost-container ol.wp-block-list li:first-child {
  margin-top: 0.5rem !important;
}

.blogpost-container ul.wp-block-list li:last-child:has(ol) ol,
.blogpost-container ol.wp-block-list li:last-child:has(ul) ul {
  margin-top: 0.5rem !important;
}

/* Buttons */
.blogpost-container .wp-block-buttons {
  margin-bottom: 1.5rem !important;
}
.blogpost-container .wp-block-buttons .wp-block-button .wp-block-button__link {
  border-width: 0px;
  border-radius: 0.33rem;
  background-color: var(--wp--preset--color--white);
  color: var(--wp--preset--color--black);
  padding: 0.5rem 1rem 0.5rem 1rem !important;
}

/* Accordion */
.blogpost-container .faq-accordion {
  padding-top: 0 !important;
}

.blogpost-container .faq-accordion details {
  margin-left: 0 !important;
}

/* Source/Citation Styling */
.blogpost-source {
  color: #ffffff;
  font-style: italic;
  opacity: 0.85;
  font-size: 0.95em;
}

/* Team Member Card */
.team-member-card {
  background-color: rgba(255, 255, 255, 0.05);
  border: 1px solid rgba(255, 255, 255, 0.1) !important;
  padding: 2rem !important;
  margin: 2rem 0 !important;
  max-width: fit-content !important;
}

.team-member-card h4.blogpost {
  margin-top: 1rem;
  margin-bottom: 0.5rem;
}

.team-member-card .blogpost-p {
  margin-bottom: 0.75rem;
}

/* Team Member Image */
.team-image {
  max-width: 350px !important;
  border-radius: unset !important;
  display: block;
  margin-bottom: 1rem;
  margin: auto !important;
}

/* Remove default spacing on WordPress paragraphs with 'n' or 'nn' */
/* .blogpost-p:empty,
.blogpost-p:has(> br:only-child) {
  display: none;
} */

/* Ensure proper spacing between sections */
.blogpost-container > *:first-child {
  margin-top: 0;
}

.blogpost-container > *:last-child {
  margin-bottom: 0;
}

/* This hides any .wp-block-group that comes after .blogpost-container. */
/* .blogpost-container ~ .wp-block-group {
  display: none !important;
  background-color: aqua !important;
} */

/* Add this class to the Gutenberg Group 
wrapping all paragraphs to make them in two columns */
.two-paragraph-columns {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 1.5em 50px;
  align-items: start;
  padding-left: 0;
}

/* -------- Other News Section -------- */
.single-post .other-news-section .trending-blogposts {
  padding: 0 !important;
}

/* Outer list: 3 equal columns with consistent gap */
.single-post
  .other-news-section
  .trending-blogposts
  .wp-block-latest-posts__list {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 1.5rem;
  list-style: none;
  padding: 0 !important;
  margin: 0 auto;
  max-width: 1200px;
}

.single-post .other-news-section.is-layout-constrained > *,
.single-post .other-news-section .wp-block-group.is-layout-constrained > *,
.single-post .other-news-section .trending-blogposts.is-layout-constrained > * {
  /* max-width: 1200px !important; */
  max-width: unset !important;
}

/* Each card: stack image on top, text below */
.single-post
  .other-news-section
  .trending-blogposts
  .wp-block-latest-posts__list
  li {
  display: flex;
  flex-direction: column;
  /* padding: 1rem; */
  /* background: rgba(255, 255, 255, 0.5); */
  border-radius: 0px;
}

.single-post
  .other-news-section
  .trending-blogposts
  .wp-block-latest-posts__list
  li {
  display: flex !important;
  flex-direction: column !important;
}

.single-post
  .other-news-section
  .trending-blogposts
  .wp-block-latest-posts__post-title {
  width: 100% !important;
  max-width: none !important;
}

.single-post
  .other-news-section
  .trending-blogposts
  .wp-block-latest-posts__featured-image {
  width: 100%;
}

/* Image fills card width */
.single-post
  .other-news-section
  .trending-blogposts
  .wp-block-latest-posts__featured-image
  img {
  /* width: 100%;
  height: 200px;
  object-fit: cover; */

  width: 100%;
  height: auto;
  aspect-ratio: 4/3;
  border-radius: 4px;
  object-fit: cover;

  /* width: 100% !important;
  max-width: none !important;
  height: auto;
  aspect-ratio: 4/3;
  object-fit: cover;
  border-radius: 4px; */
}

.single-post
  .other-news-section
  .trending-blogposts
  .wp-block-latest-posts__post-title {
  font-size: 1rem;
  margin-top: 0.75rem;
}

.single-post
  .other-news-section
  .trending-blogposts
  .wp-block-latest-posts__post-date {
  font-size: 0.875rem;
  color: #1a1a1a;
  margin-top: auto;
  padding-top: 0.5rem;
}

.single-post
  .is-layout-constrained
  > :where(:not(.alignleft):not(.alignright):not(.alignfull)) {
  max-width: unset !important;
}

/* .single-post .wp-block-group:has(.shortainer) {
  justify-content: center;
} */

/* ---- Responsive ---- */
@media (max-width: 900px) {
  .single-post
    .other-news-section
    .trending-blogposts
    .wp-block-latest-posts__list {
    grid-template-columns: repeat(2, 1fr);
  }
}

@media (max-width: 600px) {
  .single-post
    .other-news-section
    .trending-blogposts
    .wp-block-latest-posts__list {
    grid-template-columns: 1fr;
  }
}

/* ----- ㅡTablet and Mobile View (<1366px) ----- */
@media screen and (max-width: 1366px) {
  .single-post:not(:has(.blogpost-container))
    .wp-block-post-content
    > div:first-child,
  .single-post .blogpost-container {
    margin-top: 90px !important;
    /* margin-top: 4rem !important; */
  }
}

/* ----- Tablet View (768px - 1366px) ----- */
@media screen and (min-width: 768px) and (max-width: 1366px) {
  .single-post .blogpost-container {
    margin-top: 55px !important;
  }
}

/* ----- Mobile View (< 768px) ----- */
@media screen and (max-width: 768px) {
  .single-post:not(:has(.blogpost-container))
    .wp-block-post-content
    > div:first-child,
  .single-post .blogpost-container {
    padding: 2rem 1.5rem !important;
  }

  .single-post main h1 {
    font-size: 2rem !important;
  }

  .single-post main h3 {
    font-size: 1.5rem !important;
  }

  .single-post main h4 {
    font-size: 1.25rem !important;
  }

  .team-member-card {
    padding: 1.5rem !important;
  }

  .team-image {
    max-width: 250px !important;
  }

  .two-paragraph-columns {
    grid-template-columns: 1fr;
    gap: 1em;
  }

  .single-post
    .other-news-section
    .trending-blogposts
    .wp-block-latest-posts__featured-image
    img {
    height: 200px !important;
  }
}
