/**
 * core/post-template - Default style
 */

.wp-block-post-template {
	.wp-block-post {
		position: relative;
	}

	@container body (width < 768px) {
		&.is-layout-grid {
			row-gap: var(--wp--preset--spacing--30);
		}
	}
}

/* No block styles set */
.wp-block-post-template:not([class*='is-style-']) {
	--post--spacing--padding: var(--wp--preset--spacing--20);


	.wp-block-post {
		display: flex;
		flex-direction: column;
		align-items: stretch;
		gap: 0;
		background-color: var(--wp--preset--color--gray-lightest);
		border: 1px solid var(--wp--preset--color--gray-lightest);
		border-radius: var(--wp--preset--border-radius--medium);
		overflow: clip;
	}

	.has-gray-lightest-background-color & {
		.wp-block-post {
			background-color: var(--wp--preset--color--base);
		}
	}

	.wp-block-post-terms, .wp-block-post-title {
		padding-inline: var(--post--spacing--padding);
	}

	/* Featured image */
	.wp-block-post-featured-image {
		margin-block-end: 0;

		&, img {
			border-end-start-radius: 0;
			border-end-end-radius: 0;
		}

		img {
			inline-size: 100%;
			aspect-ratio: 396/209;
			object-fit: cover;
		}
	}

	/* Post Terms */
	.wp-block-post-terms {
		padding-block: var(--post--spacing--padding) var(--wp--preset--spacing--10);
		z-index: 2;
	}

	/* Post Title */
	.wp-block-post-title {
		margin: 0;
		text-decoration: underline;
		text-decoration-color: transparent;
		text-underline-offset: 2px;
		transition: color var(--wp--custom--transition--hover), text-underline-offset var(--wp--custom--transition--hover);
	}

	/* Read More Button */
	.wp-block-read-more {
		display: flex;
		position: static;
		justify-content: flex-end;
		gap: var(--wp--preset--spacing--10);
		inline-size: 100%;
		margin-block-start: auto;
		padding: var(--wp--preset--spacing--10);

		&.eh-has-icon {
			--icon--width: 24px;
			--icon--height: 24px;
		}

		/* Link overlay */
		&:not(.wp-block)::before {
			display: block;
			position: absolute;
			inset: 0;
			content: '';
		}
	}

	@media (hover:hover) {
		.wp-block-post:hover {
			.wp-block-post-featured-image img {
				scale: 1.05;
			}

			.wp-block-post-title {
				color: var(--wp--preset--color--primary);
				text-decoration-color: currentColor;
				text-decoration-thickness: 1px;
				text-underline-offset: 4px;
			}

			.wp-block-read-more.eh-has-icon {
				--icon--color: var(--wp--preset--color--contrast);
			}
		}
	}

	@media (width >= 1024px) {
		--post--spacing--padding: var(--wp--preset--spacing--30);
	}
}