/* Photo Credits page (template-credits.php). */

.credits__intro { margin-bottom: 8px; }
.credits__extra { margin-top: 32px; }

.credits__group { margin-top: 48px; }
.credits__heading {
	font-size: 26px;
	line-height: 1.25;
	color: var(--jf-navy);
	padding-bottom: 12px;
	border-bottom: 1px solid var(--jf-line);
}

.credits__item {
	display: grid;
	grid-template-columns: 144px minmax(0, 1fr);
	gap: 20px;
	align-items: start;
	padding: 20px 0;
	border-bottom: 1px solid var(--jf-line);
}
.credits__thumb img {
	display: block;
	width: 100%;
	height: auto;
	aspect-ratio: 4 / 3;
	object-fit: cover;
	border-radius: 4px;
	background: var(--jf-sand);
}

.credits__title {
	font-size: 18px;
	line-height: 1.35;
	color: var(--jf-navy);
	margin-bottom: 8px;
}
.credits__meta { font-size: 15px; line-height: 1.55; color: var(--jf-ink-2); }
.credits__meta > div { display: flex; gap: 8px; }
.credits__meta > div + div { margin-top: 2px; }
.credits__meta dt { flex: 0 0 72px; color: var(--jf-muted); }
.credits__meta dd { margin: 0; min-width: 0; overflow-wrap: anywhere; }
.credits__meta a {
	color: var(--jf-red);
	text-decoration: underline;
	text-underline-offset: 3px;
	white-space: normal;
}
.credits__meta a:hover { color: var(--jf-navy); }

.credits__note { margin-top: 8px; font-size: 14px; line-height: 1.5; color: var(--jf-muted); }
.credits__note--warn {
	color: var(--jf-ink-2);
	background: var(--jf-sand);
	border-inline-start: 3px solid var(--jf-red);
	padding: 8px 12px;
}
.credits__note--warn strong { color: var(--jf-red); }

[dir="rtl"] .credits__heading,
[dir="rtl"] .credits__title { font-family: var(--jf-arabic); }

@media (max-width: 560px) {
	.credits__item { grid-template-columns: 96px minmax(0, 1fr); gap: 14px; }
	.credits__meta > div { display: block; }
	.credits__meta dt { display: inline; }
	.credits__meta dt::after { content: ":"; }
	.credits__meta dd { display: inline; }
}