/* inkPad / Testimonial - class-driven + tokens */

.inkpad-scope .inkpad-testimonial,
.editor-styles-wrapper .inkpad-testimonial {
	--inkpad-testimonial-inner-pad: var(--inkpad-space-md);
	--inkpad-testimonial-quote-size: var(--inkpad-font-md);
	--inkpad-testimonial-quote-weight: var(--inkpad-weight-normal);
	--inkpad-testimonial-body-align: left;
	--inkpad-testimonial-avatar: calc(var(--inkpad-space-md) * 3);
	--inkpad-testimonial-surface-bg: transparent;
	--inkpad-testimonial-surface-border: none;
	--inkpad-testimonial-surface-shadow: none;
	--inkpad-testimonial-surface-blur: 0px;
	--inkpad-testimonial-radius: var(--inkpad-radius-md, var(--inkpad-radius));

	width: 100%;
	box-sizing: border-box;
	background: var(--inkpad-testimonial-surface-bg);
	border: var(--inkpad-testimonial-surface-border);
	border-radius: var(--inkpad-testimonial-radius);
	box-shadow: var(--inkpad-testimonial-surface-shadow);
	backdrop-filter: blur(var(--inkpad-testimonial-surface-blur));
	-webkit-backdrop-filter: blur(var(--inkpad-testimonial-surface-blur));
	transition:
		background var(--inkpad-transition-fast, var(--inkpad-transition-med)),
		border-color var(--inkpad-transition-fast, var(--inkpad-transition-med)),
		box-shadow var(--inkpad-transition-fast, var(--inkpad-transition-med)),
		transform var(--inkpad-transition-med, 220ms);
}

.inkpad-scope .inkpad-testimonial .inkpad-inner,
.editor-styles-wrapper .inkpad-testimonial .inkpad-inner {
	padding: var(--inkpad-testimonial-inner-pad);
	box-sizing: border-box;
}

.inkpad-scope .inkpad-testimonial__row,
.editor-styles-wrapper .inkpad-testimonial__row {
	display: flex;
	flex-direction: row;
	align-items: flex-start;
	justify-content: var(--inkpad-align-flex, flex-start);
	gap: var(--inkpad-space-sm);
	width: 100%;
	box-sizing: border-box;
}

.inkpad-scope .inkpad-testimonial img,
.editor-styles-wrapper .inkpad-testimonial img,
.inkpad-scope .inkpad-testimonial__avatar,
.editor-styles-wrapper .inkpad-testimonial__avatar {
	border-radius: 50%;
	width: var(--inkpad-testimonial-avatar);
	height: var(--inkpad-testimonial-avatar);
	object-fit: cover;
	flex: 0 0 auto;
}

.inkpad-scope .inkpad-testimonial__body,
.editor-styles-wrapper .inkpad-testimonial__body {
	min-width: 0;
	flex: 1 1 auto;
	text-align: var(--inkpad-testimonial-body-align);
}

.inkpad-scope .inkpad-testimonial__quote,
.editor-styles-wrapper .inkpad-testimonial__quote,
.inkpad-scope .inkpad-testimonial blockquote,
.editor-styles-wrapper .inkpad-testimonial blockquote {
	margin: 0;
	font-style: italic;
	font-size: var(--inkpad-testimonial-quote-size);
	font-weight: var(--inkpad-testimonial-quote-weight);
	color: var(--inkpad-text);
	line-height: var(--inkpad-line-height, var(--inkpad-line-height-relaxed));
}

.inkpad-scope .inkpad-testimonial__author,
.editor-styles-wrapper .inkpad-testimonial__author,
.inkpad-scope .inkpad-testimonial cite,
.editor-styles-wrapper .inkpad-testimonial cite {
	display: block;
	margin-top: var(--inkpad-space-xs);
	font-size: var(--inkpad-font-sm);
	font-style: normal;
	color: var(--inkpad-text-muted);
	line-height: var(--inkpad-line-height, var(--inkpad-line-height-relaxed));
}

.inkpad-scope .inkpad-testimonial.inkpad-testimonial--size-sm,
.editor-styles-wrapper .inkpad-testimonial.inkpad-testimonial--size-sm {
	--inkpad-testimonial-quote-size: var(--inkpad-font-sm);
	--inkpad-testimonial-avatar: calc(var(--inkpad-space-md) * 2);
}

.inkpad-scope .inkpad-testimonial.inkpad-testimonial--size-md,
.editor-styles-wrapper .inkpad-testimonial.inkpad-testimonial--size-md {
	--inkpad-testimonial-quote-size: var(--inkpad-font-md);
	--inkpad-testimonial-avatar: calc(var(--inkpad-space-md) * 3);
}

.inkpad-scope .inkpad-testimonial.inkpad-testimonial--size-lg,
.editor-styles-wrapper .inkpad-testimonial.inkpad-testimonial--size-lg {
	--inkpad-testimonial-quote-size: var(--inkpad-font-lg);
	--inkpad-testimonial-avatar: calc(var(--inkpad-space-md) * 3.5);
}

.inkpad-scope .inkpad-testimonial.inkpad-testimonial--weight-normal,
.editor-styles-wrapper .inkpad-testimonial.inkpad-testimonial--weight-normal {
	--inkpad-testimonial-quote-weight: var(--inkpad-weight-normal);
}

.inkpad-scope .inkpad-testimonial.inkpad-testimonial--weight-medium,
.editor-styles-wrapper .inkpad-testimonial.inkpad-testimonial--weight-medium {
	--inkpad-testimonial-quote-weight: var(--inkpad-weight-medium);
}

.inkpad-scope .inkpad-testimonial.inkpad-testimonial--weight-bold,
.editor-styles-wrapper .inkpad-testimonial.inkpad-testimonial--weight-bold {
	--inkpad-testimonial-quote-weight: var(--inkpad-weight-bold);
}

