/* Custom CSS for Blog Details Content */

/* Blog Title Styling */
.heading1 h4 {
    color: #ffffff !important;
    font-weight: 700;
    line-height: 1.3;
}

body.light-mode .heading1 h4 {
    color: #111827 !important;
}

/* Base styles (Dark Mode / Default) */
.blog-post-body {
    font-family: 'Inter', sans-serif;
    color: #d1d5db; /* Default text color for the container */
}

/* Force text color in dark mode to handle editor inline styles if necessary, but be careful not to break meaningful colors */
.blog-post-body p,
.blog-post-body span,
.blog-post-body div,
.blog-post-body li {
    color: #d1d5db !important;
    line-height: 1.6 !important;
    margin-bottom: 0px !important;
    font-size: 1rem;
}

/* Headings */
.blog-post-body h1,
.blog-post-body h2,
.blog-post-body h3,
.blog-post-body h4,
.blog-post-body h5,
.blog-post-body h6 {
    color: #ffffff !important;
    margin-top: 40px;
    margin-bottom: 20px;
    line-height: 1.3 !important;
    font-weight: 700 !important;
}

/* Lists */
.blog-post-body ul, 
.blog-post-body ol {
    margin-bottom: 24px;
    padding-left: 20px;
    color: #d1d5db !important;
}

.blog-post-body li {
    margin-bottom: 0px !important;
}

/* Bold text */
.blog-post-body strong,
.blog-post-body b {
    color: #ffffff !important;
    font-weight: 600;
}

/* Links */
.blog-post-body a {
    color: #FFB400 !important; /* Theme Yellow */
    text-decoration: underline;
}

/* Blockquotes */
.blog-post-body blockquote {
    border-left: 4px solid #FFB400;
    padding-left: 20px;
    margin: 30px 0;
    font-style: italic;
    color: #f3f4f6 !important;
    background: rgba(255, 255, 255, 0.05);
    padding: 20px;
    border-radius: 0 8px 8px 0;
}

/* Images */
.blog-post-body img {
    max-width: 100%;
    height: auto;
    border-radius: 8px;
    margin: 30px 0;
    display: block;
}

/* Light Mode Overrides */
body.light-mode .blog-post-body p,
body.light-mode .blog-post-body span,
body.light-mode .blog-post-body div,
body.light-mode .blog-post-body li,
body.light-mode .blog-post-body ul,
body.light-mode .blog-post-body ol {
    color: #4b5563 !important; /* Dark grey for light mode */
}

body.light-mode .blog-post-body h1,
body.light-mode .blog-post-body h2,
body.light-mode .blog-post-body h3,
body.light-mode .blog-post-body h4,
body.light-mode .blog-post-body h5,
body.light-mode .blog-post-body h6,
body.light-mode .blog-post-body strong,
body.light-mode .blog-post-body b {
    color: #111827 !important; /* Near black */
}

body.light-mode .blog-post-body blockquote {
    color: #374151 !important;
    background: rgba(0, 0, 0, 0.05);
}

.blog-post-body br {
    display: block; 
    margin: 5px 0 !important;
    content: " ";
    height: 10px;
}