/**
 * Group Block Custom Styles - Glassmorphism Effects
 *
 * Modern glass morphism effects for core/group block
 */

/* Glassmorphism Base Style */
.wp-block-group.is-style-glassmorphism {
	background: rgba(255, 255, 255, 0.1) !important;
	backdrop-filter: blur(10px);
	-webkit-backdrop-filter: blur(10px);
	border: 1px solid rgba(255, 255, 255, 0.2);
	border-radius: 16px;
	box-shadow: 0 8px 32px 0 rgba(0, 0, 0, 0.1);
	padding: 2rem;
}

/* Glassmorphism Dark Variant */
.wp-block-group.is-style-glassmorphism-dark {
	background: rgba(0, 0, 0, 0.3) !important;
	backdrop-filter: blur(10px);
	-webkit-backdrop-filter: blur(10px);
	border: 1px solid rgba(255, 255, 255, 0.1);
	border-radius: 16px;
	box-shadow: 0 8px 32px 0 rgba(0, 0, 0, 0.3);
	padding: 2rem;
	color: #ffffff;
}

/* Glassmorphism Colored Variant */
.wp-block-group.is-style-glassmorphism-colored {
	background: linear-gradient(
		135deg,
		color-mix(in srgb, var(--wp--preset--color--accent-2) 20%, transparent) 0%,
		color-mix(in srgb, var(--wp--preset--color--accent-3) 20%, transparent) 100%
	) !important;
	backdrop-filter: blur(12px);
	-webkit-backdrop-filter: blur(12px);
	border: 1px solid rgba(255, 255, 255, 0.25);
	border-radius: 20px;
	box-shadow:
		0 8px 32px 0
			color-mix(in srgb, var(--wp--preset--color--accent-2) 15%, transparent),
		inset 0 1px 0 0 rgba(255, 255, 255, 0.3);
	padding: 2rem;
}

/* Heavy Blur Variant */
.wp-block-group.is-style-heavy-blur {
	backdrop-filter: blur(40px);
	-webkit-backdrop-filter: blur(40px);
	background: rgba(255, 255, 255, 0.05) !important;
	border: 1px solid rgba(255, 255, 255, 0.1);
	border-radius: 20px;
	padding: 2.5rem;
}

/* Animated Gradient Variant */
.wp-block-group.is-style-animated-gradient {
	background: linear-gradient(
		-45deg,
		#ee7752,
		#e73c7e,
		#23a6d5,
		#23d5ab
	) !important;
	background-size: 400% 400% !important;
	animation: swp-gradient-animation 15s ease infinite;
	border-radius: 20px;
	padding: 2.5rem;
	color: #ffffff;
}

/* Neon Glow Variant */
.wp-block-group.is-style-neon-glow {
	background: rgba(10, 10, 10, 0.8) !important;
	border: 2px solid var(--wp--preset--color--primary);
	border-radius: 12px;
	box-shadow:
		0 0 15px var(--wp--preset--color--primary),
		inset 0 0 10px var(--wp--preset--color--primary);
	padding: 2rem;
	color: #ffffff;
}

/* Glass Light Variant - Elegant & Minimal */
.wp-block-group.is-style-glass-light {
	background: rgba(255, 255, 255, 0.03) !important;
	backdrop-filter: blur(8px);
	-webkit-backdrop-filter: blur(8px);
	border: 1px solid rgba(255, 255, 255, 0.1);
	border-radius: 24px;
	box-shadow: 0 4px 24px -1px rgba(0, 0, 0, 0.05);
	padding: 2rem;
}

/* Frosted Glass Variant - Sophisticated & Readable */
.wp-block-group.is-style-frosted-glass {
	background: rgba(255, 255, 255, 0.6) !important;
	backdrop-filter: blur(20px);
	-webkit-backdrop-filter: blur(20px);
	border: 1px solid rgba(255, 255, 255, 0.4);
	border-radius: 20px;
	box-shadow: 0 8px 32px 0 rgba(31, 38, 135, 0.07);
	padding: 2rem;
}

@keyframes swp-gradient-animation {
	0% {
		background-position: 0% 50%;
	}
	50% {
		background-position: 100% 50%;
	}
	100% {
		background-position: 0% 50%;
	}
}

/* Responsive adjustments */
@media (max-width: 768px) {
	.wp-block-group.is-style-glassmorphism,
	.wp-block-group.is-style-glassmorphism-dark,
	.wp-block-group.is-style-glassmorphism-colored,
	.wp-block-group.is-style-heavy-blur,
	.wp-block-group.is-style-animated-gradient,
	.wp-block-group.is-style-neon-glow,
	.wp-block-group.is-style-glass-light,
	.wp-block-group.is-style-frosted-glass,
	.wp-block-group.is-style-shine-sweep {
		padding: 1.5rem;
		border-radius: 12px;
	}
}

