/* PATADOCS — article typography. Used by public blog posts (.blog-content) AND inside the admin editor
   (TinyMCE's body is .mce-content-body), so what the author sees is what readers get. */
.blog-content, .mce-content-body { font-family: Georgia, "Times New Roman", serif; font-size: 1.08rem; line-height: 1.75; color: var(--text-primary, #111); overflow-wrap: break-word; }
.mce-content-body { max-width: 780px; margin: 16px auto; padding: 0 16px; background: #fff; }
.blog-content > :first-child { margin-top: 0; }
.blog-content p, .mce-content-body p { margin: 0 0 1.1em; }
.blog-content h2, .blog-content h3, .blog-content h4, .mce-content-body h2, .mce-content-body h3, .mce-content-body h4 { font-family: Tahoma, Verdana, sans-serif; line-height: 1.3; margin: 1.6em 0 .6em; scroll-margin-top: 70px; }
.blog-content h2, .mce-content-body h2 { font-size: 1.5rem; border-bottom: 2px solid var(--border, #c0c0c0); padding-bottom: 4px; }
.blog-content h3, .mce-content-body h3 { font-size: 1.25rem; }
.blog-content h4, .mce-content-body h4 { font-size: 1.08rem; }
.blog-content a, .mce-content-body a { color: #0645ad; text-decoration: underline; text-underline-offset: 2px; }
.dark-theme .blog-content a { color: #c6dafc; }
.blog-content img, .mce-content-body img { max-width: 100%; height: auto; border-radius: 4px; }
.blog-content figure, .mce-content-body figure { margin: 1.4em 0; text-align: center; }
.blog-content figure.image, .mce-content-body figure.image { display: table; margin-left: auto; margin-right: auto; }
.blog-content figcaption, .mce-content-body figcaption { font-size: .9rem; color: var(--text-secondary, #555); font-style: italic; margin-top: 6px; }
.blog-content .align-left, .blog-content img[style*="float: left"] { float: left; margin: 4px 18px 10px 0; max-width: 50%; }
.blog-content .align-right, .blog-content img[style*="float: right"] { float: right; margin: 4px 0 10px 18px; max-width: 50%; }
.blog-content ul, .blog-content ol, .mce-content-body ul, .mce-content-body ol { margin: 0 0 1.1em; padding-left: 1.6em; }
.blog-content li, .mce-content-body li { margin-bottom: .35em; }
.blog-content blockquote, .mce-content-body blockquote { margin: 1.4em 0; padding: 10px 18px; border-left: 5px solid #000080; background: rgba(0, 0, 128, .06); font-style: italic; }
.dark-theme .blog-content blockquote { border-left-color: #8ab4f8; background: rgba(138, 180, 248, .08); }
.blog-content pre, .mce-content-body pre { background: #1e1e1e; color: #f0f0f0; padding: 12px 14px; border-radius: 4px; overflow-x: auto; font-size: .92rem; line-height: 1.5; }
.blog-content code, .mce-content-body code { font-family: Consolas, "Courier New", monospace; font-size: .92em; background: rgba(0, 0, 0, .07); padding: 1px 4px; border-radius: 3px; }
.blog-content pre code, .mce-content-body pre code { background: none; padding: 0; }
.blog-content hr, .mce-content-body hr { border: 0; border-top: 2px dashed var(--border, #c0c0c0); margin: 2em 0; }
.blog-content .table-wrap { overflow-x: auto; margin: 1.2em 0; -webkit-overflow-scrolling: touch; }
.blog-content table, .mce-content-body table { border-collapse: collapse; width: 100%; font-family: Tahoma, Verdana, sans-serif; font-size: .95rem; }
.blog-content th, .blog-content td, .mce-content-body th, .mce-content-body td { border: 1px solid #999; padding: 7px 10px; text-align: left; vertical-align: top; }
.blog-content th, .mce-content-body th { background: #000080; color: #fff; }
.blog-content tr:nth-child(even) td { background: rgba(0, 0, 128, .04); }
.blog-content iframe, .blog-content video, .mce-content-body iframe, .mce-content-body video { max-width: 100%; border: 0; }
.blog-content iframe[src*="youtube"], .blog-content iframe[src*="vimeo"] { width: 100%; height: auto; aspect-ratio: 16 / 9; }
.blog-content details, .mce-content-body details { border: 2px solid var(--border, #c0c0c0); border-radius: 4px; padding: 8px 12px; margin: 1em 0; }
.blog-content summary, .mce-content-body summary { cursor: pointer; font-weight: bold; font-family: Tahoma, Verdana, sans-serif; }
/* Callout boxes (Formats menu in the editor) */
.callout, .mce-content-body .callout { padding: 12px 16px; border-left: 6px solid; border-radius: 4px; margin: 1.3em 0; font-family: Tahoma, Verdana, sans-serif; font-size: 1rem; }
.callout > :last-child { margin-bottom: 0; }
.callout-info { background: #e8f0fe; border-color: #1a73e8; color: #0b2a57; }
.callout-tip { background: #e6f4ea; border-color: #188038; color: #0d3b1c; }
.callout-warning { background: #fef7e0; border-color: #f9ab00; color: #4a3500; }
.callout-danger { background: #fce8e6; border-color: #d93025; color: #5c0f0a; }
.lead, .mce-content-body .lead { font-size: 1.22rem; line-height: 1.6; color: var(--text-secondary, #333); }
.btn-link-cta, .mce-content-body .btn-link-cta { display: inline-block; background: #008000; color: #fff !important; text-decoration: none !important; padding: 9px 18px; border-radius: 4px; font-family: Tahoma, Verdana, sans-serif; font-weight: bold; }
.mce-content-body p.doc-shortcode, .mce-content-body p:has(> .doc-shortcode) { background: #fff8d6; border: 1px dashed #b38f00; padding: 6px 10px; font-family: Consolas, monospace; }