/*
Theme Name: AfroDiaspora Colloquium
Theme URI: https://afrodiasporacolloquium.com
Author: AfroDiaspora Colloquium
Author URI: https://afrodiasporacolloquium.com
Description: Block theme for the AfroDiaspora Colloquium (ADC), a public scholarship platform. Ink, paper and lime palette with Instrument Serif, Newsreader and IBM Plex Mono. Built for the Site Editor: every template, header, footer and homepage section is editable in the WordPress dashboard. Pair with the ADC Content plugin for Events, Programs and Partners.
Requires at least: 6.6
Tested up to: 6.8
Requires PHP: 7.4
Version: 1.0.1
License: GNU General Public License v2 or later
License URI: https://www.gnu.org/licenses/gpl-2.0.html
Text Domain: adc
Tags: block-patterns, full-site-editing, wide-blocks, editor-style, one-column, custom-colors, custom-logo, custom-menu
*/

/* ------------------------------------------------------------------
   Base
   ------------------------------------------------------------------ */

::selection { background: var(--wp--preset--color--lime); color: var(--wp--preset--color--ink); }

:where(a, button, input, select, textarea):focus-visible {
	outline: 2px solid var(--wp--preset--color--lime);
	outline-offset: 3px;
}

/* Italic highlighted words in headings keep the display face. */
:where(h1, h2, h3) em { font-style: italic; }

/* Header bar: thin rule under the navigation, as in the design. */
.adc-header { border-bottom: 1px solid var(--wp--preset--color--rule); }
.adc-header .wp-block-site-logo img { width: 44px; height: 44px; object-fit: contain; }

/* ------------------------------------------------------------------
   Rules and dividers (utility classes used by templates and patterns)
   ------------------------------------------------------------------ */

.adc-rule-top { border-top: 1px solid var(--wp--preset--color--rule); }
.adc-rule-bottom { border-bottom: 1px solid var(--wp--preset--color--rule); }
.adc-rule-top-strong { border-top: 2px solid currentColor; }

.wp-block-separator.is-style-lime {
	border: 0;
	height: 3px;
	background-color: var(--wp--preset--color--lime);
	color: var(--wp--preset--color--lime);
	opacity: 1;
	margin-top: 0;
	margin-bottom: 0;
	width: 100%;
	max-width: none;
}
.wp-block-separator.is-style-lime.alignfull { width: auto; }

/* ------------------------------------------------------------------
   Group styles
   ------------------------------------------------------------------ */

.wp-block-group.is-style-paper {
	background-color: var(--wp--preset--color--paper);
	color: var(--wp--preset--color--ink);
}
.wp-block-group.is-style-lime {
	background-color: var(--wp--preset--color--lime);
	color: var(--wp--preset--color--ink);
}
.is-style-paper a:where(:not(.wp-element-button)),
.is-style-lime a:where(:not(.wp-element-button)) { color: var(--wp--preset--color--ink); }
.is-style-paper a:where(:not(.wp-element-button)):hover,
.is-style-lime a:where(:not(.wp-element-button)):hover { color: var(--wp--preset--color--slate); }
.is-style-paper .wp-block-post-excerpt { color: var(--wp--preset--color--charcoal); }
.is-style-paper .wp-block-post-date { color: var(--wp--preset--color--slate); }
.is-style-paper .adc-rule-top,
.is-style-paper .adc-rule-bottom { border-color: var(--wp--preset--color--ink); }
.is-style-paper .wp-block-separator { color: var(--wp--preset--color--ink); }
.is-style-paper .wp-block-quote cite { color: var(--wp--preset--color--slate); }

.wp-block-group.is-style-card {
	border: 1px solid var(--wp--preset--color--rule);
	padding: clamp(1.5rem, 3vw, 2.25rem);
	height: 100%;
	box-sizing: border-box;
}
.is-style-paper .wp-block-group.is-style-card { border-color: var(--wp--preset--color--ink); }
.wp-block-group.is-style-card > .wp-block-buttons:last-child { margin-top: auto; }

/* Panel: a solid ink box, used for "Next in series" and highlights. */
.wp-block-group.is-style-panel {
	background-color: var(--wp--preset--color--ink);
	color: var(--wp--preset--color--paper);
	padding: clamp(1.5rem, 3vw, 2.5rem);
}
.wp-block-group.is-style-panel a:where(:not(.wp-element-button)) { color: var(--wp--preset--color--lime); }
.wp-block-group.is-style-panel .is-style-eyebrow { color: var(--wp--preset--color--lime); }
.wp-block-group.is-style-panel .is-style-meta { color: var(--wp--preset--color--mist); }

/* Outline box with a lime border, for callouts such as "ADC connection". */
.wp-block-group.is-style-callout {
	border: 2px solid var(--wp--preset--color--lime);
	padding: clamp(1.25rem, 3vw, 2rem);
}
.is-style-paper .wp-block-group.is-style-callout { border-color: var(--wp--preset--color--ink); }

/* ------------------------------------------------------------------
   Text styles
   ------------------------------------------------------------------ */

