/* =========================================================
   SCOPED AVADA ELEMENT BUTTON COLOURS
   Apply `tp-button-colours` to an Avada element wrapper.
   Colour only: no geometry, typography, shadow or motion changes.
   ========================================================= */

/* Normal state. Support the class on a parent element or directly on a button. */
.tp-button-colours .fusion-button,
.tp-button-colours button,
.tp-button-colours [role="button"],
.tp-button-colours a[class*="button"],
.tp-button-colours a[class*="btn"],
.tp-button-colours .fusion-social-network-icon,
.fusion-button.tp-button-colours,
button.tp-button-colours,
[role="button"].tp-button-colours,
a.tp-button-colours[class*="button"],
a.tp-button-colours[class*="btn"],
.fusion-social-network-icon.tp-button-colours {
	background-color: var(--tp-button-normal-bg) !important;
	background-image: none !important;
	color: var(--tp-button-normal-text) !important;
	border-color: var(--tp-button-normal-border) !important;
}

/* Hover and keyboard-focus state. */
.tp-button-colours .fusion-button:hover,
.tp-button-colours .fusion-button:focus,
.tp-button-colours .fusion-button:focus-visible,
.tp-button-colours button:hover,
.tp-button-colours button:focus,
.tp-button-colours button:focus-visible,
.tp-button-colours [role="button"]:hover,
.tp-button-colours [role="button"]:focus,
.tp-button-colours [role="button"]:focus-visible,
.tp-button-colours a[class*="button"]:hover,
.tp-button-colours a[class*="button"]:focus,
.tp-button-colours a[class*="button"]:focus-visible,
.tp-button-colours a[class*="btn"]:hover,
.tp-button-colours a[class*="btn"]:focus,
.tp-button-colours a[class*="btn"]:focus-visible,
.tp-button-colours .fusion-social-network-icon:hover,
.tp-button-colours .fusion-social-network-icon:focus,
.tp-button-colours .fusion-social-network-icon:focus-visible,
.fusion-button.tp-button-colours:hover,
.fusion-button.tp-button-colours:focus,
.fusion-button.tp-button-colours:focus-visible,
button.tp-button-colours:hover,
button.tp-button-colours:focus,
button.tp-button-colours:focus-visible,
[role="button"].tp-button-colours:hover,
[role="button"].tp-button-colours:focus,
[role="button"].tp-button-colours:focus-visible,
a.tp-button-colours[class*="button"]:hover,
a.tp-button-colours[class*="button"]:focus,
a.tp-button-colours[class*="button"]:focus-visible,
a.tp-button-colours[class*="btn"]:hover,
a.tp-button-colours[class*="btn"]:focus,
a.tp-button-colours[class*="btn"]:focus-visible,
.fusion-social-network-icon.tp-button-colours:hover,
.fusion-social-network-icon.tp-button-colours:focus,
.fusion-social-network-icon.tp-button-colours:focus-visible {
	background-color: var(--tp-button-hover-bg) !important;
	background-image: none !important;
	color: var(--tp-button-hover-text) !important;
	border-color: var(--tp-button-hover-border) !important;
}

/* Keep Avada text/icon descendants tied to the button's chosen state colour. */
.tp-button-colours .fusion-button .fusion-button-text,
.tp-button-colours .fusion-button i,
.tp-button-colours .fusion-button svg,
.tp-button-colours button i,
.tp-button-colours button svg,
.tp-button-colours [role="button"] i,
.tp-button-colours [role="button"] svg,
.tp-button-colours a[class*="button"] i,
.tp-button-colours a[class*="button"] svg,
.tp-button-colours a[class*="btn"] i,
.tp-button-colours a[class*="btn"] svg,
.tp-button-colours .fusion-social-network-icon i,
.tp-button-colours .fusion-social-network-icon svg,
.fusion-button.tp-button-colours .fusion-button-text,
.fusion-button.tp-button-colours i,
.fusion-button.tp-button-colours svg,
button.tp-button-colours i,
button.tp-button-colours svg,
[role="button"].tp-button-colours i,
[role="button"].tp-button-colours svg,
a.tp-button-colours[class*="button"] i,
a.tp-button-colours[class*="button"] svg,
a.tp-button-colours[class*="btn"] i,
a.tp-button-colours[class*="btn"] svg,
.fusion-social-network-icon.tp-button-colours i,
.fusion-social-network-icon.tp-button-colours svg {
	color: inherit !important;
}

/* SVGs that explicitly use currentColor follow the same normal/hover colour. */
.tp-button-colours .fusion-button svg [fill="currentColor"],
.tp-button-colours button svg [fill="currentColor"],
.tp-button-colours [role="button"] svg [fill="currentColor"],
.tp-button-colours a[class*="button"] svg [fill="currentColor"],
.tp-button-colours a[class*="btn"] svg [fill="currentColor"],
.tp-button-colours .fusion-social-network-icon svg [fill="currentColor"],
.fusion-button.tp-button-colours svg [fill="currentColor"],
button.tp-button-colours svg [fill="currentColor"],
[role="button"].tp-button-colours svg [fill="currentColor"],
a.tp-button-colours[class*="button"] svg [fill="currentColor"],
a.tp-button-colours[class*="btn"] svg [fill="currentColor"],
.fusion-social-network-icon.tp-button-colours svg [fill="currentColor"] {
	fill: currentColor !important;
}

.tp-button-colours .fusion-button svg [stroke="currentColor"],
.tp-button-colours button svg [stroke="currentColor"],
.tp-button-colours [role="button"] svg [stroke="currentColor"],
.tp-button-colours a[class*="button"] svg [stroke="currentColor"],
.tp-button-colours a[class*="btn"] svg [stroke="currentColor"],
.tp-button-colours .fusion-social-network-icon svg [stroke="currentColor"],
.fusion-button.tp-button-colours svg [stroke="currentColor"],
button.tp-button-colours svg [stroke="currentColor"],
[role="button"].tp-button-colours svg [stroke="currentColor"],
a.tp-button-colours[class*="button"] svg [stroke="currentColor"],
a.tp-button-colours[class*="btn"] svg [stroke="currentColor"],
.fusion-social-network-icon.tp-button-colours svg [stroke="currentColor"] {
	stroke: currentColor !important;
}