/**
 * Ask InSightGY.
 *
 * Every colour and measure reads a theme token first and falls back to the
 * literal InSightGY value, so this looks right inside the theme and still
 * looks deliberate under a default one. Radius stays at zero throughout,
 * because that is a rule of the design system rather than a preference.
 */

.ignr-ask,
.ignr-ask-launch {
	--ignr-paper: var(--paper, #fbfcfd);
	--ignr-paper-2: var(--paper-2, #eef2f6);
	--ignr-ink: var(--ink, #002038);
	--ignr-ink-soft: var(--ink-soft, #3d5a72);
	--ignr-ink-meta: var(--ink-meta, #54697f);
	--ignr-rule: var(--rule, #d5dee6);
	--ignr-accent: var(--accent, #f8a830);
	--ignr-accent-text: var(--accent-text, #8f5208);
	--ignr-navy: var(--brand-navy, #002038);
	--ignr-ui: var(--font-ui, "Archivo", system-ui, -apple-system, "Segoe UI", sans-serif);
	--ignr-ease: var(--ease-out, cubic-bezier(.23, 1, .32, 1));
}

/* ── Launcher ─────────────────────────────────────────────────────────── */

/*
 * The bottom-right corner usually already has something in it — a back-to-top
 * button, most often. The InSightGY theme publishes what it occupies there as
 * --fab-size, --fab-inset and --fab-gap, so this steps to the left of it
 * instead of landing on top of it.
 *
 * Every fallback is zero except the inset, so on a theme that publishes
 * nothing this sits in the corner exactly as before. The offset is static
 * rather than conditional on the other button being visible, because a
 * launcher that slides sideways when the reader scrolls is worse than one
 * sitting slightly further in.
 */
.ignr-ask-launch {
	position: fixed;
	inset-block-end: var(--fab-inset, 1.25rem);
	inset-inline-end: calc(var(--fab-inset, 1.25rem) + var(--fab-size, 0px) + var(--fab-gap, 0px));
	z-index: 60;

	display: inline-flex;
	align-items: center;
	gap: .5rem;

	margin: 0;
	padding: .75rem 1rem;
	border: 0;
	border-radius: 0;

	font-family: var(--ignr-ui);
	font-size: .875rem;
	font-weight: 700;
	letter-spacing: .01em;
	line-height: 1;

	color: var(--ignr-navy);
	background: var(--ignr-accent);
	box-shadow: 0 2px 0 0 var(--ignr-navy);
	cursor: pointer;

	transition: transform .18s var(--ignr-ease), box-shadow .18s var(--ignr-ease);
}

.ignr-ask-launch svg {
	flex: 0 0 auto;
}

@media (hover: hover) and (pointer: fine) {
	.ignr-ask-launch:hover {
		transform: translateY(-2px);
		box-shadow: 0 4px 0 0 var(--ignr-navy);
	}
}

.ignr-ask-launch:active {
	transform: translateY(0);
	box-shadow: 0 1px 0 0 var(--ignr-navy);
}

.ignr-ask-launch:focus-visible {
	outline: 3px solid var(--ignr-navy);
	outline-offset: 2px;
}

body.ignr-ask-open .ignr-ask-launch {
	/* The panel covers it on a phone, so it would only be a stray tab stop. */
	visibility: hidden;
}

@media (max-width: 480px) {
	.ignr-ask-launch span {
		position: absolute;
		width: 1px;
		height: 1px;
		padding: 0;
		margin: -1px;
		overflow: hidden;
		clip: rect(0, 0, 0, 0);
		white-space: nowrap;
		border: 0;
	}

	.ignr-ask-launch {
		padding: .875rem;
	}
}

/* ── Shell ────────────────────────────────────────────────────────────── */

.ignr-ask {
	display: flex;
	flex-direction: column;

	font-family: var(--ignr-ui);
	color: var(--ignr-ink);
	background: var(--ignr-paper);
	border: 1px solid var(--ignr-rule);
	border-radius: 0;
}

.ignr-ask[hidden] {
	display: none;
}

/* Clears the same corner column as the launcher, for the same reason. */
.ignr-ask--panel {
	position: fixed;
	inset-block-end: var(--fab-inset, 1.25rem);
	inset-inline-end: calc(var(--fab-inset, 1.25rem) + var(--fab-size, 0px) + var(--fab-gap, 0px));
	z-index: 61;

	width: min(26rem, calc(100vw - 2.5rem - var(--fab-size, 0px)));
	max-height: min(34rem, calc(100vh - 2.5rem));

	box-shadow: 0 18px 48px rgba(0, 32, 56, .22);

	opacity: 0;
	transform: translateY(12px);
	transition: opacity .22s var(--ignr-ease), transform .22s var(--ignr-ease);
}

.ignr-ask--panel.is-open {
	opacity: 1;
	transform: none;
}

@media (max-width: 480px) {
	.ignr-ask--panel {
		inset: 0;
		width: 100%;
		max-height: none;
		border: 0;
	}
}

.ignr-ask--inline {
	width: 100%;
	max-width: 46rem;
	margin-inline: auto;
	min-height: 24rem;
}

/* ── Head ─────────────────────────────────────────────────────────────── */

.ignr-ask__head {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 1rem;

	padding: .875rem 1rem;
	border-block-end: 1px solid var(--ignr-rule);
	background: var(--ignr-navy);
	color: #f2f6fa;
}

.ignr-ask__title {
	margin: 0;
	font-family: var(--ignr-ui);
	font-size: .8125rem;
	font-weight: 800;
	letter-spacing: .08em;
	text-transform: uppercase;
	color: inherit;
}

.ignr-ask__close {
	display: inline-flex;
	padding: .25rem;
	margin: -.25rem;
	border: 0;
	border-radius: 0;
	color: inherit;
	background: none;
	cursor: pointer;
}

.ignr-ask__close:focus-visible {
	outline: 2px solid var(--ignr-accent);
	outline-offset: 2px;
}

/* ── Log ──────────────────────────────────────────────────────────────── */

.ignr-ask__log {
	flex: 1 1 auto;
	overflow-y: auto;
	overscroll-behavior: contain;

	display: flex;
	flex-direction: column;
	gap: 1rem;

	padding: 1rem;
	min-height: 8rem;
}

.ignr-ask__turn {
	max-width: 100%;
}

.ignr-ask__turn--user .ignr-ask__body {
	margin-inline-start: auto;
	max-width: 85%;
	padding: .625rem .75rem;
	background: var(--ignr-paper-2);
	border-inline-start: 2px solid var(--ignr-accent);
}

.ignr-ask__turn--user .ignr-ask__body p {
	font-weight: 600;
}

.ignr-ask__turn.is-error .ignr-ask__body {
	border-inline-start: 2px solid var(--ignr-accent-text);
	padding-inline-start: .75rem;
}

.ignr-ask__body > * + * {
	margin-block-start: .75rem;
}

.ignr-ask__body p,
.ignr-ask__body li {
	margin: 0;
	font-size: .9375rem;
	line-height: 1.6;
	color: var(--ignr-ink);
}

.ignr-ask__body ul {
	margin: 0;
	padding-inline-start: 1.1rem;
	display: grid;
	gap: .375rem;
}

.ignr-ask__status {
	color: var(--ignr-ink-meta);
	font-style: italic;
}

.ignr-ask__status::after {
	content: "";
	display: inline-block;
	width: .4em;
	margin-inline-start: .15em;
	animation: ignr-dots 1.2s steps(4, end) infinite;
}

@keyframes ignr-dots {
	0% { content: ""; }
	25% { content: "."; }
	50% { content: ".."; }
	75% { content: "..."; }
}

/* ── Citation markers ─────────────────────────────────────────────────── */

.ignr-ask__cite {
	display: inline-block;
	margin-inline-start: .15em;
	padding: 0 .3em;

	font-size: .625rem;
	font-weight: 800;
	line-height: 1.5;
	vertical-align: super;
	text-decoration: none;

	color: var(--ignr-navy);
	background: var(--ignr-accent);
}

.ignr-ask__cite:hover,
.ignr-ask__cite:focus-visible {
	background: var(--ignr-navy);
	color: #f2f6fa;
}

/* ── Sources ──────────────────────────────────────────────────────────── */

.ignr-ask__sources {
	margin-block-start: 1rem;
	padding-block-start: .75rem;
	border-block-start: 1px solid var(--ignr-rule);
}

.ignr-ask__sources-title {
	margin: 0 0 .5rem;
	font-size: .6875rem;
	font-weight: 800;
	letter-spacing: .1em;
	text-transform: uppercase;
	color: var(--ignr-ink-meta);
}

.ignr-ask__sources ol {
	margin: 0;
	padding-inline-start: 1.2rem;
	display: grid;
	gap: .5rem;
}

.ignr-ask__sources li {
	font-size: .8125rem;
	line-height: 1.45;
}

.ignr-ask__sources a {
	color: var(--ignr-accent-text);
	font-weight: 600;
	text-decoration-thickness: 1px;
	text-underline-offset: 2px;
}

.ignr-ask__source-date {
	display: block;
	color: var(--ignr-ink-meta);
	font-size: .75rem;
}

.ignr-ask__searchout a {
	color: var(--ignr-accent-text);
	font-weight: 700;
}

/* ── Form ─────────────────────────────────────────────────────────────── */

.ignr-ask__form {
	display: flex;
	align-items: flex-end;
	gap: .5rem;

	padding: .75rem 1rem;
	border-block-start: 1px solid var(--ignr-rule);
	background: var(--ignr-paper);
}

.ignr-ask__input {
	flex: 1 1 auto;
	min-height: 2.75rem;
	max-height: 10rem;
	padding: .625rem .75rem;
	resize: none;

	font-family: var(--ignr-ui);
	font-size: .9375rem;
	line-height: 1.45;
	color: var(--ignr-ink);

	background: var(--ignr-paper);
	border: 1px solid var(--ignr-rule);
	border-radius: 0;
}

.ignr-ask__input:focus-visible {
	outline: 2px solid var(--ignr-accent);
	outline-offset: -1px;
	border-color: var(--ignr-ink);
}

.ignr-ask__send {
	flex: 0 0 auto;
	display: inline-flex;
	align-items: center;
	justify-content: center;

	width: 2.75rem;
	height: 2.75rem;
	padding: 0;

	color: var(--ignr-navy);
	background: var(--ignr-accent);
	border: 0;
	border-radius: 0;
	cursor: pointer;

	transition: background .16s var(--ignr-ease);
}

.ignr-ask__send:focus-visible {
	outline: 3px solid var(--ignr-navy);
	outline-offset: 2px;
}

.ignr-ask__send[disabled] {
	background: var(--ignr-paper-2);
	color: var(--ignr-ink-meta);
	cursor: default;
}

.ignr-ask__note {
	margin: 0;
	padding: 0 1rem .75rem;
	font-size: .6875rem;
	line-height: 1.4;
	color: var(--ignr-ink-meta);
}

.ignr-ask__noscript a {
	color: var(--ignr-accent-text, #8f5208);
	font-weight: 700;
}

/* ── Motion ───────────────────────────────────────────────────────────── */

@media (prefers-reduced-motion: reduce) {
	.ignr-ask-launch,
	.ignr-ask--panel,
	.ignr-ask__send {
		transition: none;
	}

	.ignr-ask--panel {
		opacity: 1;
		transform: none;
	}

	.ignr-ask__status::after {
		animation: none;
		content: "...";
	}
}
