/* Atlas Arcadia — Blog blocks (U3): aa/callout, aa/fact-box, aa/record-card, .aa-credit.
   Front end and editor iframe. Tokens come from aa-design-tokens; fallbacks are the
   live values so a missing stylesheet degrades rather than collapses. */

/* ---- Callout ------------------------------------------------------------ */
.aa-callout {
	--aa-callout-accent: var(--aa-orange, #db680b);
	--aa-callout-bg: var(--aa-cream, #fdf6e8);
	display: flex;
	gap: 14px;
	align-items: flex-start;
	margin: 1.5em 0;
	padding: 16px 18px;
	background: var(--aa-callout-bg);
	border: 1px solid var(--aa-rule, #e2ded4);
	border-left: 6px solid var(--aa-callout-accent);
	border-radius: 6px;
	color: var(--aa-ink, #8a4a12);
	font-family: var(--aa-text, 'Poppins', system-ui, sans-serif);
	box-sizing: border-box;
}
.aa-callout--did-you-know {
	--aa-callout-accent: var(--aa-stripe-2, #f5a623);
	--aa-callout-bg: #fffbe0;
}
.aa-callout--correction {
	--aa-callout-accent: var(--aa-stripe-4, #e8542a);
	--aa-callout-bg: #fdeee8;
}
.aa-callout__icon {
	flex: 0 0 24px;
	width: 24px;
	height: 24px;
	margin-top: 2px;
	color: var(--aa-callout-accent);
}
.aa-callout--correction .aa-callout__icon { color: #b8381a; }
.aa-callout__body { flex: 1 1 auto; min-width: 0; }
.aa-callout .aa-callout__label {
	margin: 0 0 2px;
	line-height: 1.4;
	font-family: var(--aa-display, 'Cartridge', system-ui, sans-serif);
	font-size: 0.8125rem;
	letter-spacing: 0.04em;
	text-transform: uppercase;
	color: var(--aa-brown, #6a3306);
}
.aa-callout__body > :not(.aa-callout__label) { margin-top: 0; margin-bottom: 0.6em; font-size: 1rem; line-height: 1.6; }
.aa-callout__body > :last-child { margin-bottom: 0; }
.aa-callout__body a { color: inherit; text-decoration-color: var(--aa-callout-accent); }
.aa-callout__toolbar-icon { width: 20px; height: 20px; }

/* ---- Fact box ----------------------------------------------------------- */
.aa-fact-box-wrap {
	margin: 1.5em 0;
	padding: 16px 18px;
	background: #fff;
	border: 1px solid var(--aa-rule, #e2ded4);
	border-top: 6px solid var(--aa-orange, #db680b);
	border-radius: 6px;
	font-family: var(--aa-text, 'Poppins', system-ui, sans-serif);
	color: var(--aa-ink, #8a4a12);
	box-sizing: border-box;
}
.aa-fact-box-wrap .aa-fact-box__title {
	margin: 0 0 4px;
	font-family: var(--aa-display, 'Cartridge', system-ui, sans-serif);
	font-size: 1.125rem;
	line-height: 1.3;
	color: var(--aa-brown, #6a3306);
}
/* One grid for the whole list; each row is a subgrid, so the key column is sized by
   the longest key in the box, not capped per row. Auto: the longest key, up to half
   the box. --key: the writer's width (--aa-fact-key, set inline), up to 60%.
   --fit: the box shrinks to its text, so both columns are their content's width. */
.aa-fact-box {
	margin: 0;
	display: grid;
	grid-template-columns: var(--aa-fact-cols, fit-content(50%) minmax(0, 1fr));
	column-gap: 12px;
}
.aa-fact-box-wrap--fit { width: fit-content; max-width: 100%; --aa-fact-cols: auto minmax(0, auto); }
.aa-fact-box-wrap--key { --aa-fact-cols: min(var(--aa-fact-key), 60%) minmax(0, 1fr); }
.aa-fact-box-wrap--key.aa-fact-box-wrap--fit { --aa-fact-cols: var(--aa-fact-key) minmax(0, auto); }
.aa-fact-box__row {
	grid-column: 1 / -1;
	display: grid;
	grid-template-columns: subgrid;
	padding: 8px 0;
	border-top: 1px solid var(--aa-rule, #e2ded4);
}
.aa-fact-box__row:first-child { border-top: 0; }
.aa-fact-box__row dt {
	margin: 0;
	font-weight: 600;
	color: var(--aa-muted, #7d6f5a);
}
.aa-fact-box__row dd { margin: 0; min-width: 0; overflow-wrap: anywhere; }
.aa-fact-box__row--full dd { grid-column: 1 / -1; }
.aa-fact-box__hint { margin: 0 0 6px; font-size: 0.75rem; color: var(--aa-muted, #7d6f5a); }
@media (max-width: 480px) {
	.aa-fact-box { grid-template-columns: minmax(0, 1fr); }
	.aa-fact-box__row { row-gap: 2px; }
}

/* ---- Record card -------------------------------------------------------- */
.aa-record-card {
	display: flex;
	gap: 14px;
	align-items: stretch;
	margin: 1.5em 0;
	background: #fff;
	border: 1px solid var(--aa-rule, #e2ded4);
	border-radius: 8px;
	overflow: hidden;
	text-decoration: none;
	color: var(--aa-ink, #8a4a12);
	font-family: var(--aa-text, 'Poppins', system-ui, sans-serif);
	box-sizing: border-box;
	max-width: 560px;
}
a.aa-record-card:hover,
a.aa-record-card:focus-visible { border-color: var(--aa-orange, #db680b); }
a.aa-record-card:focus-visible { outline: 3px solid var(--aa-orange, #db680b); outline-offset: 2px; }
.aa-record-card__media {
	position: relative;
	flex: 0 0 38%;
	max-width: 200px;
	min-height: 128px; /* one minimum height for every card, whatever the picture's shape; it stretches with the text */
	background: var(--aa-cream, #fdf6e8);
}
.aa-record-card .aa-record-card__img {
	position: absolute;
	inset: 0;
	display: block;
	width: 100%;
	height: 100%;
	object-fit: cover;
	margin: 0;
	border-radius: 0;
}
.aa-record-card--token .aa-record-card__img { object-fit: contain; padding: 8px; box-sizing: border-box; }
.aa-record-card--no-image { min-height: 0; }
.aa-record-card__body {
	display: flex;
	flex-direction: column;
	justify-content: center;
	gap: 2px;
	min-width: 0;
	padding: 12px 14px 12px 0;
}
.aa-record-card--no-image .aa-record-card__body { padding-left: 16px; border-left: 6px solid var(--aa-orange, #db680b); }
.aa-record-card__kind {
	font-size: 0.6875rem;
	letter-spacing: 0.08em;
	text-transform: uppercase;
	color: var(--aa-muted, #7d6f5a);
}
.aa-record-card__title {
	font-family: var(--aa-display, 'Cartridge', system-ui, sans-serif);
	font-size: 1.125rem;
	line-height: 1.25;
	color: var(--aa-brown, #6a3306);
	overflow-wrap: anywhere;
}
.aa-record-card__place { font-size: 0.875rem; color: var(--aa-muted, #7d6f5a); }
@media (max-width: 480px) {
	.aa-record-card__media { flex-basis: 34%; min-height: 104px; }
	.aa-record-card__title { font-size: 1rem; }
}

/* Record card picker (editor only) */
.aa-record-card-picker {
	padding: 16px;
	background: var(--aa-cream, #fdf6e8);
	border: 1px dashed var(--aa-orange, #db680b);
	border-radius: 6px;
}
.aa-record-card-picker__lead { margin: 0 0 8px; font-weight: 600; color: var(--aa-brown, #6a3306); }
.aa-record-card-picker__kinds { display: flex; gap: 8px; margin-bottom: 8px; }
.aa-record-card-picker__note { margin: 8px 0 0; font-size: 0.875rem; color: var(--aa-muted, #7d6f5a); }
.aa-record-card-picker__list { margin: 8px 0 0; padding: 0; list-style: none; }
.aa-record-card-picker__list li { margin: 0; }
.aa-record-card-picker__list .components-button { width: 100%; justify-content: flex-start; height: auto; min-height: 36px; text-align: left; white-space: normal; }
.aa-record-card-editor__preview { pointer-events: none; margin-bottom: 8px; }

/* ---- Image credit ------------------------------------------------------- */
/* The .aa-credit rules live in template.css, not here: this sheet only loads on a
   page that renders an AA block, and the credit line is added to every image in a
   post, AA blocks or not. */