/**
 * Simple Callout — default design tokens.
 *
 * These are the plugin-level defaults for --ftps-simple-callout-* properties.
 * Override any of them in your theme's page-sections-tokens.css file.
 */

@layer ftps-defaults {

.page-section-simple-callout {

	/* ── Layout ─────────────────────────────────────────────────────── */
	--ftps-radius-control: var(--border-radius, 3px);
	--ftps-radius-media: var(--border-radius-image, 10px);
	--ftps-simple-callout-radius-surface: var(--ftps-radius-media);
	--ftps-simple-callout-border-radius: var(--ftps-simple-callout-radius-surface);
	--ftps-simple-callout-max-width: 1200px;
	--ftps-simple-callout-image-width: 60%;

	/* ── Spacing ───────────────────────────────────────────────────── */
	--ftps-simple-callout-content-padding: var(--space-large, 1.5rem);
	--ftps-simple-callout-title-margin-bottom: 1rem;
	--ftps-simple-callout-actions-margin-bottom: var(--space-xlarge, 2.5rem);
	--ftps-simple-callout-spacing-normal: var(--space-normal, 1rem);
}

} /* end @layer ftps-defaults */

.page-section-simple-callout .ftps-actions.simple_callout,
.page-section-simple-callout .ftps-actions.simple_callout ul{
	margin: 0;
	padding: 0;
	text-align: center;
}

.page-section-simple-callout .ftps-simple-callout-inner {
	border-radius: var(--ftps-simple-callout-border-radius);
	overflow: hidden;
}

.page-section-simple-callout img {
	border: none;
	border-radius: 0;
	display: block;
	width: 100%;
}

.page-section-simple-callout .ftps-simple-callout-content {
	padding: 0 var(--ftps-simple-callout-content-padding);
	text-align: center;
}

.page-section-simple-callout .ftps-simple-callout-title,
.page-section-simple-callout .ftps-simple-callout-text,
.page-section-simple-callout .ftps-simple-callout-text > * {
	color: inherit;
}

.page-section-simple-callout .ftps-simple-callout-text h2 {
	font: var(--heading-medium)
}

.page-section-simple-callout .ftps-simple-callout-title {
	margin-bottom: var(--ftps-simple-callout-title-margin-bottom);
}

.page-section-simple-callout .ft-actions {
	margin-bottom: var(--ftps-simple-callout-actions-margin-bottom);
}

.page-section-simple-callout .actions button, 
.page-section-simple-callout .actions .button, 
.page-section-simple-callout .actions :where(.wp-element-button, .wp-block-button__link),
.page-section-simple-callout .ftps-actions button,
.page-section-simple-callout .ftps-actions .button,
.page-section-simple-callout .ftps-actions :where(.wp-element-button, .wp-block-button__link) {
    background-color: transparent;
	display: inline-flex;
	align-items: center;

	&:hover,
	&:focus,
	&:focus-visible {
		background-color: transparent;
		text-decoration: underline;
	}

	&::after {
		--ftps-angle-right-icon-size: 1rem;
		background-color: currentcolor;
		content: '';
		display: inline-block;
		flex-shrink: 0;
		height: var(--ftps-angle-right-icon-size);
		mask-image: var(--ftps-angle-right-icon);
		mask-position: center;
		mask-repeat: no-repeat;
		mask-size: contain;
		width: var(--ftps-angle-right-icon-size);
		-webkit-mask-image: var(--ftps-angle-right-icon);
		-webkit-mask-position: center;
		-webkit-mask-repeat: no-repeat;
		-webkit-mask-size: contain;
	}
}

@media (min-width: 45em) {

	.page-section-simple-callout .ftps-simple-callout-image-wrapper {
		text-align: center;
	}
}

@media (min-width: 65.8125em) {

	.page-section-simple-callout .ftps-simple-callout-inner {
		align-items: stretch;
		display: flex;
		flex-direction: row-reverse;
		margin: 0 auto;
		max-width: var(--ftps-simple-callout-max-width);
	}

	.page-section-simple-callout .ftps-simple-callout-image {
		overflow: hidden;
		width: var(--ftps-simple-callout-image-width);
	}

	/* Pass height through wrapper chain (.ft-shop-the-image may be inserted by JS) */
	.page-section-simple-callout .ftps-simple-callout-image > *,
	.page-section-simple-callout .ftps-simple-callout-image-wrapper {
		height: 100%;
	}

	.page-section-simple-callout img {
		height: 100%;
		object-fit: cover;
	}

	.page-section-simple-callout .ftps-simple-callout-content {
		display: flex;
		flex-direction: column;
		justify-content: center;
		margin: 0 auto;
	}

	.page-section-simple-callout .ftps-simple-callout-title {
		margin-top: var(--ftps-simple-callout-spacing-normal);
	}

	.page-section-simple-callout .ft-actions {
		margin-bottom: var(--ftps-simple-callout-spacing-normal);
	}
}