/* Custom styles to override Tailwind Typography spacing */
.prose ul li,
.prose ol li {
  margin-top: 0.1em !important;
  margin-bottom: 0.1em !important;
  padding-top: 0 !important;
  padding-bottom: 0 !important;
}

.prose ul li p,
.prose ol li p {
  margin-top: 0.1em !important;
  margin-bottom: 0.1em !important;
  padding-top: 0 !important;
  padding-bottom: 0 !important;
}

.prose ul ul,
.prose ul ol,
.prose ol ul,
.prose ol ol {
  margin-top: 0.25em !important;
  margin-bottom: 0.25em !important;
  padding-top: 0 !important;
  padding-bottom: 0 !important;
}

/* Additional spacing reduction for nested list items */
.prose ul li ul li,
.prose ol li ol li,
.prose ul li ol li,
.prose ol li ul li {
  margin-top: 0.05em !important;
  margin-bottom: 0.05em !important;
  padding-top: 0 !important;
  padding-bottom: 0 !important;
}

/* Style bullet points - make them black and closer to text */
.prose ul {
  padding-left: 1em !important;
}

.prose ul li::before {
  display: inline-block !important;
  color: black !important;
  margin-right: 0.2em !important;
  opacity: 1 !important;
}

/* Ensure these styles override any existing ones */
.article-content ul li,
.article-content ol li {
  margin-top: 0.1em !important;
  margin-bottom: 0.1em !important;
  padding-top: 0 !important;
  padding-bottom: 0 !important;
}

/* Target specific prose sizes */
.prose-lg ul li,
.prose-lg ol li,
.prose-xl ul li,
.prose-xl ol li {
  margin-top: 0.1em !important;
  margin-bottom: 0.1em !important;
  padding-top: 0 !important;
  padding-bottom: 0 !important;
}

/* Additional targeting for any potential line height issues */
.prose ul li,
.prose ol li,
.prose ul li p,
.prose ol li p {
  line-height: 1.3 !important;
}

/* Make headings less bold and reduce spacing */
.prose h1,
.prose h2,
.prose h3,
.prose h4,
.prose h5,
.prose h6 {
  font-weight: 400 !important; /* Even less bold */
  line-height: 1.1 !important;
}

/* Fix for images in headings - remove excess margin */
.prose h1 img,
.prose h2 img,
.prose h4 img,
.prose h5 img,
.prose h6 img,
h1 img,
h2 img,
h4 img,
h5 img,
h6 img {
  margin: 0 !important;
  padding: 0 !important;
  vertical-align: middle !important;
  display: inline-block !important;
}

/* Specifically target the game icon in the title */
.title-with-icon img,
h1 img.game-icon {
  margin: 0 0.25rem 0 0 !important;
  padding: 0 !important;
  vertical-align: middle !important;
}

/* Add specific margin for images in h3 elements (category pages) */
.prose h3 img,
h3 img {
  margin: 0 0.5rem 0 0 !important;
  padding: 0 !important;
  vertical-align: middle !important;
  display: inline-block !important;
}

/* Set main body text to 1rem by default */
.prose {
  font-size: 1rem !important;
}

.prose p {
  font-size: 1rem !important;
  margin-top: 0.75em !important;
  margin-bottom: 0.75em !important;
}

/* Ensure prose-lg and prose-xl don't override our base font size */
.prose.prose-lg,
.prose.prose-xl {
  font-size: 1rem !important;
}

.prose.prose-lg p,
.prose.prose-xl p {
  font-size: 1rem !important;
  margin-top: 0.75em !important;
  margin-bottom: 0.75em !important;
}

/* Banner ad styles */
.banner-ad-container {
  width: 160px;
  min-width: 160px;
  padding: 0.5rem;
  margin-top: 2rem;
  margin-left: 1rem;
  margin-right: 1rem;
}

.banner-ad {
  position: sticky;
  top: 2rem;
}

/* Google AdSense styles */
.banner-ad ins.adsbygoogle {
  width: 160px;
  height: 600px;
}

/* Horizontal banner ad styles removed to improve mobile content appearance */

/* Media queries for responsive behavior */
@media (max-width: 1023px) {
  .banner-ad-container {
    display: none;
  }
}

/* Media query for horizontal ads removed */