/*
 * Memorial Testimonials — neutral defaults.
 * Selectors are wrapped in :where() so they carry no specificity:
 * any theme rule wins. The In Peace theme styles everything in full.
 */

:where(.mt-form, .mt-list) {
	--mt-line: color-mix(in srgb, currentColor 18%, transparent);
	--mt-muted: color-mix(in srgb, currentColor 62%, transparent);
	--mt-error: #9b2c2c;
}

/* Form */
:where(.mt-form) { display: grid; gap: 1.5rem; }
:where(.mt-field) { display: grid; gap: .4rem; margin: 0; padding: 0; border: 0; min-width: 0; }
:where(.mt-form input[type="text"], .mt-form input[type="email"], .mt-form input[type="url"], .mt-form textarea) {
	width: 100%; font: inherit; color: inherit; padding: .6rem .75rem;
	border: 1px solid var(--mt-line); border-radius: 2px; background: transparent;
}
:where(.mt-form [aria-invalid="true"]) { border-color: var(--mt-error); }
:where(.mt-choice label, .mt-consent label) { display: flex; gap: .6rem; align-items: baseline; }
:where(.mt-hint, .mt-optional) { color: var(--mt-muted); font-size: .875em; margin: 0; }

:where(.mt-drop) {
	position: relative; display: grid; gap: .25rem; place-items: center; text-align: center;
	padding: 2rem 1rem; border: 1px dashed var(--mt-line); border-radius: 2px; cursor: pointer;
}
:where(.mt-drop.is-over) { border-style: solid; border-color: currentColor; }
.mt-drop input[type="file"] { position: absolute; inset: 0; width: 100%; height: 100%; opacity: 0; cursor: pointer; }
.mt-drop:focus-within { outline: 1px solid currentColor; outline-offset: 3px; }

:where(.mt-files) { list-style: none; margin: 0; padding: 0; display: grid; gap: .5rem; }
:where(.mt-files:empty) { display: none; }
:where(.mt-file) {
	display: grid; grid-template-columns: 1fr auto; gap: .25rem 1rem; align-items: center;
	padding: .75rem 0; border-bottom: 1px solid var(--mt-line);
}
:where(.mt-file__name) { overflow-wrap: anywhere; }
:where(.mt-file__meta) { grid-column: 1; color: var(--mt-muted); font-size: .875em; }
:where(.mt-file__bar) { grid-column: 1 / -1; width: 100%; height: 2px; appearance: none; border: 0; background: var(--mt-line); }
.mt-file__bar::-webkit-progress-bar { background: var(--mt-line); }
.mt-file__bar::-webkit-progress-value { background: currentColor; }
.mt-file__bar::-moz-progress-bar { background: currentColor; }
:where(.mt-file__actions) { grid-column: 2; grid-row: 1 / span 2; display: flex; align-items: center; gap: .75rem; }
:where(.mt-file__move) { font: inherit; background: none; border: 0; padding: .1rem .25rem; color: inherit; cursor: pointer; opacity: .6; }
:where(.mt-file__move:hover, .mt-file__move:focus-visible) { opacity: 1; }
.mt-file:first-child .mt-file__move[data-dir="-1"],
.mt-file:last-child .mt-file__move[data-dir="1"] { visibility: hidden; }
:where(.mt-file__remove) { font: inherit; font-size: .875em; background: none; border: 0; padding: 0; color: inherit; text-decoration: underline; cursor: pointer; }

/* Honeypot: must stay invisible to people. */
.mt-hp { position: absolute !important; left: -10000px !important; width: 1px; height: 1px; overflow: hidden; }

:where(.mt-status:empty) { display: none; }
:where(.mt-status.is-error) { color: var(--mt-error); }
:where(.mt-submit) { justify-self: start; font: inherit; padding: .75rem 1.75rem; cursor: pointer; }
:where(.mt-form.is-sending .mt-submit) { opacity: .5; cursor: progress; }
:where(.mt-thanks) { padding: 2rem 0; font-style: italic; }

