/* --------------------------------------------------------------------------
   DOWNLOADS
   Archive layout, filter rail, and single-Download page.
   The .nm-download-card component itself lives in archives.css (shared with the
   Project card aesthetic) and is intentionally not restyled here.
   -------------------------------------------------------------------------- */

.nm-download-archive-main,
.nm-download-single-main {
	padding: 0;
	margin-block-start: 0;
}

.nm-download-archive-layout {
	display: grid;
	grid-template-columns: 264px minmax(0, 1fr);
	gap: clamp(1.75rem, 3vw, 3rem);
	align-items: start;
	max-width: var(--wp--style--global--wide-size, 1280px);
	margin-inline: auto;
	padding-block: var(--wp--preset--spacing--60);
	padding-inline: var(--nm-page-gutter);
	box-sizing: border-box;
}

/* The block editor adds .is-layout-flex from the pattern's flex layout; force grid
   so the filters block and results column stay properly sized. */
.nm-download-archive-layout.is-layout-flex {
	display: grid !important;
	grid-template-columns: 264px minmax(0, 1fr);
}

.nm-download-archive-main .wp-block-post-template {
	padding-inline: 0;
}

.nm-download-archive-results {
	min-width: 0;
}

/* Grid cells stretch so every card matches the tallest in its row. */
.nm-download-card-block {
	display: flex;
	height: 100%;
}

.nm-download-card-block > .nm-download-card {
	flex: 1;
}

/* --------------------------------------------------------------------------
   FILTER RAIL — chip rail matching the Project archive.
   -------------------------------------------------------------------------- */

.nm-download-filter-rail {
	position: sticky;
	top: calc(var(--nm-header-height, 64px) + var(--wp--preset--spacing--40));
	max-height: calc(100dvh - var(--nm-header-height, 64px) - var(--wp--preset--spacing--60));
	overflow-y: auto;
	padding-right: var(--wp--preset--spacing--20);
}

.nm-download-filter-mobile,
.nm-download-filter-noscript {
	display: none;
}

.nm-download-filter-form {
	display: flex;
	flex-direction: column;
	gap: 0;
}

.nm-download-filter-form__header {
	display: flex;
	justify-content: space-between;
	align-items: center;
	gap: var(--wp--preset--spacing--30);
	margin-bottom: var(--wp--preset--spacing--40);
}

.nm-download-filter-form__header > span {
	font-family: var(--wp--preset--font-family--mono);
	font-size: var(--wp--preset--font-size--technical-xs);
	text-transform: uppercase;
	letter-spacing: 0.1em;
	color: var(--wp--preset--color--deep-teal);
}

.nm-download-filter-form__header a {
	font-size: var(--wp--preset--font-size--small);
	font-weight: 600;
	color: var(--wp--preset--color--signal-red);
	text-decoration: none;
}

.nm-download-filter-group {
	border: 0;
	border-block-start: 1px solid var(--wp--preset--color--default-border);
	padding: var(--wp--preset--spacing--40) 0;
	margin: 0;
}

.nm-download-filter-group__legend {
	float: left;
	width: 100%;
	font-family: var(--wp--preset--font-family--mono);
	font-size: var(--wp--preset--font-size--technical-xs);
	color: var(--wp--preset--color--muted-text);
	text-transform: uppercase;
	letter-spacing: 0.08em;
	margin-bottom: var(--wp--preset--spacing--30);
	padding: 0;
}

.nm-download-filter-group__options {
	display: flex;
	flex-wrap: wrap;
	gap: var(--wp--preset--spacing--20);
	clear: both;
}

.nm-download-filter-option {
	display: flex;
	align-items: center;
}

.nm-download-filter-option__input {
	position: absolute;
	width: 1px;
	height: 1px;
	padding: 0;
	margin: -1px;
	overflow: hidden;
	clip: rect(0, 0, 0, 0);
	white-space: nowrap;
	border-width: 0;
}

.nm-download-filter-option__input:focus-visible + .nm-download-filter-option__label {
	outline: 2px solid var(--wp--preset--color--workshop-teal);
	outline-offset: 2px;
}

/* Immediate active feedback on click — the server only adds .nm-filter-chip--active
   after the form is submitted, so :checked mirrors that active chip look meanwhile. */
.nm-download-filter-option__input:checked + .nm-download-filter-option__label {
	border-color: var(--wp--preset--color--deep-teal);
	background: var(--wp--preset--color--deep-teal);
	color: var(--wp--preset--color--studio-white);
}

.nm-download-filter-form .nm-button {
	width: 100%;
	margin-top: var(--wp--preset--spacing--30);
}