.is-style-eyebrow {
	font-family: var(--wp--preset--font-family--mono);
	font-size: var(--wp--preset--font-size--small);
	letter-spacing: 0.16em;
	text-transform: uppercase;
	line-height: 1.4;
	color: var(--wp--preset--color--lime);
}
.is-style-meta {
	font-family: var(--wp--preset--font-family--mono);
	font-size: 0.85rem;
	letter-spacing: 0.12em;
	text-transform: uppercase;
	line-height: 1.4;
	color: var(--wp--preset--color--mist);
}
.is-style-paper .is-style-eyebrow,
.is-style-lime .is-style-eyebrow { color: var(--wp--preset--color--ink); }
.is-style-paper .is-style-meta { color: var(--wp--preset--color--slate); }
.is-style-lime .is-style-meta { color: var(--wp--preset--color--ink); }
.is-style-lede { color: var(--wp--preset--color--smoke); max-width: 720px; }
.is-style-paper .is-style-lede { color: var(--wp--preset--color--charcoal); }

/* ------------------------------------------------------------------
   Button styles
   ------------------------------------------------------------------ */

.wp-block-button .wp-block-button__link { text-decoration: none; }

.wp-block-button.is-style-outline > .wp-block-button__link {
	background: transparent;
	color: var(--wp--preset--color--paper);
	border: 1px solid currentColor;
	padding: 15px 27px;
}
.wp-block-button.is-style-outline > .wp-block-button__link:hover {
	background: var(--wp--preset--color--paper);
	color: var(--wp--preset--color--ink);
	border-color: var(--wp--preset--color--paper);
}
.is-style-paper .wp-block-button.is-style-outline > .wp-block-button__link { color: var(--wp--preset--color--ink); }
.is-style-paper .wp-block-button.is-style-outline > .wp-block-button__link:hover {
	background: var(--wp--preset--color--ink);
	color: var(--wp--preset--color--paper);
	border-color: var(--wp--preset--color--ink);
}

.wp-block-button.is-style-ink > .wp-block-button__link {
	background: var(--wp--preset--color--ink);
	color: var(--wp--preset--color--lime);
}
.wp-block-button.is-style-ink > .wp-block-button__link:hover {
	background: var(--wp--preset--color--charcoal);
	color: var(--wp--preset--color--lime);
}

/* Text link styled like the design's "Recap on Instagram →" links. */
.wp-block-button.is-style-text-link > .wp-block-button__link {
	background: transparent;
	color: var(--wp--preset--color--lime);
	padding: 0;
	font-size: 0.85rem;
	text-decoration: underline;
	text-underline-offset: 0.2em;
}
.wp-block-button.is-style-text-link > .wp-block-button__link:hover {
	background: transparent;
	color: var(--wp--preset--color--paper);
}
.is-style-paper .wp-block-button.is-style-text-link > .wp-block-button__link,
.is-style-lime .wp-block-button.is-style-text-link > .wp-block-button__link { color: var(--wp--preset--color--ink); }
.is-style-paper .wp-block-button.is-style-text-link > .wp-block-button__link:hover { color: var(--wp--preset--color--slate); }

/* Series filter buttons on the Publications pages. */
.wp-block-button.is-style-filter > .wp-block-button__link {
	background: transparent;
	color: var(--wp--preset--color--ink);
	border: 1px solid var(--wp--preset--color--ink);
	min-height: 44px;
	padding: 12px 18px;
	font-size: var(--wp--preset--font-size--x-small);
	display: inline-flex;
	align-items: center;
}
.wp-block-button.is-style-filter > .wp-block-button__link:hover,
.blog .adc-filter-all > .wp-block-button__link,
.category-journal .adc-filter-journal > .wp-block-button__link,
.category-briefs .adc-filter-briefs > .wp-block-button__link,
.category-archive .adc-filter-archive > .wp-block-button__link,
.category-portraits .adc-filter-portraits > .wp-block-button__link,
.category-lexicon .adc-filter-lexicon > .wp-block-button__link,
.category-announcements .adc-filter-announcements > .wp-block-button__link {
	background: var(--wp--preset--color--ink);
	color: var(--wp--preset--color--lime);
}
.adc-filter {
	border-top: 2px solid var(--wp--preset--color--ink);
	border-bottom: 1px solid var(--wp--preset--color--ink);
	padding-top: 20px;
	padding-bottom: 20px;
}

/* ------------------------------------------------------------------
   Post terms (series label)
   ------------------------------------------------------------------ */

.wp-block-post-terms.is-style-chip,
.wp-block-post-terms.is-style-chip-ink {
	font-family: var(--wp--preset--font-family--mono);
	font-size: var(--wp--preset--font-size--x-small);
	letter-spacing: 0.12em;
	text-transform: uppercase;
	line-height: 1.3;
}
.wp-block-post-terms.is-style-chip a,
.wp-block-post-terms.is-style-chip-ink a {
	display: inline-block;
	padding: 4px 10px;
	text-decoration: none;
}
.wp-block-post-terms.is-style-chip a {
	background: var(--wp--preset--color--lime);
	color: var(--wp--preset--color--ink);
}
.wp-block-post-terms.is-style-chip-ink a {
	background: var(--wp--preset--color--ink);
	color: var(--wp--preset--color--lime);
	padding: 6px 12px;
}
.wp-block-post-terms.is-style-chip .wp-block-post-terms__separator,
.wp-block-post-terms.is-style-chip-ink .wp-block-post-terms__separator { display: inline-block; width: 6px; overflow: hidden; vertical-align: middle; color: transparent; }

