/*
Theme Name: Employment Screening Services
Theme URI: https://employmentscreening.services
Author: Binary Glyph
Author URI: https://binaryglyph.com
Description: Block theme for employmentscreening.services. Colors and type compile from the approved token master (scripts/build-theme-json.py); this file carries only the callout styles theme.json cannot express.
Requires at least: 6.6
Requires PHP: 8.1
Version: 0.1.0
License: GNU General Public License v2 or later
Text Domain: esservices
*/

/* Every color below is a theme.json role (--wp--custom--color--*). No hex lives here. */
:root {
	--es-surface: var(--wp--custom--color--surface);
	--es-mono: var(--wp--preset--font-family--mono);
}

/* ── Inline: eyebrow / citation (paragraph block style) ── */
.is-style-eyebrow {
	font-family: var(--es-mono);
	font-size: var(--wp--preset--font-size--caption);
	letter-spacing: 0.04em;
	margin-bottom: 0.25rem !important;
}
.is-style-key-figure {
	font-family: var(--es-mono);
	font-size: 3.4rem;
	line-height: 1;
	font-weight: 500;
	margin: 0 !important;
}
.is-style-key-figure + .is-style-eyebrow { text-transform: uppercase; letter-spacing: var(--wp--custom--tracking--label); }

/* ── Focus on the purple field: purple-600 measures 2.39:1 on purple-900; purple-200 clears 3:1 ── */
:is(.has-purple-900-background-color, .is-style-callout-field, .is-style-callout-figure, .is-style-callout-cta) a:focus,
:is(.has-purple-900-background-color, .is-style-callout-field, .is-style-callout-figure, .is-style-callout-cta) a:focus-visible {
	outline-color: var(--wp--custom--color--focus-on-dark);
}

/* ── Callouts: group block styles. One family, nine treatments. ── */
.wp-block-group[class*="is-style-callout-"] { padding: 1.1rem 1.25rem; font-size: 0.94rem; }
.wp-block-group[class*="is-style-callout-"] > * { margin-block: 0; }
.wp-block-group[class*="is-style-callout-"] > * + * { margin-block-start: 0.4rem; }
.wp-block-group[class*="is-style-callout-"] :where(h2, h3, h4) { font-size: 1.06rem; line-height: 1.3; }

/* A · Statute — the everyday callout */
.is-style-callout-statute {
	background: var(--wp--custom--color--surface-set-apart);
	border-left: 3px solid var(--wp--custom--color--callout-rule);
}
.is-style-callout-statute .is-style-eyebrow { color: var(--wp--custom--color--callout-label); font-weight: 500; }

/* B · Field, C · Key figure, D · Tool CTA — the purple field. The ONLY place mint may be type. */
.is-style-callout-field, .is-style-callout-figure, .is-style-callout-cta {
	background: var(--wp--custom--color--surface-dark);
	color: var(--wp--preset--color--neutral-300);
}
.is-style-callout-field :where(h2, h3, h4), .is-style-callout-cta :where(h2, h3, h4) { color: var(--wp--preset--color--neutral-0); }
.is-style-callout-field .is-style-eyebrow,
.is-style-callout-cta .is-style-eyebrow,
.is-style-callout-figure .is-style-eyebrow,
.is-style-callout-figure .is-style-key-figure { color: var(--wp--custom--color--accent-on-dark); }
.is-style-callout-field a, .is-style-callout-figure a, .is-style-callout-cta a:not(.wp-element-button) { color: var(--wp--preset--color--purple-200); }
.is-style-callout-figure { border-left: 3px solid var(--wp--custom--color--accent-fill); }
.is-style-callout-cta { border-top: 4px solid var(--wp--custom--color--accent-fill); }
.is-style-callout-cta .is-style-eyebrow { text-transform: uppercase; letter-spacing: 0.1em; }
.is-style-callout-cta .wp-element-button,
.is-style-mint .wp-element-button {
	background: var(--wp--custom--color--accent-fill);
	color: var(--wp--custom--color--text-on-accent);
}

