/**
 * Manufacturers
 */

.theme--manufacturers {
	--gap:       40px;
	--gap-small: calc( var(--gap) / 2 );

	display: grid;
	grid: auto-flow / 1fr;
	grid-template-areas:
		"filters"
		"alpha-nav"
		"main"
	;
	gap: var(--gap);
}

@media (min-width: 480px) {
	.theme--manufacturers {
		grid-template-columns: 1fr min-content;
		grid-template-areas:
			"filters  filters"
			"main     alpha-nav"
		;
	}
}



/*! - Filters */

.theme--manufacturers--filters {
	grid-area: filters;
	display: flex;
	justify-content: space-between;
	align-items: center;
	flex-wrap: wrap;
	gap: var(--gap-small) var(--gap);
	font-size: var(--theme--field--font-size);
}

.theme--manufacturers--filters > * {
	flex: 100%;
	text-align: center;
}

.theme--manufacturers-filter--field {}


/*! Filter: Region / State */

.theme--manufacturers-filter--region label {
	margin-right: 1em;
}

.theme--manufacturers-filter--region select {}


/*! Filter: Print Button */

.theme--manufacturers-filter--print .et_pb_button.et_pb_button::after {
	content:     "\f02f";  /* FA printer */
	font-family: "FontAwesome" !important;
	font-size: 0.8em;
}


/*! Filter: Search */

.theme--manufacturers-filter--search input {}


@media (min-width: 480px) {
	.theme--manufacturers--filters > * {
		flex: 0 auto;
		text-align: left;
	}
}


@media (min-width: 981px) {
	.theme--manufacturers-filter--region,
	.theme--manufacturers-filter--print {
		order: -1;
	}

	.theme--manufacturers-filter--print {
		flex-grow: 1;
	}
}


/*! - Alphabet Nav */

.theme--manufacturers--alpha-nav {
	grid-area: alpha-nav;
	text-align: center;
}

.theme--alpha-nav {
	display: inline-flex;
	flex-wrap: wrap;
	gap: 7px;
	transition: top 0.1s ease;
}

.theme--alpha-nav--button {
	display: flex;
	justify-content: center;
	align-items: center;
	width:  2.25em;
	height: 2.25em;
	font-size: 14px;
	line-height: normal;
	text-transform: uppercase;
	color:      var(--theme--dark-green);
	background: hsl( var(--theme--dark-green--hsl) / 25% );
	border: none;
	border-radius: var(--theme--container--border-radius);
	transition: var(--theme--button--transition);
}
.theme--alpha-nav--button:disabled {
	opacity: 0.25;
}
.theme--alpha-nav--button:not(:disabled):hover,
.theme--alpha-nav--button:not(:disabled):focus {
	color:      #fff;
	background: var(--theme--dark-green);
}

@media (min-width: 480px) {
	.theme--alpha-nav {
		position: sticky;
		top: var(--gap-small);
		max-height: calc( 100vh - calc( 2 * var(--gap-small) ) );
		overflow: hidden auto;
		scrollbar-width: none;
	}
}

@media (min-width: 981px) {
	.et_fixed_nav .theme--alpha-nav {
		--top-offset: var(--theme--header--offset );

		top: calc( var(--top-offset) + var(--gap-small) );
		max-height: calc( 100vh - var(--top-offset) - calc( 2 * var(--gap-small) ) );
	}
}



/*! - Main */

.theme--manufacturers--main {
	grid-area: main;
}



/*! - Messages */

.theme--manufacturers--messages {
	grid-column: span 3;
}



/*! - List */
.theme--manufacturers--list {
	display: grid;
	grid: auto-flow / 1fr;
	gap: var(--gap);
	width: 100%;
}

@media (min-width: 480px) {
	.theme--manufacturers--list {
		grid-template-columns: repeat( 2, minmax( 0, 1fr ) );
		gap: var(--gap-small);
	}
}

@media (min-width: 768px) {
	.theme--manufacturers--list {
		gap: var(--gap);
	}
}

@media (min-width: 981px) {
	.theme--manufacturers--list {
		grid-template-columns: repeat( 3, minmax( 0, 1fr ) );
	}
}

@media (min-width: 1440px) {
	.theme--manufacturers--list {
		grid-template-columns: repeat( 4, minmax( 0, 1fr ) );
	}
}



/*! - Card */

.theme--manufacturer-card {
	--pad:       30px;
	--pad-small: calc( var(--pad) / 2 );

	display: flex;
	flex-direction: column;
	position: relative;
	padding: var(--pad);
	color: var(--theme--dark-green);
	text-align: center;
	box-shadow: var(--theme--box-shadow--glow);
	border-radius: var(--theme--container--border-radius);
}

.theme--manufacturer-card .theme--card--full-link {
	position: absolute;
	top:    0;
	left:   0;
	right:  0;
	bottom: 0;
}

.theme--manufacturer-card .theme--card--header {
	margin: 0 0 var(--pad-small);
}

.theme--manufacturer-card .theme--card--body {
	margin: var(--pad-small) 0;
}

.theme--manufacturer-card .theme--card--footer {
	margin: var(--pad-small) 0 0;
}

.theme--manufacturer-card .theme--card--title {
	display: inline-block;
	padding-bottom: 0;
	border-bottom: 2px solid var(--theme--secondary-accent-color);
}

.theme--manufacturer-card .theme--card--image {
	display: block;
	aspect-ratio: 2 / 1;
	object-fit: contain;
}

.theme--manufacturer-card .theme--card--content {
	line-height: 1.4;
}