/*
 * Stored rich text (TinyMCE's, and older CKEditor articles) on the new layout (UPGRADE-4 U4-R7),
 * scoped to .bc-prose. The classes the stored HTML uses were surveyed on 2026-09-26: Bootstrap's
 * grid (valid in 5 as in 4) and the site classes below, ported from the legacy style.css.
 * The article kit (DESIGN-UPGRADE D1) styles plain elements only, so no stored article changes;
 * .bc-callout and .bc-pullquote are for new articles.
 */

.bc-prose { font-size: var(--bc-text-md); line-height: 1.75; color: var(--bc-text); overflow-wrap: anywhere; }
.bc-prose > :first-child { margin-top: 0; }
/* Headings a clear step apart: 24 to 30, 21 to 24, and 19 px. */
.bc-prose h1, .bc-prose h2 { margin: 2.5rem 0 1rem; font-size: clamp(1.5rem, 1.3rem + 0.8vw, 1.875rem); }
.bc-prose h3 { margin: 2rem 0 0.75rem; font-size: clamp(1.3125rem, 1.2rem + 0.4vw, 1.5rem); }
.bc-prose h4, .bc-prose h5, .bc-prose h6 { margin: 1.5rem 0 0.5rem; font-size: var(--bc-h4); }
.bc-prose p, .bc-prose ul, .bc-prose ol, .bc-prose blockquote, .bc-prose table { margin-bottom: 1.25rem; }
.bc-prose ul, .bc-prose ol { padding-left: 1.5rem; }
.bc-prose li { margin-bottom: 0.375rem; padding-left: 0.25rem; }
/* List markers in the brand colour; numbers bold, in the primary colour. */
.bc-prose ul > li::marker { color: var(--bc-brand); }
.bc-prose ol > li::marker { color: var(--bc-primary); font-weight: 700; }
.bc-prose img { max-width: 100%; height: auto; border-radius: var(--bc-radius-sm); }
.bc-prose figure { margin: 1.5rem 0; }
.bc-prose figcaption { margin-top: 0.5rem; color: var(--bc-muted); font-size: var(--bc-text-sm); }
.bc-prose iframe { display: block; width: 100%; max-width: 100%; height: auto; aspect-ratio: 16 / 9; border: 0; border-radius: var(--bc-radius-sm); }
.bc-prose table { display: block; width: 100%; max-width: 100%; overflow-x: auto; border-collapse: collapse; }
/* Tables: a soft header row and striped rows; a wide table scrolls sideways inside the column. */
.bc-prose th, .bc-prose td { padding: 0.625rem 0.875rem; border: 1px solid var(--bc-border); vertical-align: top; }
.bc-prose th, .bc-prose thead td { background: var(--bc-primary-soft); font-weight: 700; text-align: left; }
.bc-prose tbody tr:nth-child(even) td { background: var(--bc-bg-soft); }
.bc-prose blockquote { padding: 1rem 1.25rem; border-left: 4px solid var(--bc-brand); background: var(--bc-bg-soft); border-radius: 0 var(--bc-radius-sm) var(--bc-radius-sm) 0; }
.bc-prose blockquote > :last-child { margin-bottom: 0; }
/* Some stored headings are justified inline; a heading's few words would spread across the line. */
.bc-prose :is(h1, h2, h3, h4, h5, h6)[style*="justify"] { text-align: start !important; }
/* Justified text opens uneven gaps between words (62 posts justify; §13.2 A2): flush-left at every
   width since D10 (§14.15), on phones only before. The stored HTML is unchanged. */
.bc-prose [style*="justify"] { text-align: start !important; }
.bc-prose a { color: var(--bc-link); text-decoration: underline; }
.bc-prose hr { margin: 2rem 0; border-color: var(--bc-border); opacity: 1; }
.bc-prose figure img { display: block; margin: 0 auto; }
.bc-prose .bc-callout { margin: 1.5rem 0; padding: 1rem 1.25rem; border: 1px solid var(--bc-border); border-left: 4px solid var(--bc-primary); border-radius: var(--bc-radius-sm); background: var(--bc-primary-soft); }
.bc-prose .bc-callout > :last-child { margin-bottom: 0; }
.bc-prose .bc-pullquote { margin: 2rem 0; padding: 1rem 0; border-block: 2px solid var(--bc-brand); color: var(--bc-brand-strong); font-size: var(--bc-h3); font-weight: 600; line-height: 1.35; }

/* The legacy site classes the stored articles use. */
.bc-prose .myrow { display: flex; flex-wrap: wrap; margin: 0 -0.75rem; }
.bc-prose .myitem { margin-bottom: 1.5rem; }
.bc-prose .item_img { margin-bottom: 0.75rem; overflow: hidden; border-radius: var(--bc-radius-sm); }
.bc-prose .item_name { margin: 0 0 0.5rem; font-size: 1.125rem; font-weight: 700; }
.bc-prose .text_dark { color: var(--bc-text); }
.bc-prose .bg_gray { padding: 1.25rem; background: var(--bc-bg-soft); border-radius: var(--bc-radius-sm); }
.bc-prose .triangle_list { padding-left: 0; list-style: none; }
.bc-prose .triangle_list li { position: relative; padding-left: 1.25rem; }
.bc-prose .triangle_list li::before { content: ""; position: absolute; left: 0; top: 0.65em; border: 5px solid transparent; border-left-color: var(--bc-brand); }
.bc-prose .mb-20 { margin-bottom: 1.25rem; }
.bc-prose .col-min-12 { flex: 0 0 100%; max-width: 100%; }
.bc-prose .post_title, .bc-prose .post_title_min { font-weight: 700; }
.bc-prose .p1 { margin-bottom: 1rem; }
@media (min-width: 576px) { .bc-prose .col-min-12 { flex: 1 1 0; max-width: none; } }

/* The dark theme (U4-R12a): stored text carries inline colours and backgrounds chosen for a white
   page (about 3,000 style attributes). On a dark page every inline text colour becomes the theme's
   and every inline background goes, so the text stays readable; pictures are untouched. */
[data-bs-theme="dark"] .bc-prose [style*="color"] { color: inherit !important; }
[data-bs-theme="dark"] .bc-prose [style*="background"] { background-color: transparent !important; background-image: none !important; }
[data-bs-theme="dark"] .bc-prose a[style*="color"] { color: var(--bc-link) !important; }
[data-bs-theme="dark"] .bc-prose font[color] { color: inherit; }