/* E · State variation — inline code renders as a state chip */
.is-style-callout-state {
	background: var(--wp--custom--color--surface-inset);
	border: 1px solid var(--wp--custom--color--line-strong);
	border-radius: 3px;
}
.is-style-callout-state code {
	font-family: var(--es-mono); font-size: 0.72rem; font-weight: 500; letter-spacing: 0.06em;
	color: var(--wp--custom--color--text-strong); background: var(--wp--custom--color--surface);
	border: 1px solid var(--wp--custom--color--line-strong); border-radius: 2px; padding: 1px 6px; margin-right: 4px;
}

/* F · Margin note */
.wp-block-group.is-style-callout-note {
	padding-inline: 0;
	border-block: 1px solid var(--wp--custom--color--line);
	color: var(--wp--custom--color--text-muted);
}
.is-style-callout-note code { font-family: var(--es-mono); color: var(--wp--custom--color--text-strong); background: none; margin-right: 6px; }

/* G/H/I · Status — amber, crimson, ink. Never mint: this site does not issue verdicts. */
.is-style-callout-action, .is-style-callout-deficiency, .is-style-callout-complete { border-left: 3px solid; }
.is-style-callout-action { --es-st: var(--wp--custom--color--status-action); }
.is-style-callout-deficiency { --es-st: var(--wp--custom--color--status-deficiency); }
.is-style-callout-complete { --es-st: var(--wp--custom--color--status-complete); background: var(--wp--custom--color--surface-inset); }
.is-style-callout-action, .is-style-callout-deficiency { background: color-mix(in srgb, var(--es-st) 8%, var(--es-surface)); }
.is-style-callout-action, .is-style-callout-deficiency, .is-style-callout-complete { border-color: var(--es-st); }
:is(.is-style-callout-action, .is-style-callout-deficiency, .is-style-callout-complete) .is-style-eyebrow {
	color: var(--es-st); font-weight: 500; text-transform: uppercase; letter-spacing: 0.1em;
}

/* Affiliate disclosure — clear and conspicuous (FTC): full body color, never quiet text */
.wp-block-group.is-style-callout-disclosure {
	background: var(--wp--custom--color--surface-inset);
	color: var(--wp--custom--color--text);
	font-size: var(--wp--preset--font-size--small);
	padding: 0.7rem 0.9rem;
}

/* The domain as the mark — set as text, no logo file */
.es-mark { font-weight: 700; letter-spacing: -0.01em; text-decoration: none; color: var(--wp--custom--color--text-strong); }
.es-mark span { display: inline-block; font-weight: 400; color: var(--wp--custom--color--action); }

/* ── Page frame: footer sits at the bottom of short pages ── */
.wp-site-blocks { min-height: 100vh; display: flex; flex-direction: column; }
.wp-site-blocks > main { flex: 1 0 auto; }

/* ── Inline citations: mono, sized to sit level with the prose ── */
:where(p, li, td, th, figcaption) code {
	font-family: var(--es-mono);
	font-size: 0.88em;
	background: none;
	padding: 0;
}

/* ── Tables: hairline rules, a stronger rule under the head, left-aligned heads ── */
.wp-block-table table { border-collapse: collapse; }
.wp-block-table table :is(td, th) { border: 0; border-bottom: 1px solid var(--wp--custom--color--line); padding: 0.5rem 0.75rem 0.5rem 0; text-align: left; }
.wp-block-table table thead { border: 0; }
.wp-block-table table { border: 0; }
.wp-block-table table thead th {
	border-bottom: 1px solid var(--wp--custom--color--line-strong);
	font-family: var(--es-mono); font-size: var(--wp--preset--font-size--caption); font-weight: 500;
	letter-spacing: var(--wp--custom--tracking--label); text-transform: uppercase; color: var(--wp--custom--color--text-muted);
}
.wp-block-table td { font-variant-numeric: tabular-nums; }