/*
 * Diditon Catalogue public styles. Scoped to .dc-catalogue so nothing leaks
 * into the theme. Colours, spacing and type sizes are custom properties,
 * which display presets (Stage 9c) will set.
 */
.dc-catalogue {
	--dc-gap: 1.25rem;
	--dc-muted: #666;
	--dc-line: rgba(0, 0, 0, 0.12);
	--dc-thumb: 72px;
	--dc-accent: currentColor;
	box-sizing: border-box;
}
.dc-catalogue *,
.dc-catalogue *::before,
.dc-catalogue *::after { box-sizing: inherit; }

/* Preset styles: font, colours, sizes (only where a preset sets them). */
.dc-catalogue.dc-has-font,
.dc-has-font .dc-catalogue { font-family: var(--dc-font); }
.dc-catalogue { color: var(--dc-text, inherit); background: var(--dc-bg, transparent); }
.dc-item-title { font-size: var(--dc-title-size, inherit); color: inherit; }
.dc-work-details { font-size: var(--dc-text-size, inherit); }

/* Single work: heading, images, navigation under the images, then the
   details (beside the images on wide screens). */
.dc-work {
	display: grid; gap: var(--dc-gap); grid-template-columns: minmax(0, 1fr);
	grid-template-areas: "head" "media" "nav" "body";
}
.dc-work-head { grid-area: head; }
.dc-work-media { grid-area: media; }
.dc-work-nav { grid-area: nav; align-self: start; }
.dc-work-body { grid-area: body; min-width: 0; }
/* "Fit the main image to the screen" (preset): at most N% of the screen height. */
.dc-fit-screen .dc-work-main-img { max-height: var(--dc-main-max, none); width: auto; }
.dc-work-head { margin: 0; }
.dc-work-title { margin: 0 0 0.25em; }
.dc-work-catno { margin: 0; color: var(--dc-muted); }
.dc-work-media { min-width: 0; }
.dc-work-main { margin: 0; }
.dc-work-main-link { display: block; line-height: 0; }
.dc-work-main-img { display: block; max-width: 100%; height: auto; margin: 0 auto; }
.dc-work-caption { margin-top: 0.5em; color: var(--dc-muted); font-size: 0.9em; }
.dc-work-caption[hidden] { display: none; }
.dc-work-thumbs { display: flex; flex-wrap: wrap; gap: 0.5rem; margin-top: 0.75rem; align-items: center; }
.dc-work-thumb {
	padding: 0; border: 2px solid transparent; background: none; cursor: pointer;
	width: var(--dc-thumb); height: var(--dc-thumb); line-height: 0; border-radius: 2px;
}
.dc-work-thumb img { width: 100%; height: 100%; object-fit: cover; }
.dc-work-thumb.is-current { border-color: var(--dc-accent); }
.dc-work-thumb:focus-visible { outline: 2px solid var(--dc-accent); outline-offset: 2px; }
.dc-work-details { margin: 0; display: grid; grid-template-columns: max-content 1fr; gap: 0.35em 1.25em; }
.dc-work-detail { display: contents; }
.dc-work-details dt { font-weight: 600; }
.dc-work-details dd { margin: 0; }
.dc-work-text h2,
.dc-work-provenance h2,
.dc-work-exhibitions h2,
.dc-work-literature h2,
.dc-work-links h2 { font-size: 1.15em; margin: 1.25em 0 0.5em; }
.dc-work-body ul { margin: 0 0 0 1.2em; padding: 0; }
.dc-work-nav {
	display: grid; grid-template-columns: 1fr auto 1fr; gap: 1rem; align-items: center;
	border-top: 1px solid var(--dc-line); padding-top: 0.75rem;
}
.dc-nav-next { text-align: right; }
.dc-nav-mid { display: inline-flex; align-items: center; gap: 1.25em; }
.dc-nav-pos { color: var(--dc-muted); font-size: 0.9em; }
.dc-nav-list { display: inline-flex; color: inherit; opacity: 0.75; line-height: 0; }
.dc-nav-list:hover,
.dc-nav-list:focus-visible { opacity: 1; }
.dc-note { padding: 0.75em 1em; border-left: 4px solid #dba617; background: #fcf9e8; }

@media (min-width: 900px) {
	.dc-work {
		grid-template-columns: minmax(0, 3fr) minmax(0, 2fr); column-gap: calc(var(--dc-gap) * 2);
		grid-template-areas: "head head" "media body" "nav body"; grid-template-rows: auto auto 1fr;
	}
}

/* Enlarge icon, at the end of the thumbnails. */
.dc-work-enlarge {
	margin-left: auto; padding: 6px; border: 0; background: none; cursor: pointer; color: inherit; line-height: 0; opacity: 0.75;
}
.dc-work-enlarge:hover,
.dc-work-enlarge:focus-visible { opacity: 1; }

/* Lists (works and groups). */
.dc-list-controls { display: flex; flex-wrap: wrap; justify-content: space-between; gap: 0.5rem 1.5rem; margin-bottom: var(--dc-gap); }
.dc-type-filter,
.dc-order-toggle { display: flex; flex-wrap: wrap; gap: 0.4rem; }
.dc-filter,
.dc-order {
	display: inline-block; padding: 0.3em 0.8em; border: 1px solid var(--dc-line); border-radius: 999px;
	text-decoration: none; color: inherit; font-size: 0.9em;
}
.dc-filter.is-current,
.dc-order.is-current { border-color: var(--dc-accent, currentColor); font-weight: 600; }
.dc-grid {
	list-style: none; margin: 0; padding: 0; display: grid; gap: var(--dc-gap);
	grid-template-columns: repeat(min(2, var(--dc-columns, 4)), minmax(0, 1fr));
}
@media (min-width: 700px) { .dc-grid { grid-template-columns: repeat(min(3, var(--dc-columns, 4)), minmax(0, 1fr)); } }
@media (min-width: 1000px) { .dc-grid { grid-template-columns: repeat(var(--dc-columns, 4), minmax(0, 1fr)); } }
.dc-item { margin: 0; border-radius: 3px; transition: box-shadow 0.4s; scroll-margin-top: var(--dc-scroll-offset, 0px); }
.dc-item.is-highlight { box-shadow: 0 0 0 4px rgba(219, 166, 23, 0.85); }
.dc-item-thumb { display: block; aspect-ratio: 1 / 1; overflow: hidden; background: var(--dc-image-bg, rgba(0, 0, 0, 0.04)); line-height: 0; }
.dc-item-thumb img { width: 100%; height: 100%; object-fit: contain; }
.dc-item-noimage { display: block; width: 100%; height: 100%; }
.dc-item-text { display: flex; flex-direction: column; gap: 0.1em; margin-top: 0.5em; font-size: var(--dc-text-size, 0.92em); }
.dc-item-title { font-weight: 600; text-decoration: none; }
.dc-item-catno,
.dc-item-date,
.dc-item-size,
.dc-item-materials,
.dc-item-type,
.dc-item-where,
.dc-item-count { color: var(--dc-muted); }
.dc-pager { display: flex; flex-wrap: wrap; gap: 0.35rem; justify-content: center; margin-top: calc(var(--dc-gap) * 1.5); }
.dc-pager a,
.dc-pager span { padding: 0.3em 0.65em; text-decoration: none; }
.dc-page.is-current { font-weight: 700; border-bottom: 2px solid currentColor; }
/* One pager for wide screens, a short one ("‹ Prev 1 … 7 … 44 Next ›") for phones. */
.dc-pager-compact { display: none; }
.dc-list-foot { display: flex; align-items: center; gap: 0.75rem; margin-top: calc(var(--dc-gap) * 1.5); }
.dc-list-foot .dc-pager { margin-top: 0; flex: 1; }
.dc-list-back { display: inline-flex; flex: none; color: inherit; opacity: 0.75; line-height: 0; padding: 0.3em; }
.dc-list-back:hover,
.dc-list-back:focus-visible { opacity: 1; }
@media (max-width: 600px) {
	.dc-pager-full { display: none; }
	.dc-pager-compact { display: flex; flex-wrap: nowrap; gap: 0.15rem; }
	.dc-pager-compact a,
	.dc-pager-compact span { padding: 0.3em 0.45em; }
}
.dc-empty { color: var(--dc-muted); }
.dc-catalogue .screen-reader-text { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); }