/* --------------------------------------------------------------------------
   SINGLE DOWNLOAD
   -------------------------------------------------------------------------- */

.nm-download-single-grid {
	max-width: var(--wp--style--global--wide-size, 1280px);
	margin: 0 auto;
	display: grid;
	grid-template-columns: minmax(0, 1fr) 360px;
	gap: var(--wp--preset--spacing--60);
	align-items: start;
	padding-inline: var(--nm-page-gutter);
	box-sizing: border-box;
}

.nm-download-panel-block {
	position: sticky;
	top: calc(var(--nm-header-height, 64px) + var(--wp--preset--spacing--40));
}

.nm-download-panel {
	display: grid;
	gap: 1rem;
	padding: 1.25rem;
	border: 2px solid var(--wp--preset--color--contrast);
	background: var(--wp--preset--color--base);
}

.nm-download-panel__action,
.nm-button {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-height: 44px;
	padding: 0.8rem 1rem;
	background: var(--wp--preset--color--contrast);
	color: var(--wp--preset--color--base);
	text-decoration: none;
	border: 0;
}

.nm-download-panel__meta div,
.nm-inline-meta div {
	display: flex;
	justify-content: space-between;
	gap: 1rem;
	border-top: 1px solid color-mix(in srgb, currentColor 20%, transparent);
	padding: 0.55rem 0;
}

.nm-download-panel__meta dt,
.nm-inline-meta dt {
	font-weight: 700;
}

.nm-download-preview {
	margin: 2rem 0 0;
}

.nm-download-preview__image {
	width: 100%;
	aspect-ratio: 16 / 9;
	object-fit: cover;
}

.nm-related-downloads__grid {
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: 1rem;
}

/* --------------------------------------------------------------------------
   RESPONSIVE
   -------------------------------------------------------------------------- */

@media (max-width: 960px) {
	.nm-download-archive-layout,
	.nm-download-archive-layout.is-layout-flex {
		grid-template-columns: minmax(0, 1fr);
	}

	.nm-download-filter-rail {
		display: none;
	}

	/* No-JS fallback: the <details> disclosure. Hidden once JS marks the page. */
	.nm-download-filter-noscript {
		display: block;
		margin-bottom: 1rem;
	}

	.nm-filters-js .nm-download-filter-noscript {
		display: none;
	}

	/* JS dialog trigger: shown only when the Interactivity store is active. */
	.nm-download-filter-mobile {
		display: block;
		margin-bottom: 1rem;
	}

	.nm-download-filter-trigger {
		display: none;
		align-items: center;
		gap: var(--wp--preset--spacing--20);
		min-height: 42px;
		padding: 0 var(--wp--preset--spacing--40);
		border: 1px solid var(--wp--preset--color--default-border);
		border-radius: 6px;
		background: var(--wp--preset--color--white-surface);
		color: var(--wp--preset--color--deep-teal);
		font-family: var(--wp--preset--font-family--mono);
		font-size: var(--wp--preset--font-size--technical-xs);
		text-transform: uppercase;
		letter-spacing: 0.08em;
		cursor: pointer;
	}

	.nm-filters-js .nm-download-filter-trigger {
		display: inline-flex;
	}

	.nm-download-filter-trigger span {
		display: inline-flex;
		align-items: center;
		justify-content: center;
		min-width: 1.25rem;
		height: 1.25rem;
		padding: 0 0.25rem;
		border-radius: 100px;
		background: var(--wp--preset--color--signal-red);
		color: var(--wp--preset--color--studio-white);
	}

	.nm-download-filter-dialog {
		width: min(100%, 42rem);
		max-height: 85dvh;
		margin: auto auto 0;
		padding: 0;
	}

	.nm-download-filter-dialog__inner {
		padding: 1rem;
		max-height: 85dvh;
		overflow: auto;
	}

	.nm-download-filter-dialog__header {
		display: flex;
		justify-content: space-between;
	}

	.nm-download-single-grid {
		grid-template-columns: 1fr;
	}

	.nm-download-panel-block {
		position: static;
	}

	.nm-related-downloads__grid {
		grid-template-columns: 1fr 1fr;
	}
}

@media (max-width: 560px) {
	.nm-download-archive-results,
	.nm-download-card,
	.nm-download-card-block {
		width: auto !important;
		max-width: 100% !important;
		min-width: 0;
		box-sizing: border-box;
	}

	.nm-download-archive-main .wp-block-post-template,
	.nm-related-downloads__grid {
		grid-template-columns: 1fr !important;
	}

	.nm-download-card__title {
		overflow-wrap: anywhere;
	}
}