/* A shared frontend/editor contract for the certification-category directory. */
.dc-certification-directory {
	min-inline-size: 0;
	max-inline-size: 100%;
}

.dc-certification-directory + .wp-block-buttons {
	margin-block-start: var(--space-8, 2rem);
}

.dc-certification-directory .dc-certification-directory__intro {
	max-inline-size: 48rem;
	margin: 0 0 var(--space-8, 2rem);
	color: var(--color-text-muted, #62736a);
	font-size: var(--type-body-lg, 1.125rem);
	line-height: 1.65;
	overflow-wrap: break-word;
}

.dc-certification-directory .dc-certification-directory__list {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: var(--space-6, 1.5rem);
	margin: 0;
	padding: 0;
	list-style: none;
}

/* Optional descriptions and detail groups must not occupy fixed grid rows. */
.dc-certification-directory .dc-certification-directory__item {
	display: flex;
	flex-direction: column;
	align-items: stretch;
	gap: var(--space-6, 1.5rem);
	min-inline-size: 0;
	margin: 0;
	padding: var(--space-panel, clamp(22px, 3vw, 32px));
	border: 1px solid var(--color-border, #d1dcd6);
	border-radius: var(--radius-panel, 10px);
	background: var(--color-surface, #fff);
	color: var(--color-ink, #17364c);
	text-align: start;
}

.dc-certification-directory .dc-certification-directory__header {
	display: flex;
	align-items: center;
	gap: var(--space-5, 1.25rem);
	min-inline-size: 0;
	min-block-size: 4rem;
}

.dc-certification-directory .dc-certification-directory__symbol {
	display: grid;
	place-items: center;
	flex: 0 0 4rem;
	inline-size: 4rem;
	block-size: 4rem;
	margin: 0;
	border: 1px solid var(--color-border-strong, #879a91);
	border-radius: var(--radius-icon, 10px);
	background: var(--color-success-bg, #e4f1ec);
	color: var(--color-primary, #08745d);
}

.dc-certification-directory .dc-certification-directory__symbol svg {
	display: block;
	inline-size: 2rem;
	block-size: 2rem;
}

.dc-certification-directory .dc-certification-directory__label {
	display: block;
	flex: 1 1 auto;
	min-inline-size: 0;
	max-inline-size: 100%;
	margin: 0;
	font-family: var(--font-body, sans-serif);
	font-size: var(--type-h3, 1.375rem);
	font-weight: 600;
	line-height: 1.4;
	overflow-wrap: break-word;
	hyphens: none;
}

.dc-certification-directory .dc-certification-directory__description {
	min-inline-size: 0;
	margin: 0;
	color: var(--color-text-muted, #62736a);
	font-size: var(--type-body, 1rem);
	line-height: 1.7;
	overflow-wrap: break-word;
}

.dc-certification-directory .dc-certification-directory__details {
	display: grid;
	align-content: start;
	gap: var(--space-5, 1.25rem);
	min-inline-size: 0;
	margin: 0;
	padding-block-start: var(--space-5, 1.25rem);
	border-block-start: 1px solid var(--color-border, #d1dcd6);
}

.dc-certification-directory .dc-certification-directory__detail {
	display: grid;
	gap: var(--space-2, .5rem);
	min-inline-size: 0;
}

.dc-certification-directory .dc-certification-directory__detail dt {
	margin: 0;
	color: var(--color-ink, #17364c);
	font-size: var(--type-label, .875rem);
	font-weight: 600;
	line-height: 1.5;
}

.dc-certification-directory .dc-certification-directory__detail dd {
	min-inline-size: 0;
	margin: 0;
	color: var(--color-text-muted, #62736a);
	font-size: var(--type-body, 1rem);
	line-height: 1.65;
	overflow-wrap: break-word;
}

.dc-certification-directory .dc-certification-directory__documents {
	margin: 0;
	padding: 0;
	padding-inline-start: 1.15em;
	list-style: disc;
}

.dc-certification-directory .dc-certification-directory__documents li {
	min-inline-size: 0;
	margin: 0;
	padding-inline-start: var(--space-1, .25rem);
	overflow-wrap: break-word;
}

.dc-certification-directory .dc-certification-directory__documents li + li {
	margin-block-start: var(--space-2, .5rem);
}

.dc-certification-directory .dc-certification-directory__footer {
	min-inline-size: 0;
	margin-block-start: auto;
	padding-block-start: var(--space-5, 1.25rem);
	border-block-start: 1px solid var(--color-border, #d1dcd6);
}

.dc-certification-directory .dc-certification-directory__request {
	inline-size: fit-content;
	max-inline-size: 100%;
	min-block-size: 44px;
	white-space: normal;
	overflow-wrap: break-word;
}

@media (max-width: 600px) {
	.dc-certification-directory .dc-certification-directory__list {
		grid-template-columns: minmax(0, 1fr);
		gap: var(--space-3, .75rem);
	}

	.dc-certification-directory .dc-certification-directory__item {
		padding: var(--space-5, 1.25rem);
	}

	.dc-certification-directory .dc-certification-directory__header {
		gap: var(--space-4, 1rem);
		min-block-size: 3.5rem;
	}

	.dc-certification-directory .dc-certification-directory__symbol {
		flex-basis: 3.5rem;
		inline-size: 3.5rem;
		block-size: 3.5rem;
	}
}