/* List */
:where(.mt-entry) { padding: 2.5rem 0; border-top: 1px solid var(--mt-line); }
:where(.mt-entry:first-child) { border-top: 0; padding-top: 0; }
:where(.mt-entry__type) { font-size: .75em; letter-spacing: .14em; text-transform: uppercase; color: var(--mt-muted); margin: 0 0 1rem; }
:where(.mt-entry__body > :first-child) { margin-top: 0; }
:where(.mt-entry__body > :last-child) { margin-bottom: 0; }
:where(.mt-entry__meta) { display: flex; flex-wrap: wrap; gap: .25rem 1rem; margin-top: 1.25rem; color: var(--mt-muted); font-size: .875em; }
:where(.mt-entry__name) { color: inherit; font-weight: 500; }
:where(.mt-entry__media) { display: grid; gap: 1rem; margin-top: 1.5rem; }
:where(.mt-gallery) { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .5rem; }
:where(.mt-gallery > :last-child:nth-child(odd)) { grid-column: 1 / -1; }
:where(.mt-gallery img, .mt-gallery video) { width: 100%; aspect-ratio: 1; object-fit: cover; display: block; }
:where(.mt-gallery > :last-child:nth-child(odd) img, .mt-gallery > :last-child:nth-child(odd) video) { aspect-ratio: 3 / 2; }
:where(.mt-gallery > :only-child img, .mt-gallery > :only-child video) { aspect-ratio: auto; height: auto; }

