/* --- General Category Button Styling --- */
/* Applies consistent background, text color, padding, and basic appearance to all category links */
.cs-meta-category .post-categories li a, .cs-entry__post-meta .cs-meta-category .post-categories li a, .wp-block-latest-posts__category a {
  /* ADDED: Selector for the new category block */
  background-color: #411381 !important;
  /* Button background color */
  color: #ffffff !important;
  /* Force white text color for all links */
  padding: 5px 3px;
  /* Adds space around the text */
  border-radius: 1px;
  /* Slightly rounded corners */
  text-decoration: none;
  /* Removes underline from links */
  display: inline-block;
  /* Essential for padding and background to apply correctly */
  line-height: 1;
  /* Often helps with vertical alignment in buttons */
  transition: background-color 0.3s ease, color 0.3s ease;
  /* Smooth transition for hover effects */
  margin-right: -5px;
  /* Space to the right of the button */
}
/* Ensure any span inside the category link also has white text and no background */
/* This rule generally covers spans within any of the targeted 'a' elements */
.cs-meta-category .post-categories li a span, .cs-entry__post-meta .cs-meta-category .post-categories li a span, .wp-block-latest-posts__category a span {
  /* ADDED: Selector for span within the new category block */
  color: #ffffff !important;
  /* Force white text for span */
  background-color: transparent !important;
  /* Ensure transparent background on span */
}
/* --- Specific Fix for Top Carousel Category Button (data-scheme="inverse") --- */
/* This targets the problematic ::after pseudo-element that was causing the white block */
.cs-entry__outer[data-scheme="inverse"] .cs-entry__meta-overlay .cs-entry__post-meta .cs-meta-category .post-categories li a::after {
  background-color: transparent !important;
  /* Removes the overlaying background */
  /* If any visual glitches persist, you might need to adjust z-index: */
  /* z-index: initial !important; */
}
/* --- Hover States for Category Buttons --- */
/* Applies hover effects to all category links */
.cs-meta-category .post-categories li a:hover, .cs-entry__post-meta .cs-meta-category .post-categories li a:hover, .wp-block-latest-posts__category a:hover {
  /* ADDED: Selector for hover on the new category block */
  background-color: #000000 !important;
  /* Button background color on hover */
  color: #ffffff !important;
  /* Text color remains white on hover */
}
/* Ensure any span inside hovered category links also stays white */
.cs-meta-category .post-categories li a:hover span, .cs-entry__post-meta .cs-meta-category .post-categories li a:hover span, .wp-block-latest-posts__category a:hover span {
  /* ADDED: Selector for span hover in the new category block */
  color: #ffffff !important;
  background-color: transparent !important;
  /* Ensure transparent background on span during hover as well */
}
/* --- Load More Button Styling --- */
/* Separate rules for the "Load More" button to keep it consistent */
.cs-load-more.cs-button-animated {
  background-color: #411381 !important;
  color: #ffffff !important;
  transition: background-color 0.3s ease, color 0.3s ease;
}
.cs-load-more.cs-button-animated:hover {
  background-color: #000000 !important;
  color: #ffffff !important;
}
/* Ensure span within Load More button also inherits white color */
.cs-load-more.cs-button-animated span {
  color: #ffffff !important;
}
.cs-load-more.cs-button-animated:hover span {
  color: #ffffff !important;
}
.cs-offcanvas__sidebar {
  background-color: #000000;
}
/* Decrease the gap between menu items */
.cs-offcanvas__sidebar .widget_nav_menu #menu-topmenu li {
  margin-bottom: 5px !important;
  /* Added !important as a stronger override */
  padding: 0;
  /* Remove any default padding from the li */
}
/* Adjust text size and weight for menu links */
.cs-offcanvas__sidebar .widget_nav_menu #menu-topmenu li a {
  font-size: 1.1em !important;
  /* Added !important */
  font-weight: bold !important;
  /* Added !important */
  padding: 8px 0;
  /* Adjust vertical padding as needed */
  display: block;
  /* Ensure it behaves like a block for padding */
  line-height: 0.9;
  /* Adjust line height if text looks too cramped after reducing gap */
}
/* --- Final Alternative CSS for Single Post Subheadings --- */
/* LIGHT MODE STYLES */
body.single-post .cs-entry__content-wrap .entry-content h2, body.single-post .cs-entry__content-wrap .entry-content h3, body.single-post .cs-entry__content-wrap .entry-content h4, body.single-post .cs-entry__content-wrap .entry-content h5, body.single-post .cs-entry__content-wrap .entry-content h6, body.single-post .cs-entry__content-wrap .entry-content h2 strong, body.single-post .cs-entry__content-wrap .entry-content h3 strong, body.single-post .cs-entry__content-wrap .entry-content h4 strong, body.single-post .cs-entry__content-wrap .entry-content h5 strong, body.single-post .cs-entry__content-wrap .entry-content h6 strong {
  color: #411381 !important;
}
/* DARK MODE STYLES */
body.single-post[data-scheme="dark"] .cs-entry__content-wrap .entry-content h2, body.single-post[data-scheme="dark"] .cs-entry__content-wrap .entry-content h3, body.single-post[data-scheme="dark"] .cs-entry__content-wrap .entry-content h4, body.single-post[data-scheme="dark"] .cs-entry__content-wrap .entry-content h5, body.single-post[data-scheme="dark"] .cs-entry__content-wrap .entry-content h6, body.single-post[data-scheme="dark"] .cs-entry__content-wrap .entry-content h2 strong, body.single-post[data-scheme="dark"] .cs-entry__content-wrap .entry-content h3 strong, body.single-post[data-scheme="dark"] .cs-entry__content-wrap .entry-content h4 strong, body.single-post[data-scheme="dark"] .cs-entry__content-wrap .entry-content h5 strong, body.single-post[data-scheme="dark"] .cs-entry__content-wrap .entry-content h6 strong {
  color: #30fdb2 !important;
}
.display-post-types {
  /* Existing styles */
  background-color: #333333;
  border: 1px solid #333333;
  border-radius: 8px;
  padding: 15px;
  /* New styles for controlled sizing */
  max-width: 800px;
  /* Limits the block's width on larger screens */
  margin-left: auto;
  /* Centers the block if max-width is used */
  margin-right: auto;
  /* Centers the block if max-width is used */
  /* You could also set a fixed width if desired: width: 600px; */
  /* Or a minimum width: min-width: 300px; */
}
/* Mobile-only container padding - keeps original padding for larger screens */
@media (max-width: 575.98px) {
  .cs-container {
    padding-right: 16px;
    padding-left: 16px;
  }
}