/* Group page. */
.dc-group-title { margin: 0 0 0.25em; }
.dc-group-where { margin: 0 0 var(--dc-gap); color: var(--dc-muted); }
.dc-group-text { margin-bottom: var(--dc-gap); }

/* Lightboxes (PhotoSwipe). Works: dark. Image viewer: light. */
.pswp.dc-pswp-images { --pswp-bg: #fff; --pswp-icon-color: #222; --pswp-icon-color-secondary: #fff; --pswp-icon-stroke-color: #fff; }
.dc-pswp-caption {
	position: absolute; left: 0; right: 0; bottom: 0; padding: 14px 64px 18px; text-align: center;
	display: flex; flex-wrap: wrap; justify-content: center; align-items: baseline; gap: 0.35em 1em;
	color: #eee; background: linear-gradient(transparent, rgba(0, 0, 0, 0.65)); font-size: 15px; line-height: 1.4;
}
.dc-pswp-images .dc-pswp-caption { color: #222; background: rgba(255, 255, 255, 0.9); }
.dc-pswp-catno { opacity: 0.8; }
.dc-pswp-title { font-weight: 600; }
.dc-pswp-details { color: inherit; text-decoration: underline; }
.dc-pswp-badge {
	font: inherit; font-size: 13px; color: inherit; background: rgba(255, 255, 255, 0.15);
	border: 1px solid rgba(255, 255, 255, 0.5); border-radius: 999px; padding: 0.15em 0.75em; cursor: pointer;
}
.dc-pswp-imgcaption { flex-basis: 100%; font-size: 14px; }
.dc-pswp-empty { display: flex; height: 100%; align-items: center; justify-content: center; color: #bbb; }

/* ---- Layouts (display presets). ---- */

/* Thumbnail shapes (grid, list, slideshow). */
.dc-shape-landscape .dc-item-thumb { aspect-ratio: 4 / 3; }
.dc-shape-portrait .dc-item-thumb { aspect-ratio: 3 / 4; }
.dc-shape-natural .dc-item-thumb { aspect-ratio: auto; }
.dc-shape-natural .dc-item-thumb img { height: auto; }

/* Masonry: rows of images at their own shape, in reading order (left to
   right), each row filling the width; the last row is not stretched. */
.dc-layout-masonry .dc-grid { display: flex; flex-wrap: wrap; }
.dc-layout-masonry .dc-grid::after { content: ""; flex: 1000 1 0; }
.dc-layout-masonry .dc-item { flex: var(--r, 1) 1 calc(var(--r, 1) * var(--dc-row-h, 220px)); min-width: 0; }
.dc-layout-masonry .dc-item-thumb { aspect-ratio: var(--r, 1); }
.dc-layout-masonry .dc-item-thumb img { object-fit: cover; }

/* List: the image beside the details, one work per row. */
.dc-layout-list .dc-grid { grid-template-columns: minmax(0, 1fr); }
.dc-layout-list .dc-item { display: grid; grid-template-columns: min(240px, 38%) minmax(0, 1fr); gap: var(--dc-gap); align-items: start; }
.dc-layout-list .dc-item-text { margin-top: 0; font-size: var(--dc-text-size, 1em); }

/* Single column: large images, one under another. */
.dc-layout-column .dc-grid { grid-template-columns: minmax(0, 1fr); max-width: 960px; margin: 0 auto; }
.dc-layout-column .dc-item-thumb { aspect-ratio: auto; }
.dc-layout-column .dc-item-thumb img { height: auto; max-height: 85vh; object-fit: contain; }
.dc-layout-column .dc-item-text { text-align: center; align-items: center; }

/* Slideshow: one row that scrolls sideways (swipe, or the arrows). */
.dc-slides { position: relative; }
.dc-layout-slideshow .dc-track {
	grid-template-columns: none; grid-auto-flow: column; overflow-x: auto; scroll-snap-type: x mandatory;
	grid-auto-columns: 80%; scrollbar-width: thin; padding-bottom: 0.5rem;
}
@media (min-width: 700px) {
	.dc-layout-slideshow .dc-track { grid-auto-columns: calc((100% - (var(--dc-columns, 4) - 1) * var(--dc-gap)) / var(--dc-columns, 4)); }
}
.dc-layout-slideshow .dc-item { scroll-snap-align: start; }
.dc-slide-prev,
.dc-slide-next {
	position: absolute; top: 35%; z-index: 2; width: 2.5rem; height: 2.5rem; border: 0; border-radius: 50%;
	background: rgba(255, 255, 255, 0.85); color: #222; font-size: 1.6rem; line-height: 1; cursor: pointer;
	box-shadow: 0 1px 4px rgba(0, 0, 0, 0.25);
}
.dc-slide-prev { left: 0.5rem; }
.dc-slide-next { right: 0.5rem; }

/* Caption over the image. */
.dc-caption-overlay .dc-item { position: relative; }
.dc-caption-overlay .dc-item-text {
	position: absolute; left: 0; right: 0; bottom: 0; margin: 0; padding: 1.5em 0.75em 0.5em;
	background: linear-gradient(transparent, rgba(0, 0, 0, 0.72)); color: #fff; pointer-events: none;
}
.dc-caption-overlay .dc-item-text a { pointer-events: auto; color: #fff; }
.dc-caption-overlay .dc-item-text span { color: rgba(255, 255, 255, 0.85); }
.dc-layout-list.dc-caption-overlay .dc-item-text { position: static; background: none; color: inherit; padding: 0; }
.dc-layout-list.dc-caption-overlay .dc-item-text a,
.dc-layout-list.dc-caption-overlay .dc-item-text span { color: inherit; }

/* ---- Preview (researchers and admins). ---- */
.dc-status-badge,
.dc-level-badge {
	display: inline-block; margin-left: 0.4em; padding: 0.05em 0.55em; border-radius: 999px;
	font-size: 0.75em; font-weight: 600; vertical-align: middle; background: #f0f0f1; color: #50575e;
}
.dc-status-pending,
.dc-level-draft { background: #fcf9e8; color: #8a6d00; }
.dc-status-internal,
.dc-level-admin { background: #fcf0f1; color: #8a2424; }
.dc-level-researcher { background: #f0f6fc; color: #135e96; }
.dc-level-current { background: #edfaef; color: #00701a; }
.dc-item-text .dc-status-badge { margin-left: 0; align-self: flex-start; }

/* Work / Research tabs. */
.dc-work-tabs { display: flex; gap: 0.25rem; margin-top: 0.75rem; border-bottom: 1px solid var(--dc-line); }
.dc-work-tab {
	padding: 0.45em 1em; border: 1px solid transparent; border-bottom: 0; margin-bottom: -1px;
	text-decoration: none; color: inherit; border-radius: 3px 3px 0 0;
}
.dc-work-tab.is-current { border-color: var(--dc-line); background: var(--dc-bg, #fff); font-weight: 600; }

/* Research tab: the work in brief at the top left, the sections beside / below. */
.dc-research { grid-column: 1 / -1; display: grid; gap: var(--dc-gap); grid-template-columns: minmax(0, 1fr); }
.dc-research-summary { display: grid; grid-template-columns: 96px minmax(0, 1fr); gap: 0.75rem; align-items: start; padding: 0.75rem; border: 1px solid var(--dc-line); border-radius: 3px; }
.dc-research-summary img { width: 96px; height: 96px; object-fit: contain; background: var(--dc-image-bg, rgba(0, 0, 0, 0.04)); }
.dc-research-summary dl { margin: 0; display: grid; grid-template-columns: max-content 1fr; gap: 0.15em 0.9em; font-size: 0.9em; }
.dc-research-summary dl > div { display: contents; }
.dc-research-summary dt { font-weight: 600; }
.dc-research-summary dd { margin: 0; }
.dc-research-sections h2 { font-size: 1.15em; margin: 1.25em 0 0.5em; }
.dc-research-sections section:first-child h2 { margin-top: 0; }
.dc-research-list { margin: 0 0 0 1.2em; padding: 0; }
.dc-research-list > li { margin-bottom: 0.75em; }
.dc-research-meta,
.dc-research-copy,
.dc-research-none { color: var(--dc-muted); font-size: 0.92em; }
.dc-research-note { margin: 0.35em 0 0; }
.dc-research-text { margin: 0.5em 0 0.75em; }
.dc-research-text h3,
.dc-research-text h4 { font-size: 1em; margin: 0 0 0.25em; }
@media (min-width: 900px) {
	.dc-research { grid-template-columns: minmax(260px, 1fr) minmax(0, 2.4fr); grid-template-areas: "summary sections" "nav sections"; grid-template-rows: auto 1fr; }
	.dc-research-summary { grid-area: summary; }
	.dc-research .dc-work-nav { grid-area: nav; align-self: start; grid-template-columns: auto auto auto; }
	.dc-research-sections { grid-area: sections; }
}