/**
 * Cloudsoft article content layer.
 *
 * Presentational rules for imported article body content (post.json ->
 * cloudsoft-article-import -> Gutenberg block markup). Scoped to
 * .cloudsoft-entry-content, the wrapper used by both the single post
 * template (template-parts/single/content.php) and the page template
 * (template-parts/page/content.php, template-parts/page/protected.php),
 * so these rules apply everywhere full block content renders, not only
 * on single posts.
 *
 * History: this started as Additional CSS entered through the Customizer
 * (wp_options / the custom_css post type), which lives in the database and
 * does not travel with a code-only deploy. Moved here on 10 August 2026 so
 * the fix ships with the theme's files instead.
 *
 * Enqueued in core/enqueue.php as 'cloudsoft-article-content', depending on
 * 'cloudsoft-main' so it always loads after the compiled stylesheet and
 * wins on cascade order without inflated specificity.
 */

/* ==========================================================================
   Featured & inline image captions
   ========================================================================== */

/*
 * Inline (in-content) image captions: read below the image instead of
 * overlaying it. The theme default (main.css) pins figcaption bottom-left
 * at 30% width, which suits a photograph but hides the content of an
 * informational diagram.
 */
.cloudsoft-entry-content .wp-block-image figcaption {
	position: static;
	max-width: 100%;
	min-width: 0;
	margin: 0.8rem 0 0;
	padding: 0;
	background: none;
	background-color: transparent;
	color: #55657d;
	font-size: 85%;
	line-height: 1.5;
	text-align: center;
}

.cloudsoft-entry-content .wp-block-image:hover a + figcaption {
	background: none;
	color: #55657d;
}

/*
 * Featured image caption: the theme prints this as an overlay pinned over
 * the hero image. Both the single post template
 * (template-parts/single/fimg.php, wrapper .cloudsoft-post-thumbnail-single)
 * and the page template (template-parts/page/fimg.php, wrapper
 * .cloudsoft-page-thumbnail) read the attachment's post_excerpt into a
 * `.wp-caption-text` element that inherits the sitewide overlay treatment
 * from main.css (position: absolute, 30% max-width, dark background) — the
 * same base rule that also styles overlay captions on listing-card
 * thumbnails elsewhere on the site, which is why this override is scoped to
 * these two hero wrappers only and does not touch `.wp-caption-text` itself.
 *
 * The article-generation workflow leaves featured_image.caption empty by
 * default so this never triggers (see CLAUDE.md §11). This rule is the
 * second line of defence: if a caption does get set on a hero image, it
 * reads below the image instead of overlapping it, matching the inline
 * image caption treatment above.
 */
.cloudsoft-post-thumbnail-single .wp-caption-text,
.cloudsoft-page-thumbnail .wp-caption-text {
	position: static;
	left: auto;
	bottom: auto;
	max-width: 100%;
	min-width: 0;
	margin: 0.8rem 0 0;
	padding: 0;
	background: none;
	background-color: transparent;
	color: #55657d;
	text-align: center;
}

.cloudsoft-post-thumbnail-single:hover .wp-caption-text,
.cloudsoft-page-thumbnail:hover .wp-caption-text {
	background: none;
	color: #55657d;
}

/* ==========================================================================
   Article content polish
   Uses the theme's own configured content colours (color_content_acc
   #cf2156) rather than inventing new ones, so imported articles stay
   visually consistent with the rest of the site.
   ========================================================================== */

/* --- Lists: replace bare browser bullets/numerals with brand markers --- */

.cloudsoft-entry-content .wp-block-list {
	list-style: none;
	padding-left: 0;
}

.cloudsoft-entry-content ul.wp-block-list li,
.cloudsoft-entry-content ol.wp-block-list li {
	position: relative;
	padding-left: 1.7rem;
	margin-bottom: 0.7rem;
	line-height: 1.65;
}

.cloudsoft-entry-content ul.wp-block-list li::before {
	content: "";
	position: absolute;
	left: 0;
	top: 0.65em;
	width: 8px;
	height: 8px;
	border-radius: 2px;
	background: #cf2156;
}

.cloudsoft-entry-content ol.wp-block-list {
	counter-reset: cloudsoft-ol;
}

.cloudsoft-entry-content ol.wp-block-list li {
	counter-increment: cloudsoft-ol;
}

.cloudsoft-entry-content ol.wp-block-list li::before {
	content: counter(cloudsoft-ol);
	position: absolute;
	left: 0;
	top: 0;
	font-weight: 700;
	color: #cf2156;
}

.cloudsoft-entry-content .wp-block-list li:last-child {
	margin-bottom: 0;
}

/* --- Blockquote: give the plain quote block a visual identity --- */

.cloudsoft-entry-content .wp-block-quote:not(.is-large):not(.is-style-large) {
	position: relative;
	margin: 0 0 3.6rem;
	padding: 0.4rem 0 0.4rem 2.2rem;
	border-left: 4px solid #cf2156;
}

.cloudsoft-entry-content .wp-block-quote:not(.is-large):not(.is-style-large) p {
	font-size: 1.15em;
	font-style: italic;
	color: #444444;
}

.cloudsoft-entry-content .wp-block-quote:not(.is-large):not(.is-style-large) cite {
	display: block;
	margin-top: 0.6rem;
	font-size: 80%;
	font-style: normal;
	text-transform: uppercase;
	letter-spacing: 0.04em;
	color: #55657d;
}

/* --- Code blocks: frame them so they read as a distinct surface --- */

.cloudsoft-entry-content .wp-block-code {
	position: relative;
	border-radius: 8px;
	border-top: 3px solid #cf2156;
	background: #f6f7f9;
	overflow-x: auto;
}

.cloudsoft-entry-content .wp-block-code code {
	display: block;
	white-space: pre;
}

/* --- Inline images: separate diagrams and photos from the page background --- */

.cloudsoft-entry-content .wp-block-image img {
	border-radius: 8px;
	box-shadow: 0 1px 3px rgba(15, 23, 42, 0.08), 0 1px 20px rgba(15, 23, 42, 0.06);
}

/* --- Section headings: a small accent mark to signal a new section --- */

.cloudsoft-entry-content h2.wp-block-heading {
	position: relative;
	margin-top: 3.2rem;
	padding-top: 1.4rem;
}

.cloudsoft-entry-content h2.wp-block-heading::before {
	content: "";
	position: absolute;
	top: 0;
	left: 0;
	width: 42px;
	height: 4px;
	border-radius: 2px;
	background: #cf2156;
}

.cloudsoft-entry-content > h2.wp-block-heading:first-child {
	margin-top: 0;
}