/**
 * SNYCF — Court Records archive
 *
 * The evidence library. Loads only on /court-records/ and the document-type
 * archives; the row, card and filter components it arranges are shared and
 * live in components.css.
 *
 * @package snycf
 */

/* =====================================================================
 * Intro band
 * ================================================================== */

.snycf-records-intro {
	background-color: var( --snycf-surface-inverse );
	color: var( --snycf-text-on-inverse );
	padding-block: var( --snycf-space-4xl ) var( --snycf-space-3xl );
}

.snycf-records-intro__eyebrow {
	margin: 0;
	font-family: var( --snycf-font-ui ), 'Archivo Fallback';
	font-size: 0.75rem;
	font-weight: var( --snycf-weight-black );
	letter-spacing: var( --snycf-tracking-eyebrow );
	text-transform: uppercase;

	/*
	 * The brand red fails contrast on ink. --snycf-accent-on-ink is the
	 * lightened variant reserved for exactly this surface.
	 */
	color: var( --snycf-accent-on-ink );
}

.snycf-records-intro__title {
	margin: var( --snycf-space-xs ) 0 0;
	font-family: var( --snycf-font-editorial ), 'Source Serif Fallback';
	font-weight: var( --snycf-weight-bold );
	font-size: var( --snycf-size-h1 );
	line-height: var( --snycf-leading-tight );
	letter-spacing: var( --snycf-tracking-display );
	text-transform: none;
	color: var( --snycf-text-on-inverse );

	/* A 60-character document type has to wrap, not overflow. */
	min-width: 0;
	overflow-wrap: break-word;
	text-wrap: pretty;
}

.snycf-records-intro__lead {
	margin: var( --snycf-space-md ) 0 0;
	max-width: 40ch;
	font-family: var( --snycf-font-editorial ), 'Source Serif Fallback';
	font-size: var( --snycf-size-deck );
	line-height: var( --snycf-leading-deck );
	color: var( --snycf-text-prose-on-inverse );
	text-wrap: pretty;
}

.snycf-records-intro__note {
	margin: var( --snycf-space-2xs ) 0 0;
	max-width: 52ch;
	font-size: 0.8125rem;
	line-height: var( --snycf-leading-prose );
	color: var( --snycf-text-meta-on-inverse );
}

.snycf-records-intro__meta {
	margin: var( --snycf-space-md ) 0 0;
	font-family: var( --snycf-font-ui ), 'Archivo Fallback';
	font-size: 0.75rem;
	font-weight: var( --snycf-weight-bold );
	letter-spacing: 0.12em;
	text-transform: uppercase;
	color: var( --snycf-text-meta-on-inverse );
}

.snycf-records-intro__count {
	font-weight: var( --snycf-weight-black );
	color: var( --snycf-accent-on-ink );
}

/* =====================================================================
 * Search
 * ================================================================== */

.snycf-record-search {
	display: flex;
	flex-wrap: wrap;
	gap: 0;
	margin-top: var( --snycf-space-lg );
	max-width: 45rem;
}

.snycf-record-search__input {
	flex: 1 1 12rem;
	min-width: 0;
	box-sizing: border-box;
	min-height: 3.25rem;
	padding: var( --snycf-space-sm ) var( --snycf-space-md );
	border: var( --snycf-border-width-button ) solid var( --snycf-paper );
	background-color: var( --snycf-paper );
	color: var( --snycf-ink );
	font-family: var( --snycf-font-editorial ), 'Source Serif Fallback';
	font-size: 1rem;
}

.snycf-record-search__submit {
	flex: 0 0 auto;
	min-height: 3.25rem;
	padding: var( --snycf-space-sm ) var( --snycf-space-xl );
	border: var( --snycf-border-width-button ) solid var( --snycf-accent );
	background-color: var( --snycf-accent );
	color: var( --snycf-paper );
	font-family: var( --snycf-font-ui ), 'Archivo Fallback';
	font-size: 0.75rem;
	font-weight: var( --snycf-weight-extrabold );
	letter-spacing: 0.12em;
	text-transform: uppercase;
	cursor: pointer;
}

