/**
 * « Instructions pour les assistants IA » — layout « Sans CSS » (owner's pick,
 * 10/11/2026). Loaded by inc/ai-instructions.php on templates/rmd-ai.php only.
 *
 * Copied from the page's checked preview, rule for rule
 * (tools/pages/specs/instructions-ia/preview/page.html, the page's own <style>
 * block — its « Sans CSS » and table parts). Change both together.
 *
 * nectivdigital.com/ai-instructions as it renders, measured 03/11: every line a
 * paragraph — the « # » and « ## » lines too — in Inter Regular 18 / 32, one
 * colour (content-secondary), 24 between lines; no bold; links accent/on-indigo,
 * Medium, no underline; 80 above and below (56 under 1024). The headings stay
 * h1 / h2 / h3 for the document outline; only their look is a paragraph. The
 * table stays a <table> for machines and reads as « label : text » lines.
 *
 * UNLAYERED on purpose, as the preview's block was: it must win over the
 * layered sheets (main.css, sections.css) on these few elements, whatever their
 * weight. Every selector is scoped to .rmd-ai / .ai-plain, so nothing leaks.
 */

.rmd-ai { display: block; background: var(--color-surface-canvas, #fff); }
.rmd-ai :where(a, summary):focus-visible { outline: 2px solid var(--color-border-control-focus, #2b7fff); outline-offset: 2px; border-radius: var(--radius-2, 2px); }

.ai-plain { padding-block: var(--spacing-80, 80px); font-family: var(--font-family-secondary, Inter, system-ui, sans-serif); font-size: 18px; line-height: 32px; font-weight: 400; color: var(--color-content-secondary, #1d293d); }
.ai-plain :is(h1, h2, p, ul, li) { font: inherit; color: inherit; letter-spacing: normal; }
/* the margin reset at 0,1,0 (:where), so the 24 between lines below wins */
.ai-plain :where(h1, h2, p, ul, li) { margin: 0; }
.ai-plain > * + *, .ai-plain li + li { margin-top: 24px; }
.ai-plain ul { padding: 0; list-style: none; }
/* no bold (owner's call 03/11): the client names stay <strong> in the markup,
   read as plain text */
.ai-plain strong { font-weight: inherit; color: inherit; }
.ai-plain a { color: var(--color-accent-on-indigo, #4f39f6); font-weight: 500; text-decoration: none; overflow-wrap: anywhere; }
.ai-plain a:hover { text-decoration: underline; }
.ai-plain a:focus-visible { outline: 2px solid var(--color-border-control-focus, #2b7fff); outline-offset: 2px; border-radius: var(--radius-2, 2px); }
@media (max-width: 1023px) {
	.ai-plain { padding-block: 56px; }
}

/* A third heading level and a table, read as the same plain lines. The table
   stays a <table> for machines; on screen each row is its first cell, then
   « label : text » per column (the label from the document's header row). */
.ai-plain :is(h3, h4, table, thead, tbody, tr, th, td) { font: inherit; color: inherit; letter-spacing: normal; }
/* at 0,0,0: this block comes after « .ai-plain > * + * », which must keep its 24 */
:where(.ai-plain) :where(h3, h4, table, th, td) { margin: 0; padding: 0; }
.ai-plain :is(table, tbody, tr, th, td) { display: block; text-align: left; border: 0; }
.ai-plain thead { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; }
.ai-plain tbody tr + tr { margin-top: 24px; }
.ai-plain tbody td::before { content: attr(data-label) "\00a0: "; }
