/**
 * core/post-template
 */

.wp-block-post-template:not([class*='is-style-']) {
	gap: var(--wp--preset--spacing--90) var(--wp--preset--spacing--60);
}

.wp-block-post-template:not([class*='is-style-']) .wp-block-post__media {
	position: relative;
	margin-block-end: calc(var(--wp--preset--spacing--30) - 2px);
	border: 1px solid var(--wp--preset--color--accent-4);
	border-block-end-width: 5px;
	border-radius: var(--wp--custom--border--radius--10);
	overflow: hidden;
}

.wp-block-post-template:not([class*='is-style-']) .wp-block-post__media :is(a, img) {
	border-radius: 4px;
}

.wp-block-post-template:not([class*='is-style-']) .wp-block-post-title {
	margin-block-start: 0;
}

.wp-block-post-template:not([class*='is-style-']) .wp-block-post-date {
	margin-block: var(--wp--preset--spacing--10);
}

/* Row layout */
.wp-block-post-template.is-layout-flow {
	gap: var(--wp--preset--spacing--40);
}

.wp-block-post-template.is-layout-flow .wp-block-post {
	margin-block: 0 var(--wp--preset--spacing--40);
}

.wp-block-post-template.is-layout-flow .wp-block-post:not(:last-child) {
	padding-block-end: var(--wp--preset--spacing--40);
	border-block-end: 1px solid var(--wp--preset--color--base-3);
}

@media (width <= 1200px) {

	/* Grid layout */
	.wp-block-post-template.is-layout-grid.has-stack-on-mobile {
		grid-template-columns: repeat(2, 1fr);
	}
}

@media (width <= 767px) {
	.wp-block-post-template.is-layout-grid.has-stack-on-mobile {
		grid-template-columns: 1fr;
	}

	.wp-block-post-template.is-layout-grid.has-stack-on-mobile > * {
		grid-column: 1;
	}
}

@media (hover: hover) {
	.wp-block-post-template:not([class*='is-style-']) .wp-block-post:has(a:hover, a:focus-visible) .wp-block-post-title a {
		color: var(--wp--preset--color--accent-3);
		text-decoration: underline;
		text-underline-offset: 2px;
	}

	.has-accent-3-background-color .wp-block-post-template:not([class*='is-style-']) .wp-block-post:has(a:hover, a:focus-visible) .wp-block-post-title a {
		color: currentColor;
	}

	.wp-block-post-template .wp-block-post:has(a:hover, a:focus-visible) .wp-block-post-featured-image img {
		scale: 1.05;
	}

	.wp-block-post-template .wp-block-post:has(a:hover, a:focus-visible) .wp-block-post-title a {
		color: var(--wp--preset--color--accent-2);
	}

	.wp-block-post-template .wp-block-post .wp-block-post-title svg {
		transition: translate var(--wp--custom--transition--hover);
	}

	.wp-block-post-template .wp-block-post:has(a:hover, a:focus-visible) .wp-block-post-title svg {
		translate: 4px 0.125em;
	}
}