/* ------------------------------------------------------------------
   Galleries
   ------------------------------------------------------------------ */

/* Tiles: the homepage gallery, cropped to 4:3. */
.wp-block-gallery.is-style-tiles.has-nested-images { gap: 12px; --wp--style--unstable-gallery-gap: 12px; }
.wp-block-gallery.is-style-tiles.has-nested-images figure.wp-block-image img {
	aspect-ratio: 4 / 3;
	object-fit: cover;
	height: auto;
}

/* Slides: a horizontal strip of 4:5 carousel slides on publication pages. */
.wp-block-gallery.is-style-slides.has-nested-images {
	display: flex;
	flex-wrap: nowrap;
	overflow-x: auto;
	gap: 16px;
	padding-bottom: 8px;
	scroll-snap-type: x mandatory;
	-webkit-overflow-scrolling: touch;
}
.wp-block-gallery.is-style-slides.has-nested-images figure.wp-block-image {
	flex: 0 0 min(280px, 75vw) !important;
	width: min(280px, 75vw) !important;
	scroll-snap-align: start;
	margin: 0;
}
.wp-block-gallery.is-style-slides.has-nested-images figure.wp-block-image img {
	aspect-ratio: 4 / 5;
	object-fit: cover;
	height: auto;
	border: 1px solid currentColor;
}

/* ------------------------------------------------------------------
   Lists of posts
   ------------------------------------------------------------------ */

/* Publication rows: one ruled row per post, as in the Publications design. */
.adc-rows .wp-block-post-template > li,
.adc-rows .wp-block-post-template > .wp-block-post {
	border-bottom: 1px solid currentColor;
	padding-top: clamp(1.5rem, 3vw, 2.25rem);
	padding-bottom: clamp(1.5rem, 3vw, 2.25rem);
	margin-top: 0;
}
.adc-rows .wp-block-post-template { gap: 0; }

/* Event and program card grids. */
.adc-cards .wp-block-post-template > li { display: flex; }
.adc-cards .wp-block-post-template.is-layout-grid {
	grid-template-columns: repeat(auto-fill, minmax(min(17.5rem, 100%), 1fr)) !important;
}
.adc-cards .wp-block-post-template > li > .wp-block-group { width: 100%; display: flex; flex-direction: column; }

/* Publications series list on the homepage. */
.adc-series {
	border-top: 2px solid currentColor;
	grid-template-columns: repeat(auto-fit, minmax(min(12.5rem, 100%), 1fr)) !important;
}
/* Grids that should stretch their items across the full width. */
.adc-autofit { grid-template-columns: repeat(auto-fit, minmax(min(16rem, 100%), 1fr)) !important; }
.adc-series > .wp-block-group {
	border-bottom: 1px solid currentColor;
	padding: 24px 20px 24px 0;
}

/* Dated list, e.g. "A life in six dates". */
.wp-block-list.is-style-dated { list-style: none; padding-left: 0; }
.wp-block-list.is-style-dated > li {
	border-bottom: 1px solid var(--wp--preset--color--rule);
	padding: 1rem 0;
	margin: 0;
}
.wp-block-list.is-style-dated > li strong:first-child {
	font-family: var(--wp--preset--font-family--mono);
	font-weight: 400;
	color: var(--wp--preset--color--lime);
	margin-right: 0.75em;
}
.is-style-paper .wp-block-list.is-style-dated > li { border-color: var(--wp--preset--color--ink); }
.is-style-paper .wp-block-list.is-style-dated > li strong:first-child { color: var(--wp--preset--color--ink); }

/* ------------------------------------------------------------------
   Navigation overlay (mobile menu)
   ------------------------------------------------------------------ */

.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__responsive-container-content {
	gap: 1.25rem;
	padding-top: 2rem;
}
.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation-item__content { font-size: 1rem; }

/* ------------------------------------------------------------------
   Small screens
   ------------------------------------------------------------------ */

@media (max-width: 600px) {
	.adc-series > .wp-block-group { padding-right: 0; }
	.wp-block-buttons { gap: 12px; }
}

/* Hide "Next in this series" label when there is no next post. */
.adc-next:not(:has(.post-navigation-link-next)) .adc-next-label { display: none; }
.adc-next .wp-block-post-navigation-link a { color: var(--wp--preset--color--paper); text-decoration: none; }
.adc-next .wp-block-post-navigation-link a:hover { color: var(--wp--preset--color--lime); }

/* Partner logos sit inside their frame rather than being cropped. */
.adc-logo img { object-fit: contain !important; background: var(--wp--preset--color--graphite); padding: 1.5rem; box-sizing: border-box; }

/* Header, main and footer sit flush against each other, as in the design. */
.wp-site-blocks > * + * { margin-block-start: 0; }