/**
 * Plectra ask — register styling for /ask (compose + the asker's own status) and
 * /asks (the curator queue). Phase 05e Wave 4.
 *
 * The ask markup is rendered by plectra-offers (plectra_ask_* in ask-page.php /
 * ask-curator.php) through plectra_theme_render_page(), so it inherits the page
 * chrome but carries no look of its own. This brings it into register: warm paper,
 * warm ink, terracotta accent, mist captions, Hanken Grotesk — continuous with nav.css /
 * register.css. Quiet, uncrowded, contemplative. No system-blue, no grey pills.
 *
 * Contrast (AA, from theme.json): accent #A8412A on paper 5.64:1, mist 6.60:1,
 * ink 15.34:1 — all pass; ink-on-paper buttons invert for the primary action.
 */

.plectra-ask__heading {
	margin-top: var(--wp--preset--spacing--lg);
}

/* ── Compose form ─────────────────────────────────────────────────────────── */

.plectra-ask--compose {
	max-width: 38rem;
	margin-top: var(--wp--preset--spacing--md);
}

.plectra-ask__label {
	display: block;
	margin: var(--wp--preset--spacing--md) 0 var(--wp--preset--spacing--xs);
}

/* The textarea + hint sit on their own full-width line beneath the label — never
   floated beside it (the unstyled default read as a cramped box on desktop). */
.plectra-ask--compose textarea,
.plectra-ask--compose input[type="text"] {
	display: block;
	width: 100%;
	box-sizing: border-box;
	padding: var(--wp--preset--spacing--sm);
	font: inherit;
	line-height: 1.5;
	color: var(--wp--preset--color--ink);
	background: var(--wp--preset--color--ivory); /* raised card surface: white in light (Dom's white field fill, WALK-3), lifted-warm #38322A in dark — modes.css flips ivory so the field no longer glares on espresso paper (walk #20). Rule border + ink text kept. */
	border: 1px solid var(--wp--preset--color--rule);
	border-radius: 2px;
}

.plectra-ask--compose textarea {
	min-height: 6rem;
	resize: vertical;
}

.plectra-ask--compose textarea:focus,
.plectra-ask--compose input[type="text"]:focus {
	outline: 2px solid var(--wp--preset--color--accent);
	outline-offset: 1px;
}

/* ── Closeness dials ──────────────────────────────────────────────────────── */

.plectra-ask__dial {
	margin: var(--wp--preset--spacing--md) 0;
	padding: var(--wp--preset--spacing--sm) var(--wp--preset--spacing--md) var(--wp--preset--spacing--md);
	border: 1px solid var(--wp--preset--color--rule);
	border-radius: 2px;
}

.plectra-ask__dial legend {
	padding: 0 var(--wp--preset--spacing--xs);
	font-weight: 500;
}

/* Each option on its own line; the note reads beneath its label, not run-on. */
.plectra-ask__choice {
	display: grid;
	grid-template-columns: auto 1fr;
	gap: 0 var(--wp--preset--spacing--sm);
	align-items: baseline;
	margin: var(--wp--preset--spacing--sm) 0 0;
}

.plectra-ask__choice input {
	margin: 0.2rem 0 0;
}

.plectra-ask__choice-label {
	font-weight: 500;
}

.plectra-ask__choice-note {
	grid-column: 2;
	color: var(--wp--preset--color--mist);
	font-size: 0.9em;
}

/* ── Help + actions ───────────────────────────────────────────────────────── */

.plectra-ask__help {
	max-width: 34rem;
	color: var(--wp--preset--color--mist);
}

.plectra-ask--compose input[type="submit"],
.plectra-ask__action button {
	font: inherit;
	cursor: pointer;
	color: var(--wp--preset--color--paper);
	background: var(--wp--preset--color--ink);
	border: 0;
	border-radius: 2px;
	padding: var(--wp--preset--spacing--xs) var(--wp--preset--spacing--md);
}

.plectra-ask__notice {
	color: var(--wp--preset--color--accent);
}

/* ── Your asks (member) + the curator queue ───────────────────────────────── */

.plectra-ask__yours-heading {
	margin-top: var(--wp--preset--spacing--xl);
}

.plectra-ask__list,
.plectra-ask__queue {
	list-style: none;
	margin: 0;
	padding: 0;
}

.plectra-ask__item,
.plectra-ask__queue-item {
	padding: var(--wp--preset--spacing--md) 0;
	border-top: 1px solid var(--wp--preset--color--rule);
}

.plectra-ask__text {
	max-width: 38rem;
}

.plectra-ask__from {
	font-weight: 500;
}

.plectra-ask__state {
	color: var(--wp--preset--color--accent);
	font-weight: 500;
}

.plectra-ask__meta {
	color: var(--wp--preset--color--mist);
	font-size: 0.9em;
}

.plectra-ask__empty {
	color: var(--wp--preset--color--mist);
}

/* The withdraw control is deliberately quiet — a recessed outline, not a button. */
.plectra-ask__withdraw {
	margin-top: var(--wp--preset--spacing--sm);
}

.plectra-ask__withdraw button {
	font: inherit;
	cursor: pointer;
	color: var(--wp--preset--color--mist);
	background: transparent;
	border: 1px solid var(--wp--preset--color--rule);
	border-radius: 2px;
	padding: 0.15rem var(--wp--preset--spacing--sm);
}

.plectra-ask__actions {
	display: flex;
	flex-wrap: wrap;
	gap: var(--wp--preset--spacing--sm);
	margin-top: var(--wp--preset--spacing--sm);
}

/* ── Codex meta register (Phase B3 — apex mono parity) ────────────────────────
 * The ask's PROSE (the words of the ask, help text, choice notes) stays in the warm
 * register above. Only the machine-ish META moves to the apex mono voice, matching
 * the footer/room (B1/B2): the ask STATE reads as a status tag, and the timestamp/
 * provenance meta as a mono caption. Tokens only; AA per this file's header holds —
 * terracotta 5.64:1, mist 6.60:1 on paper. */

/* The ask STATE (submitted → routed → acknowledged → met) → a mono status tag.
 * Terracotta + the slight weight emphasis are inherited from the rule above (it is the
 * "where this ask stands" signal); only family/casing/tracking change. */
.plectra-ask__state {
	font-family: var(--font-mono);
	font-size: var(--text-eyebrow);
	text-transform: uppercase;
	letter-spacing: var(--text-eyebrow-letter-spacing);
}

/* Timestamp / provenance meta → mono caption mist (metadata register). */
.plectra-ask__meta {
	font-family: var(--font-mono);
	font-size: var(--text-caption);
	line-height: var(--text-caption-line-height);
	color: var(--color-mist);
}