/* Ensure content inside is readable */
.wp-block-group.is-style-glassmorphism-dark *,
.wp-block-group.is-style-animated-gradient *,
.wp-block-group.is-style-neon-glow * {
	color: inherit;
}

/* Hover effects (optional) */
/* .wp-block-group.is-style-glassmorphism:hover, */
/* .wp-block-group.is-style-glassmorphism-dark:hover, */
/* .wp-block-group.is-style-glassmorphism-colored:hover, */
/* .wp-block-group.is-style-heavy-blur:hover, */
/* .wp-block-group.is-style-animated-gradient:hover, */
/* .wp-block-group.is-style-neon-glow:hover, */
/* .wp-block-group.is-style-glass-light:hover, */
/* .wp-block-group.is-style-frosted-glass:hover { */
/* 	transform: translateY(-2px); */
/* 	transition: transform 0.3s ease; */
/* 	box-shadow: 0 12px 40px 0 rgba(0, 0, 0, 0.15); */
/* } */

/* Shine Sweep Styles - New Variants */
.wp-block-group.is-style-shine-sweep {
	position: relative;
	overflow: hidden;
	background: rgba(255, 255, 255, 0.15) !important;
	backdrop-filter: blur(15px);
	-webkit-backdrop-filter: blur(15px);
	border: 1px solid rgba(255, 255, 255, 0.25);
	border-radius: 20px;
	box-shadow: 0 8px 32px 0 rgba(0, 0, 0, 0.12);
	padding: 2rem;
	transition: all 0.3s ease;
}

.wp-block-group.is-style-shine-sweep::before {
	content: "";
	position: absolute;
	top: 0;
	left: -150%;
	width: 50%;
	height: 100%;
	background: linear-gradient(
		to right,
		transparent 0%,
		rgba(255, 255, 255, 0.4) 50%,
		transparent 100%
	);
	transform: skewX(-25deg);
	transition: left 0.7s ease;
	pointer-events: none;
	z-index: 1;
}

.wp-block-group.is-style-shine-sweep:hover::before {
	left: 150%;
}

.wp-block-group.is-style-shine-sweep:hover {
	background: rgba(255, 255, 255, 0.2) !important;
	box-shadow: 0 12px 40px 0 rgba(0, 0, 0, 0.18);
}

/* =========================================================
   Reveal on Scroll
   Estado inicial: invisível e levemente deslocado para baixo.
   A classe .is-revealed é adicionada pelo JS via IntersectionObserver.
   ========================================================= */

/* Estado inicial do grupo */
.wp-block-group.is-style-reveal-on-scroll {
	opacity: 0;
	transform: translateY(30px);
	transition:
		opacity 0.9s cubic-bezier(0.25, 0.46, 0.45, 0.94),
		transform 0.9s cubic-bezier(0.25, 0.46, 0.45, 0.94);
	will-change: opacity, transform;
}

/* Estado inicial dos filhos diretos (para o efeito stagger) */
.wp-block-group.is-style-reveal-on-scroll > * {
	opacity: 0;
	transform: translateY(20px);
	transition:
		opacity 0.7s cubic-bezier(0.25, 0.46, 0.45, 0.94),
		transform 0.7s cubic-bezier(0.25, 0.46, 0.45, 0.94);
	transition-delay: var(--swp-stagger-delay, 0ms);
	will-change: opacity, transform;
}

/* Estado revelado — grupo */
.wp-block-group.is-style-reveal-on-scroll.is-revealed {
	opacity: 1;
	transform: translateY(0);
}

/* Estado revelado — filhos diretos */
.wp-block-group.is-style-reveal-on-scroll.is-revealed > * {
	opacity: 1;
	transform: translateY(0);
}

/* No editor, desabilita a animação para não esconder o conteúdo */
.editor-styles-wrapper .wp-block-group.is-style-reveal-on-scroll,
.editor-styles-wrapper .wp-block-group.is-style-reveal-on-scroll > * {
	opacity: 1 !important;
	transform: none !important;
	transition: none !important;
}

/* Configurable background image overlay — only the parent group block */
.wp-block-group.has-swp-background-overlay {
	position: relative;
	isolation: isolate;
}

.wp-block-group.has-swp-background-overlay::after {
	content: "";
	position: absolute;
	inset: 0;
	background-color: color-mix(in srgb, var(--swp-group-overlay-color, #000) var(--swp-group-overlay-opacity, 0%), transparent);
	backdrop-filter: blur(var(--swp-group-overlay-blur, 0));
	-webkit-backdrop-filter: blur(var(--swp-group-overlay-blur, 0));
	pointer-events: none;
	z-index: 0;
}

:where(.wp-block-group.has-swp-background-overlay > *) {
	position: relative;
	z-index: 2;
}