/**
 * CEMW front-end content styles.
 *
 * Why this file exists: the markdown→Gutenberg converter (lib/markdown/) emits two constructs whose
 * legibility cannot be left to the active theme:
 *
 *   1. Code blocks (`.wp-block-code`). Core ships no colour for these; a dark theme (this site runs
 *      Astra dark) gives the <pre> a light background while the <code> text inherits the page's
 *      near-white colour → white-on-white, illegible. We set an explicit, self-contained dark scheme
 *      so a code sample is always readable regardless of theme.
 *   2. Obsidian callouts (`.cemw-callout` / `.cemw-callout-<type>`). The converter renders a callout
 *      as a classed wp:quote; without this stylesheet it would fall back to a plain blockquote with
 *      no visual distinction.
 *
 * This is enqueued ONLY on singular CEMW-published content (class-cemw-content-styles.php gates on the
 * `_cemw_cpb_card` post-meta), so the plain `.wp-block-code` selector is safe — it never loads on a
 * non-CEMW page. Colours are hardcoded (no theme variables) so the file is portable across themes.
 */

/* ---- Code blocks: guaranteed light-on-dark legibility (the white-box fix) ----
   The block editor scopes its own styles under `.editor-styles-wrapper` (e.g.
   `.editor-styles-wrapper .wp-block-code`), which out-specifies a bare `.wp-block-code`. Plugin
   settings styles injected into the canvas are NOT auto-scoped, so a bare selector loses inside the
   editor even though it loads. We therefore match that scope AND force the colours with !important so
   the box is legible in both the editor canvas and on the front end (harmless there — it's our own
   content). */
.wp-block-code {
	background: #1e1e2e !important;
	color: #e6e6ea !important;
	border: 1px solid #33334d;
	border-radius: 6px;
	padding: 1em 1.25em;
	margin: 1.5em 0;
	overflow-x: auto;
	font-family: ui-monospace, SFMono-Regular, "SF Mono", Menlo, Consolas, "Liberation Mono", monospace;
	font-size: 0.9em;
	line-height: 1.55;
	tab-size: 2;
}

.editor-styles-wrapper .wp-block-code,
.block-editor-block-list__layout .wp-block-code {
	background: #1e1e2e !important;
	color: #e6e6ea !important;
	border: 1px solid #33334d;
}

.wp-block-code code,
.editor-styles-wrapper .wp-block-code code,
.block-editor-block-list__layout .wp-block-code code {
	color: #e6e6ea !important;
	background: transparent !important;
	padding: 0;
	border: 0;
	white-space: pre;
	font-family: inherit;
}

/* ---- Obsidian callouts: a classed wp:quote the converter emits ---- */
.cemw-callout {
	border-left: 4px solid #7aa2f7;
	background: rgba(122, 162, 247, 0.08);
	padding: 0.85em 1.1em;
	margin: 1.5em 0;
	border-radius: 4px;
}

.cemw-callout > p:first-child {
	margin-top: 0;
}

.cemw-callout > p:last-child {
	margin-bottom: 0;
}

.cemw-callout > p:first-child strong {
	letter-spacing: 0.01em;
}

/* Type accents — map the common Obsidian callout types to a sensible colour. Unlisted types fall back
   to the neutral blue default above. */
.cemw-callout-tip,
.cemw-callout-success,
.cemw-callout-check {
	border-left-color: #9ece6a;
	background: rgba(158, 206, 106, 0.09);
}

.cemw-callout-warning,
.cemw-callout-caution,
.cemw-callout-attention {
	border-left-color: #e0af68;
	background: rgba(224, 175, 104, 0.10);
}

.cemw-callout-danger,
.cemw-callout-failure,
.cemw-callout-error,
.cemw-callout-bug {
	border-left-color: #f7768e;
	background: rgba(247, 118, 142, 0.10);
}

.cemw-callout-info,
.cemw-callout-note,
.cemw-callout-abstract,
.cemw-callout-summary {
	border-left-color: #7aa2f7;
	background: rgba(122, 162, 247, 0.08);
}

.cemw-callout-quote,
.cemw-callout-cite {
	border-left-color: #9aa0b4;
	background: rgba(154, 160, 180, 0.08);
}
