/**
 * HMC 互動效果（由區塊側邊欄「HMC 互動效果」面板控制）。
 * 前台與編輯器共用同一份樣式，確保預覽一致。
 */

.hmc-fx {
	transition:
		transform var(--wp--custom--transition, 180ms ease),
		box-shadow var(--wp--custom--transition, 180ms ease),
		background-color var(--wp--custom--transition, 180ms ease),
		border-color var(--wp--custom--transition, 180ms ease),
		color var(--wp--custom--transition, 180ms ease),
		filter var(--wp--custom--transition, 180ms ease);
}

/* 浮起 */
.hmc-fx-lift:is(:hover, :focus-within),
.hmc-fx-lift-zoom:is(:hover, :focus-within) {
	transform: translateY(-4px);
	box-shadow: var(--wp--preset--shadow--lifted, 0 12px 32px rgba(0, 0, 0, 0.14));
}

/* 只加陰影 */
.hmc-fx-shadow:is(:hover, :focus-within) {
	box-shadow: var(--wp--preset--shadow--card, 0 8px 24px rgba(0, 0, 0, 0.12));
}

/* 圖片放大 */
.hmc-fx-zoom :is(.wp-block-post-featured-image, .wp-block-image, .wp-block-cover),
.hmc-fx-lift-zoom :is(.wp-block-post-featured-image, .wp-block-image, .wp-block-cover),
:is(.wp-block-post-featured-image, .wp-block-image).hmc-fx-zoom,
:is(.wp-block-post-featured-image, .wp-block-image).hmc-fx-lift-zoom {
	overflow: hidden;
}

.hmc-fx-zoom img,
.hmc-fx-lift-zoom img,
.hmc-fx-zoom .wp-block-cover__image-background,
.hmc-fx-lift-zoom .wp-block-cover__image-background {
	transition: transform 360ms ease;
}

.hmc-fx-zoom:is(:hover, :focus-within) img,
.hmc-fx-lift-zoom:is(:hover, :focus-within) img,
.hmc-fx-zoom:is(:hover, :focus-within) .wp-block-cover__image-background,
.hmc-fx-lift-zoom:is(:hover, :focus-within) .wp-block-cover__image-background {
	transform: scale(1.05);
}

/* 變暗 */
.hmc-fx-dim:is(:hover, :focus-within) {
	filter: brightness(0.92);
}

/* Hover 顏色 */
.hmc-fx-bg:is(:hover, :focus-within) {
	background-color: var(--hmc-hover-bg) !important;
}

.hmc-fx-text:is(:hover, :focus-within),
.hmc-fx-text:is(:hover, :focus-within) :is(a, h1, h2, h3, h4, h5, h6, p, time, span) {
	color: var(--hmc-hover-text) !important;
}

.hmc-fx-border:is(:hover, :focus-within) {
	border-color: var(--hmc-hover-border) !important;
}

@media (prefers-reduced-motion: reduce) {
	.hmc-fx-lift:is(:hover, :focus-within),
	.hmc-fx-lift-zoom:is(:hover, :focus-within) {
		transform: none;
	}

	.hmc-fx-zoom:is(:hover, :focus-within) img,
	.hmc-fx-lift-zoom:is(:hover, :focus-within) img {
		transform: none;
	}
}
