/*
 * Brand colours, site-wide (owner, 5 Nov 2026). One file, one switch: Settings › Therapy Villa Team Sync › Brand colours.
 * Switching off stops this file loading and the site is exactly as before; nothing in Elementor is changed.
 * Eucalyptus #798A74 · Deep sage #5E6C5A · Cream #FDF8F3 · Near-black #262626. No tints.
 * White text under 24px never sits on eucalyptus (3.68:1); deep sage with white is 5.57:1.
 */

/* 1. Globals. Elementor's kit sets them on body; the theme on :root. */
:root, body, body[class*="elementor-kit-"] {
	--e-global-color-accent: #798A74;
	--e-global-color-secondary: #FDF8F3;
	--tvts-accent: #798A74;
	--tvts-soft: #FDF8F3;
}
/* The filter cards' colours are set inline on the page. */
[style*="--apf-excerpt-color"] { --apf-excerpt-color: #5E6C5A !important; }
[style*="--apf-meta-color"] { --apf-meta-color: #5E6C5A !important; }
[style*="--apf-readmore-color"] { --apf-readmore-color: #5E6C5A !important; }

/* 2. Inside the page the accent is deep sage: text, filled buttons and panels that hold text. */
.e-con, .elementor-section, .elementor-widget, .widget, .custom-team-filter {
	--e-global-color-accent: #5E6C5A;
}

/* 3. Large shapes keep eucalyptus: number tiles, icon tiles, icons, the band behind the contact form, the menu button. */
.elementor-widget-counter, .elementor-widget-tvts-counter, .elementor-widget-tvts-funfact, .elementor-widget-elementskit-funfact,
.elementor-widget-icon .elementor-icon, .elementor-widget-icon-box .elementor-icon, .elementor-widget-icon-list .elementor-icon-list-icon,
.elementor-widget-elementskit-icon-box .elementskit-box-header, .elementor-widget-elementskit-icon-box .elementskit-info-box-icon,
.elementor-menu-toggle, .elementskit-menu-hamburger, .ekit_menu_responsive_tablet .elementskit-menu-hamburger,
.ekit-badge, .ekit-video-popup, .elementor-element-b0f201b,
.elementor-element-009102d, .elementor-element-edba225, .elementor-element-fdd0056, .elementor-element-6e80194 {
	--e-global-color-accent: #798A74;
}

/* 4. Filled buttons: deep sage, white text. Hover on light: near-black. */
.elementor-button:not(.elementor-button-link-transparent):where([style], *),
.wpcf7-submit, .elementor-field-type-submit .elementor-button, .ekit-btn-wraper .elementskit-btn {
	--e-global-color-accent: #5E6C5A;
}
.wpcf7 .wpcf7-submit { background-color: #5E6C5A !important; color: #fff !important; border-color: #5E6C5A !important; }
.wpcf7 .wpcf7-submit:hover, .wpcf7 .wpcf7-submit:focus-visible { background-color: #262626 !important; border-color: #262626 !important; }
.elementor-widget-button .elementor-button:hover, .elementor-widget-button .elementor-button:focus-visible,
.elementor-field-type-submit .elementor-button:hover {
	background-color: #262626;
	color: #fff;
}

/* 5. Filled buttons on video, photo or dark: a thin cream line and a soft shadow; hover cream with near-black text.
 *    By what the section is (header, footer bar, a background video or photo, a dark fill), not by page, so new pages inherit it. */
:is(.elementor-location-header, [data-elementor-type="header"],
	.e-con:has(> .elementor-background-video-container), .e-con:has(> .elementor-background-slideshow),
	.e-con[data-settings*="background_video_link"], .elementor-element-d586135, .elementor-element-c01ffac,
	.e-con:has(> .elementor-background-overlay)) .elementor-widget-button .elementor-button,
.tvts-on-dark .elementor-widget-button .elementor-button {
	background-color: #5E6C5A;
	color: #fff;
	/* A 1px cream line and a soft shadow (Niyati's pick, option D, 5 Nov 2026). */
	border: 1px solid #FDF8F3;
	box-shadow: 0 2px 3px rgba(0, 0, 0, .3), 0 8px 18px rgba(0, 0, 0, .3);
}
:is(.elementor-location-header, [data-elementor-type="header"],
	.e-con:has(> .elementor-background-video-container), .e-con:has(> .elementor-background-slideshow),
	.e-con[data-settings*="background_video_link"], .elementor-element-d586135, .elementor-element-c01ffac,
	.e-con:has(> .elementor-background-overlay)) .elementor-widget-button .elementor-button:is(:hover, :focus-visible),
.tvts-on-dark .elementor-widget-button .elementor-button:is(:hover, :focus-visible) {
	background-color: #FDF8F3;
	color: #262626;
	border-color: #FDF8F3;
}
:is(.elementor-location-header, [data-elementor-type="header"], .tvts-on-dark) .elementor-widget-button .elementor-button:is(:hover, :focus-visible) :is(.elementor-button-text, .elementor-button-icon, svg) {
	color: #262626;
	fill: #262626;
}

/* 6. White buttons inside a green panel stay white with near-black text. */
:is(.elementor-element-302e779, .elementor-element-cf567f1, .elementor-element-4fb4ac8, .elementor-element-d91e366, .elementor-element-0d1f846, .elementor-element-b83f0c8) .elementor-widget-button .elementor-button { background-color: #fff; color: #262626; }
:is(.elementor-element-302e779, .elementor-element-cf567f1, .elementor-element-4fb4ac8, .elementor-element-d91e366, .elementor-element-0d1f846, .elementor-element-b83f0c8) .elementor-widget-button .elementor-button:is(:hover, :focus-visible) { background-color: #262626; color: #fff; }

/* 7. Hard-coded in the child theme and other plugins. */
.custom-team-filter a.apf-read-more:hover { color: #5E6C5A; }
.custom-team-filter .apf-post { border-top-color: #798A74; }
.custom-team-filter .apf-chip { background: #5E6C5A; color: #fff; }
.team-client-tag.status-accepting .elementor-post-info__terms-list-item { background: #5E6C5A; color: #fff; }
.client-focus-type img.client-focus-image { background: #798A74; }
.elementor-19930 .elementor-element.elementor-element-ff3ee35:not(.elementor-motion-effects-element-type-background) { background-color: #FDF8F3; }
aside.widget, .widget_block { --e-global-color-secondary: #FDF8F3; }
.custom-team-filter .custom-mobile-filter-toggle:hover { border-color: #5E6C5A; }

/* 8. Form focus and messages. */
.wpcf7 :is(input, textarea, select):focus { border-color: #5E6C5A !important; outline-color: #5E6C5A; }
.wpcf7 form.sent .wpcf7-response-output { border-color: #5E6C5A; }

/* 9. Colours typed into a text block by hand. */
:is([style*="9b9a84" i], [style*="155, 154, 132"], [style*="155,154,132"]) { color: #5E6C5A !important; }
:is([style*="background-color: #f2f2f2" i], [style*="background-color:#f2f2f2" i], [style*="background: #f2f2f2" i]) { background-color: #FDF8F3 !important; }
