/*
 * Image layout for page content written in CKEditor 5 (the admin editor from the
 * Botble 7 upgrade until 2026-11-11). CKEditor stores images as
 * <figure class="image ...">, and its own stylesheet scopes every rule to
 * `.ck-content` -- a class that only exists inside the editor. On the public page
 * none of it applied, so an image centred in the editor showed left-aligned on the
 * site (the client's report, 2026-11-04).
 *
 * Generated from vendor/core/core/base/libraries/ckeditor/content-styles.css: the
 * image rules only, re-scoped to the page content area (#content) and to the
 * TinyMCE editing area (.mce-content-body), so editor and site show the same thing.
 */
:root{--ck-color-image-caption-background:hsl(0,0%,97%);--ck-color-image-caption-text:hsl(0,0%,20%);--ck-image-style-spacing:1.5em;--ck-inline-image-style-spacing:calc(var(--ck-image-style-spacing) / 2)}
#content img.image_resized,.mce-content-body img.image_resized{height:auto}
#content figure.image.image_resized,.mce-content-body figure.image.image_resized{max-width:100%;display:block;box-sizing:border-box}
#content figure.image.image_resized img,.mce-content-body figure.image.image_resized img{width:100%}
#content figure.image.image_resized>figcaption,.mce-content-body figure.image.image_resized>figcaption{display:block}
#content figure.image,.mce-content-body figure.image{display:table;clear:both;text-align:center;margin:.9em auto;min-width:50px}
#content figure.image img,.mce-content-body figure.image img{display:block;margin:0 auto;max-width:100%;min-width:100%;height:auto}
#content .image-inline,.mce-content-body .image-inline{display:inline-flex;max-width:100%;align-items:flex-start}
#content .image-inline picture,.mce-content-body .image-inline picture{display:flex}
#content .image-inline picture,.mce-content-body .image-inline picture,#content .image-inline img,.mce-content-body .image-inline img{flex-grow:1;flex-shrink:1;max-width:100%}
#content figure.image>figcaption,.mce-content-body figure.image>figcaption{display:table-caption;caption-side:bottom;word-break:break-word;color:var(--ck-color-image-caption-text);background-color:var(--ck-color-image-caption-background);padding:.6em;font-size:.75em;outline-offset:-1px}
#content .image-style-block-align-left,.mce-content-body .image-style-block-align-left,#content .image-style-block-align-right,.mce-content-body .image-style-block-align-right{max-width:calc(100% - var(--ck-image-style-spacing))}
#content .image-style-align-left,.mce-content-body .image-style-align-left,#content .image-style-align-right,.mce-content-body .image-style-align-right{clear:none}
#content .image-style-side,.mce-content-body .image-style-side{float:right;margin-left:var(--ck-image-style-spacing);max-width:50%}
#content .image-style-align-left,.mce-content-body .image-style-align-left{float:left;margin-right:var(--ck-image-style-spacing)}
#content .image-style-align-center,.mce-content-body .image-style-align-center{margin-left:auto;margin-right:auto}
#content .image-style-align-right,.mce-content-body .image-style-align-right{float:right;margin-left:var(--ck-image-style-spacing)}
#content .image-style-block-align-right,.mce-content-body .image-style-block-align-right{margin-right:0;margin-left:auto}
#content .image-style-block-align-left,.mce-content-body .image-style-block-align-left{margin-left:0;margin-right:auto}
#content p+.image-style-align-left,.mce-content-body p+.image-style-align-left,#content p+.image-style-align-right,.mce-content-body p+.image-style-align-right,#content p+.image-style-side,.mce-content-body p+.image-style-side{margin-top:0}
#content .image-inline.image-style-align-left,.mce-content-body .image-inline.image-style-align-left,#content .image-inline.image-style-align-right,.mce-content-body .image-inline.image-style-align-right{margin-top:var(--ck-inline-image-style-spacing);margin-bottom:var(--ck-inline-image-style-spacing)}
#content .image-inline.image-style-align-left,.mce-content-body .image-inline.image-style-align-left{margin-right:var(--ck-inline-image-style-spacing)}
#content .image-inline.image-style-align-right,.mce-content-body .image-inline.image-style-align-right{margin-left:var(--ck-inline-image-style-spacing)}