/* SmartX Docker — theme extras
 * Utility rules that cannot be expressed in theme.json (glass surface, gradient text,
 * sticky header polish, scroll-padding). Keep this file tiny on purpose.
 */

:root {
	--sx-border: 1px solid rgba(255, 255, 255, 0.08);
	--sx-border-strong: 1px solid rgba(255, 255, 255, 0.14);
	--sx-glass-bg: rgba(17, 24, 39, 0.55);
	--sx-shadow-lg: 0 20px 60px -20px rgba(0, 0, 0, 0.6), 0 8px 24px -12px rgba(249, 115, 22, 0.25);
}

html { scroll-padding-top: 6rem; scroll-behavior: smooth; }
body { min-height: 100dvh; }

/* Glass surface — reusable via .is-style-glass on any group/cover */
.is-style-glass {
	background: var(--sx-glass-bg) !important;
	backdrop-filter: saturate(160%) blur(14px);
	-webkit-backdrop-filter: saturate(160%) blur(14px);
	border: var(--sx-border);
	border-radius: 1rem;
}

/* Gradient text — apply .is-style-gradient-text on headings */
.is-style-gradient-text {
	background: var(--wp--preset--gradient--text-gradient);
	-webkit-background-clip: text;
	background-clip: text;
	color: transparent;
	-webkit-text-fill-color: transparent;
}

/* Sticky header part — the first header region in a document */
.wp-site-blocks > header {
	position: sticky;
	top: 0.75rem;
	z-index: 50;
}

/* Card style — for feature/pricing tiles */
.is-style-card {
	background: rgba(17, 24, 39, 0.65);
	border: var(--sx-border);
	border-radius: 1rem;
	padding: 1.75rem;
	transition: border-color 0.2s ease, transform 0.2s ease;
}
.is-style-card:hover {
	border-color: rgba(249, 115, 22, 0.5);
	transform: translateY(-2px);
}

/* Button ghost variant — .is-style-ghost on core/button */
.wp-block-button.is-style-ghost .wp-block-button__link {
	background: transparent !important;
	color: var(--wp--preset--color--contrast) !important;
	border: var(--sx-border-strong) !important;
}
.wp-block-button.is-style-ghost .wp-block-button__link:hover {
	border-color: var(--wp--preset--color--accent) !important;
	color: var(--wp--preset--color--accent) !important;
}

/* Pill badge used above hero heading */
.is-style-pill {
	display: inline-flex;
	align-items: center;
	gap: 0.5rem;
	padding: 0.4rem 0.9rem;
	border-radius: 9999px;
	background: var(--sx-glass-bg);
	border: var(--sx-border);
	font-size: 0.85rem;
	color: var(--wp--preset--color--muted);
}

/* Dot separator used inside pill */
.is-style-pill::before {
	content: "";
	width: 0.45rem;
	height: 0.45rem;
	border-radius: 9999px;
	background: var(--wp--preset--color--accent);
	box-shadow: 0 0 0 4px rgba(249, 115, 22, 0.2);
}

/* Stat box */
.is-style-stat {
	text-align: center;
	padding: 1.25rem;
	border-radius: 1rem;
	background: rgba(17, 24, 39, 0.55);
	border: var(--sx-border);
}
.is-style-stat .wp-block-heading {
	background: var(--wp--preset--gradient--text-gradient);
	-webkit-background-clip: text;
	background-clip: text;
	-webkit-text-fill-color: transparent;
	margin: 0 0 0.25rem;
}

/* Footer polish */
footer.wp-block-template-part a { color: var(--wp--preset--color--subtle); }
footer.wp-block-template-part a:hover { color: var(--wp--preset--color--accent); }