/* Video tiles: the first frame with a play button; they open in the lightbox. */
.mt-media--video { position: relative; display: block; cursor: pointer; background: #000; }
.mt-media--video video { pointer-events: none; }
.mt-play {
	position: absolute;
	left: 50%;
	top: 50%;
	width: 3.25rem;
	height: 3.25rem;
	margin: -1.625rem 0 0 -1.625rem;
	border-radius: 50%;
	background: rgba(17, 16, 14, .55);
	border: 1px solid rgba(255, 255, 255, .7);
	transition: background-color .2s, transform .2s;
}
.mt-play::before {
	content: "";
	position: absolute;
	left: 50%;
	top: 50%;
	margin: -.55rem 0 0 -.3rem;
	border-style: solid;
	border-width: .55rem 0 .55rem .9rem;
	border-color: transparent transparent transparent #fff;
}
.mt-media--video:hover .mt-play,
.mt-media--video:focus-visible .mt-play { background: rgba(17, 16, 14, .8); transform: scale(1.06); }
.mt-media--video .screen-reader-text { position: absolute !important; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
:where(.mt-media--audio, .mt-media--video) { width: 100%; display: block; }

/* Masonry: CSS columns without JavaScript, a grid (keeps reading order) with it. */
:where(.mt-list--masonry) { --mt-gap: 1.25rem; }
:where(.mt-list--masonry .mt-items) { columns: var(--mt-columns, 3) 16rem; column-gap: var(--mt-gap); }
:where(.mt-list--masonry .mt-entry, .mt-list--masonry .mt-entry:first-child) {
	break-inside: avoid;
	margin: 0 0 var(--mt-gap);
	padding: 1.5rem;
	border: 1px solid var(--mt-line);
}
.mt-list--masonry .mt-items.is-masonry {
	display: grid;
	columns: auto;
	/* At most --mt-columns columns, each at least 16rem wide. */
	grid-template-columns: repeat(auto-fill, minmax(max(16rem, calc((100% - (var(--mt-columns, 3) - 1) * var(--mt-gap)) / var(--mt-columns, 3))), 1fr));
	grid-auto-rows: 4px;
	column-gap: var(--mt-gap);
	row-gap: 0;
}
.mt-list--masonry .mt-items.is-masonry > .mt-entry { margin: 0; align-self: start; }

/* "Continue reading" */
.mt-entry.is-collapsed .mt-entry__body {
	max-height: calc(var(--mt-lines, 8) * 1lh);
	overflow: hidden;
	-webkit-mask-image: linear-gradient(to bottom, #000 60%, transparent);
	mask-image: linear-gradient(to bottom, #000 60%, transparent);
}
@supports not (height: 1lh) {
	.mt-entry.is-collapsed .mt-entry__body { max-height: calc(var(--mt-lines, 8) * 1.7em); }
}
:where(.mt-toggle) { margin-top: .75rem; font: inherit; background: none; border: 0; padding: 0; color: inherit; text-decoration: underline; cursor: pointer; }

:where(.mt-pagination) { margin-top: 2.5rem; display: flex; flex-wrap: wrap; gap: .5rem 1rem; justify-content: center; }

/* Lightbox */
.mt-lightbox-open { overflow: hidden; }
.mt-lightbox {
	width: 100vw;
	height: 100vh;
	height: 100dvh;
	max-width: none;
	max-height: none;
	margin: 0;
	padding: 0;
	border: 0;
	background: rgba(17, 16, 14, .96);
	color: #f2efe8;
}
.mt-lightbox[open] { display: grid; place-items: center; animation: mt-fade .25s ease-out; }
.mt-lightbox::backdrop { background: transparent; }
.mt-lightbox__figure {
	box-sizing: border-box;
	width: 100%;
	height: 100%;
	margin: 0;
	padding: 4rem 5rem 3rem;
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	gap: 1rem;
}
.mt-lightbox__img,
.mt-lightbox__video {
	display: block;
	width: auto;
	height: auto;
	max-width: calc(100vw - 10rem);
	max-height: calc(100vh - 9rem);
	max-height: calc(100dvh - 9rem);
	object-fit: contain;
	box-shadow: 0 1rem 3rem rgba(0, 0, 0, .35);
}
.mt-lightbox__caption {
	font-family: var(--ip-sans, system-ui, sans-serif);
	font-size: .7rem;
	letter-spacing: .16em;
	text-transform: uppercase;
	opacity: .7;
	text-align: center;
}
.mt-lightbox__count:not(:empty)::before { content: "· "; }
.mt-lightbox__button {
	position: absolute;
	width: 3rem;
	height: 3rem;
	padding: 0;
	border: 0;
	background: none;
	color: inherit;
	opacity: .7;
	cursor: pointer;
	transition: opacity .2s;
}
.mt-lightbox__button:hover,
.mt-lightbox__button:focus-visible { opacity: 1; }
.mt-lightbox__button:focus-visible { outline: 1px solid currentColor; outline-offset: -4px; }
.mt-lightbox__button[hidden] { display: none; }
/* Thin drawn icons: × and chevrons */
.mt-lightbox__button::before,
.mt-lightbox__button::after { content: ""; position: absolute; left: 50%; top: 50%; }
.mt-lightbox__close { top: 1rem; right: 1rem; }
.mt-lightbox__close::before,
.mt-lightbox__close::after { width: 1.4rem; height: 1px; background: currentColor; transform: translate(-50%, -50%) rotate(45deg); }
.mt-lightbox__close::after { transform: translate(-50%, -50%) rotate(-45deg); }
.mt-lightbox__prev,
.mt-lightbox__next { top: 50%; margin-top: -1.5rem; }
.mt-lightbox__prev { left: 1rem; }
.mt-lightbox__next { right: 1rem; }
.mt-lightbox__prev::before,
.mt-lightbox__next::before { width: .9rem; height: .9rem; border-left: 1px solid currentColor; border-bottom: 1px solid currentColor; }
.mt-lightbox__prev::before { transform: translate(-30%, -50%) rotate(45deg); }
.mt-lightbox__next::before { transform: translate(-70%, -50%) rotate(-135deg); }
.mt-lightbox__img[hidden],
.mt-lightbox__video[hidden] { display: none; }
.mt-lightbox__video { background: #000; }
.mt-media--image { cursor: zoom-in; }

@media (max-width: 600px) {
	.mt-lightbox__figure { padding: 3.75rem 1rem 2rem; }
	.mt-lightbox__img,
	.mt-lightbox__video { max-width: calc(100vw - 2rem); max-height: calc(100dvh - 10rem); }
	.mt-lightbox__prev,
	.mt-lightbox__next { top: auto; bottom: .5rem; margin-top: 0; }
}
@keyframes mt-fade { from { opacity: 0; } }
@media (prefers-reduced-motion: reduce) { .mt-lightbox[open] { animation: none; } }

/* Links to media hosted elsewhere */
:where(.mt-links) { display: grid; gap: .5rem; }
:where(.mt-add-link) { justify-self: start; font: inherit; font-size: .875em; color: inherit; background: none; border: 0; padding: 0; text-decoration: underline; cursor: pointer; }
.mt-add-link[hidden] { display: none; }
:where(.mt-links-list) { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; gap: .5rem 1.25rem; }
.mt-entry .screen-reader-text { position: absolute !important; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }