:root {
	--flypsee-mood-primary: #54595f;
	--flypsee-mood-hover: #54595f;
	--flypsee-mood-accent: #ffffff;
	--flypsee-mood-background: #f2f2f2;
}

body {
	--e-global-color-secondary: var(--flypsee-mood-primary) !important;
	--e-global-color-accent: var(--flypsee-mood-background) !important;
}

.flypsee-mood-bg {
	background-color: var(--flypsee-mood-primary);
}

.flypsee-mood-background {
	background-color: var(--flypsee-mood-background);
}

.flypsee-mood-text {
	color: var(--flypsee-mood-primary);
}

.flypsee-mood-accent-text {
	color: var(--flypsee-mood-accent);
}

.flypsee-mood-border {
	border-color: var(--flypsee-mood-primary);
}

.flypsee-mood-hover-bg:hover,
.flypsee-mood-hover-bg:focus-visible {
	background-color: var(--flypsee-mood-hover);
}

/*
 * Authoritative opt-in button styling.
 * If flypsee-mood-button is assigned, Flypsee owns the button palette.
 */
button.flypsee-mood-button,
a.flypsee-mood-button,
[type="button"].flypsee-mood-button,
[type="submit"].flypsee-mood-button,
.elementor-widget-button.flypsee-mood-button .elementor-button {
	background-color: var(--flypsee-mood-primary) !important;
	color: var(--flypsee-mood-accent) !important;
	border-color: var(--flypsee-mood-accent) !important;
}

button.flypsee-mood-button:hover,
button.flypsee-mood-button:focus-visible,
a.flypsee-mood-button:hover,
a.flypsee-mood-button:focus-visible,
[type="button"].flypsee-mood-button:hover,
[type="button"].flypsee-mood-button:focus-visible,
[type="submit"].flypsee-mood-button:hover,
[type="submit"].flypsee-mood-button:focus-visible,
.elementor-widget-button.flypsee-mood-button .elementor-button:hover,
.elementor-widget-button.flypsee-mood-button .elementor-button:focus-visible {
	background-color: var(--flypsee-mood-hover) !important;
	color: var(--flypsee-mood-accent) !important;
	border-color: var(--flypsee-mood-accent) !important;
}

.flypsee-mood-selector {
	display: inline-flex;
	flex-direction: column;
	gap: 0.5rem;
	max-width: 100%;
}

.flypsee-mood-selector__title {
	font: inherit;
	font-weight: 600;
	line-height: 1.2;
}

.flypsee-mood-selector__options {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 0.55rem;
}

.flypsee-mood-selector button.flypsee-mood-selector__swatch {
	appearance: none;
	width: 1.15rem;
	height: 1.15rem;
	flex: 0 0 1.15rem;
	padding: 0;
	border: 1px solid rgb(0 0 0 / 20%);
	border-radius: 50%;
	background-color: var(--flypsee-mood-swatch);
	cursor: pointer;
	transition: transform 120ms ease, box-shadow 120ms ease, background-color 120ms ease;
}

.flypsee-mood-selector button.flypsee-mood-selector__swatch:hover {
	background-color: var(--flypsee-mood-swatch-hover);
	transform: scale(1.12);
}

.flypsee-mood-selector button.flypsee-mood-selector__swatch.is-active,
.flypsee-mood-selector button.flypsee-mood-selector__swatch[aria-pressed="true"] {
	background-color: var(--flypsee-mood-swatch-hover);
	box-shadow:
		0 0 0 2px Canvas,
		0 0 0 4px var(--flypsee-mood-swatch-hover);
}

.flypsee-mood-selector button.flypsee-mood-selector__swatch:focus-visible {
	outline: 2px solid CanvasText;
	outline-offset: 4px;
}

@media (prefers-reduced-motion: reduce) {
	.flypsee-mood-selector button.flypsee-mood-selector__swatch {
		transition: none;
	}
}