.inkpad-scope .inkpad-testimonial.inkpad-testimonial--align-left,
.editor-styles-wrapper .inkpad-testimonial.inkpad-testimonial--align-left {
	--inkpad-testimonial-body-align: left;
}

.inkpad-scope .inkpad-testimonial.inkpad-testimonial--align-center,
.editor-styles-wrapper .inkpad-testimonial.inkpad-testimonial--align-center {
	--inkpad-testimonial-body-align: center;
}

.inkpad-scope .inkpad-testimonial.inkpad-testimonial--align-right,
.editor-styles-wrapper .inkpad-testimonial.inkpad-testimonial--align-right {
	--inkpad-testimonial-body-align: right;
}

.inkpad-scope .inkpad-testimonial.inkpad-testimonial--padding-none,
.editor-styles-wrapper .inkpad-testimonial.inkpad-testimonial--padding-none {
	--inkpad-testimonial-inner-pad: 0;
}

.inkpad-scope .inkpad-testimonial.inkpad-testimonial--padding-sm,
.editor-styles-wrapper .inkpad-testimonial.inkpad-testimonial--padding-sm {
	--inkpad-testimonial-inner-pad: var(--inkpad-space-sm);
}

.inkpad-scope .inkpad-testimonial.inkpad-testimonial--padding-md,
.editor-styles-wrapper .inkpad-testimonial.inkpad-testimonial--padding-md {
	--inkpad-testimonial-inner-pad: var(--inkpad-space-md);
}

.inkpad-scope .inkpad-testimonial.inkpad-testimonial--padding-lg,
.editor-styles-wrapper .inkpad-testimonial.inkpad-testimonial--padding-lg {
	--inkpad-testimonial-inner-pad: var(--inkpad-space-lg);
}

.inkpad-scope .inkpad-testimonial.inkpad-testimonial--variant-primary,
.inkpad-scope .inkpad-testimonial.inkpad-testimonial--variant-default,
.editor-styles-wrapper .inkpad-testimonial.inkpad-testimonial--variant-primary,
.editor-styles-wrapper .inkpad-testimonial.inkpad-testimonial--variant-default {
	--inkpad-testimonial-surface-bg: color-mix(
		in srgb,
		var(--inkpad-color-surface, var(--inkpad-surface, #ffffff)) 92%,
		var(--inkpad-color-accent, var(--inkpad-accent, currentcolor)) 8%
	);
	--inkpad-testimonial-surface-border: none;
	--inkpad-testimonial-surface-shadow: var(--inkpad-shadow-sm, none);
	--inkpad-testimonial-surface-blur: 0px;
}

.inkpad-scope .inkpad-testimonial.inkpad-testimonial--variant-outlined,
.editor-styles-wrapper .inkpad-testimonial.inkpad-testimonial--variant-outlined {
	--inkpad-testimonial-surface-bg: transparent;
	--inkpad-testimonial-surface-border: 1px solid color-mix(
		in srgb,
		var(--inkpad-color-accent, var(--inkpad-accent, currentcolor)) 28%,
		var(--inkpad-color-text, var(--inkpad-text, #111111))
	);
	--inkpad-testimonial-surface-shadow: none;
	--inkpad-testimonial-surface-blur: 0px;
}

.inkpad-scope .inkpad-testimonial.inkpad-testimonial--variant-glass,
.inkpad-scope .inkpad-testimonial.inkpad-testimonial--variant-surface,
.editor-styles-wrapper .inkpad-testimonial.inkpad-testimonial--variant-glass,
.editor-styles-wrapper .inkpad-testimonial.inkpad-testimonial--variant-surface {
	--inkpad-testimonial-surface-bg: color-mix(
		in srgb,
		var(--inkpad-color-surface, var(--inkpad-surface, #ffffff)) 78%,
		transparent
	);
	--inkpad-testimonial-surface-border: 1px solid color-mix(
		in srgb,
		var(--inkpad-color-text, var(--inkpad-text, #111111)) 12%,
		transparent
	);
	--inkpad-testimonial-surface-shadow: var(--inkpad-shadow-sm, none);
	--inkpad-testimonial-surface-blur: 16px;
}

.inkpad-scope .inkpad-testimonial.inkpad-testimonial--variant-clay,
.inkpad-scope .inkpad-testimonial.inkpad-testimonial--variant-minimal,
.editor-styles-wrapper .inkpad-testimonial.inkpad-testimonial--variant-clay,
.editor-styles-wrapper .inkpad-testimonial.inkpad-testimonial--variant-minimal {
	--inkpad-testimonial-surface-bg: var(--inkpad-color-surface, var(--inkpad-surface, #ffffff));
	--inkpad-testimonial-surface-border: 1px solid color-mix(
		in srgb,
		var(--inkpad-color-text, var(--inkpad-text, #111111)) 10%,
		transparent
	);
	--inkpad-testimonial-surface-shadow: var(--inkpad-shadow-sm, none);
	--inkpad-testimonial-surface-blur: 0px;
}

.inkpad-scope .inkpad-testimonial:hover,
.editor-styles-wrapper .inkpad-testimonial:hover {
	transform: translateY(var(--inkpad-hover-lift));
	box-shadow: var(--inkpad-shadow-md, var(--inkpad-testimonial-surface-shadow));
}

.inkpad-scope .inkpad-testimonial:focus-visible,
.editor-styles-wrapper .inkpad-testimonial:focus-visible {
	outline: none;
	box-shadow: var(--inkpad-focus-ring);
}

@media (max-width: 40em) {
	.inkpad-scope .inkpad-testimonial__row,
	.editor-styles-wrapper .inkpad-testimonial__row {
		align-items: center;
	}
}