.snycf-record-search__submit:hover,
.snycf-record-search__submit:focus-visible {
	background-color: var( --snycf-accent-deep );
	border-color: var( --snycf-accent-deep );
}

/*
 * Below 24rem the field and button cannot both hold their minimum widths on
 * one line, so the button takes the full width underneath rather than
 * squeezing the field to nothing.
 */
@media ( max-width: 24rem ) {

	.snycf-record-search__submit {
		flex: 1 0 100%;
	}
}

/* =====================================================================
 * Recent records strip
 * ================================================================== */

.snycf-records-recent__grid {
	display: grid;
	grid-template-columns: repeat( auto-fit, minmax( min( 17.5rem, 100% ), 1fr ) );
	gap: var( --snycf-space-lg );
	margin-top: var( --snycf-space-lg );
}

/* =====================================================================
 * Results list
 * ================================================================== */

.snycf-records-list__count {
	margin: 0;
	font-family: var( --snycf-font-ui ), 'Archivo Fallback';
	font-size: var( --snycf-size-meta );
	font-weight: var( --snycf-weight-bold );
	letter-spacing: var( --snycf-tracking-meta );
	text-transform: uppercase;
	color: var( --snycf-text-meta );
	white-space: nowrap;
}

.snycf-records-list__items {
	margin-top: var( --snycf-space-2xs );
	border-top: var( --snycf-divider );
}

.snycf-record-row__related-label {
	font-family: var( --snycf-font-ui ), 'Archivo Fallback';
	font-size: var( --snycf-size-kicker );
	font-weight: var( --snycf-weight-extrabold );
	letter-spacing: 0.12em;
	text-transform: uppercase;
}

.snycf-record-row__related-more {
	white-space: nowrap;
}

/* =====================================================================
 * Browse by type / borough
 * ================================================================== */

.snycf-records-browse__columns {
	display: grid;
	grid-template-columns: repeat( auto-fit, minmax( min( 20rem, 100% ), 1fr ) );
	gap: var( --snycf-space-xl ) var( --snycf-space-5xl );
}

.snycf-records-browse__list {
	list-style: none;
	margin: var( --snycf-space-2xs ) 0 0;
	padding: 0;
}

.snycf-records-browse__link {
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
	align-items: baseline;
	gap: var( --snycf-space-3xs ) var( --snycf-space-sm );
	min-height: var( --snycf-target-min );
	padding-block: var( --snycf-space-xs );
	border-bottom: var( --snycf-divider );
}

.snycf-records-browse__name {
	font-family: var( --snycf-font-ui ), 'Archivo Fallback';
	font-size: 0.78125rem;
	font-weight: var( --snycf-weight-extrabold );
	letter-spacing: 0.1em;
	text-transform: uppercase;

	/* The longest approved issue name is 60 characters. */
	min-width: 0;
	overflow-wrap: break-word;
}

.snycf-records-browse__count {
	flex: none;
	font-family: var( --snycf-font-ui ), 'Archivo Fallback';
	font-size: var( --snycf-size-kicker );
	font-weight: var( --snycf-weight-bold );
	letter-spacing: 0.1em;
	text-transform: uppercase;
	color: var( --snycf-text-meta );
	white-space: nowrap;
}

.snycf-records-browse__count::after {
	content: ' \2192';
}

.snycf-records-browse__link.is-current .snycf-records-browse__name {
	color: var( --snycf-accent );
}

/* =====================================================================
 * Standing note
 * ================================================================== */

.snycf-records-about {
	margin-top: var( --snycf-space-3xl );
	padding: var( --snycf-space-md ) var( --snycf-space-lg );
	background-color: var( --snycf-surface-alt );
	border-inline-start: var( --snycf-border-width-rule ) solid var( --snycf-accent );
}

.snycf-records-about p {
	margin: var( --snycf-space-2xs ) 0 0;
	max-width: 68ch;
	font-family: var( --snycf-font-editorial ), 'Source Serif Fallback';
	font-size: var( --snycf-size-prose-sm );
	line-height: var( --snycf-leading-deck );
	color: var( --snycf-text-prose );
}

.snycf-records-about .snycf-section-heading {
	border-top: 0;
	padding-top: 0;
}