/*
 * AISA Site Kit - accent colour.
 * Loaded on every page, after the theme's stylesheets, so it wins.
 *
 * The theme's own stylesheet still lists the old green in --teal.
 * This points --teal at the "Teal" colour in the theme's theme.json,
 * so the accent is set in one place: theme.json's palette ("teal" and
 * "teal-hover"). Change it there and buttons, links, labels, highlights
 * and block editor colours all follow.
 *
 * The glow rules below have the colour written in as rgba(77, 205, 196, x)
 * because they need it partly transparent; update them too if the
 * accent changes.
 */
:root {
	--teal:       var(--wp--preset--color--teal, #4dcdc4);
	--teal-hover: var(--wp--preset--color--teal-hover, #71d7d0);
	--teal-dim:   rgba(77, 205, 196, 0.1);
}

.glow-teal { text-shadow: 0 0 40px rgba(77, 205, 196, 0.45); }
.hero-ripple {
	background: radial-gradient(ellipse 120% 80% at 70% 50%, rgba(77, 205, 196, 0.06) 0%, transparent 65%),
	            radial-gradient(ellipse 80% 60% at 20% 80%, rgba(90, 157, 215, 0.05) 0%, transparent 60%);
}
.hero--centered .hero-ripple {
	background: radial-gradient(ellipse 90% 70% at 50% 30%, rgba(77, 205, 196, 0.05) 0%, transparent 65%);
}
.hero-ring { border-color: rgba(77, 205, 196, 0.045); }
.featured-card-gradient {
	background: linear-gradient(to top right, rgba(77, 205, 196, 0.4), transparent, transparent);
}
.campaign-hero-bg {
	background: radial-gradient(ellipse 100% 80% at 50% 100%, rgba(77, 205, 196, 0.08), transparent 70%);
}