/**
 * Markdown Content Component
 *
 * Word-wrapping and overflow prevention for markdown-rendered content.
 * Applies to post bodies, comment bodies, and documentation content.
 */

/* Container-level word wrapping for all markdown content areas */
.post-body-section,
.comment-body,
.doc-body,
.hidden-content {
    overflow-wrap: break-word;
    word-wrap: break-word; /* Legacy fallback */
}

/* Specific element-level rules for markdown-generated HTML */
.post-body-section p,
.post-body-section li,
.post-body-section td,
.post-body-section blockquote,
.comment-body p,
.comment-body li,
.doc-body p,
.doc-body li,
.doc-body td,
.doc-body blockquote {
    overflow-wrap: break-word;
    word-wrap: break-word; /* Legacy fallback */
}

/* Long URLs and code snippets in inline code */
.post-body-section code,
.comment-body code,
.doc-body code {
    overflow-wrap: break-word;
    word-wrap: break-word; /* Legacy fallback */
}

/* Headers in markdown content */
.post-body-section h1,
.post-body-section h2,
.post-body-section h3,
.post-body-section h4,
.post-body-section h5,
.post-body-section h6,
.doc-body h1,
.doc-body h2,
.doc-body h3,
.doc-body h4,
.doc-body h5,
.doc-body h6 {
    overflow-wrap: break-word;
    word-wrap: break-word; /* Legacy fallback */
}

/* Links with very long URLs */
.post-body-section a,
.comment-body a,
.doc-body a {
    overflow-wrap: break-word;
    word-wrap: break-word; /* Legacy fallback */
}

/* Pre-formatted text blocks - allow horizontal scroll for code integrity */
.post-body-section pre,
.comment-body pre,
.doc-body pre {
    overflow-x: auto;
    overflow-y: auto;
    max-width: 100%;
}

/* Code inside pre blocks should NOT wrap (preserve formatting) */
.post-body-section pre code,
.comment-body pre code,
.doc-body pre code {
    overflow-wrap: normal;
    word-wrap: normal;
    white-space: pre;
}

/* Additional protection for code blocks against universal grid word-breaking
   Ensures code blocks in documentation remain readable with horizontal scroll */
.doc-content pre,
.doc-content code {
    overflow-wrap: normal;
    word-wrap: normal;
    overflow-x: auto;
    max-width: 100%;
}

/* Preserve code block formatting in doc-content context */
.doc-content pre code {
    white-space: pre;
}