/**
 * Site-wide button system — dark forest green, overrides Hello Elementor defaults.
 *
 * @package Skavend
 */

:root {
	--skavend-btn-bg: linear-gradient(180deg, #0b4232 0%, #062c21 100%);
	--skavend-btn-bg-hover: linear-gradient(180deg, #0c4a38 0%, #07301f 100%);
	--skavend-btn-bg-active: linear-gradient(180deg, #051a14 0%, #041510 100%);
	--skavend-btn-text: #f4ece0;
	--skavend-btn-ghost-border: #c19a6b;
	--skavend-btn-ghost-hover: rgba(193, 154, 107, 0.12);
	--skavend-btn-ghost-active: rgba(193, 154, 107, 0.2);
	--skavend-btn-shadow: 0 10px 24px rgba(6, 44, 33, 0.22);
	--skavend-btn-shadow-hover: 0 14px 30px rgba(6, 44, 33, 0.28);
	--skavend-btn-shadow-active: 0 4px 10px rgba(6, 44, 33, 0.2);
}

/* Override Hello Elementor / WP default button colors (magenta hover). */
body button:not(.menu-toggle):not(.components-button):not(.button-link):not(.skavend-dash__save):not(.skavend-dash__image-select):not(.skavend-dash__image-remove):not(.skavend-gallery-field__item-remove):not(.skavend-media-field__remove):not(.cp-faq__q):not(.cp-globe__popup-close):not(.cp-globe-pin):not(.ins-strip__prev):not(.ins-strip__next):not(.ins-topic):not([class*="wp-"]),
body input[type="submit"],
body input[type="button"]:not(.components-button) {
	background: var(--skavend-btn-bg);
	color: var(--skavend-btn-text);
	border: none;
	text-decoration: none;
	box-shadow: var(--skavend-btn-shadow);
	transition:
		transform 0.2s ease,
		background 0.2s ease,
		background-color 0.2s ease,
		box-shadow 0.2s ease,
		border-color 0.2s ease,
		color 0.2s ease;
}

body button:not(.menu-toggle):not(.components-button):not(.button-link):not(.skavend-dash__save):not(.skavend-dash__image-select):not(.skavend-dash__image-remove):not(.skavend-gallery-field__item-remove):not(.skavend-media-field__remove):not(.cp-faq__q):not(.cp-globe__popup-close):not(.cp-globe-pin):not(.ins-strip__prev):not(.ins-strip__next):not(.ins-topic):not([class*="wp-"]):hover,
body input[type="submit"]:hover,
body input[type="button"]:not(.components-button):hover {
	background: var(--skavend-btn-bg-hover);
	background-color: #0c4a38;
	color: var(--skavend-btn-text);
	transform: translateY(-2px);
	box-shadow: var(--skavend-btn-shadow-hover);
}

body button:not(.menu-toggle):not(.components-button):not(.button-link):not(.skavend-dash__save):not(.skavend-dash__image-select):not(.skavend-dash__image-remove):not(.skavend-gallery-field__item-remove):not(.skavend-media-field__remove):not(.cp-faq__q):not(.cp-globe__popup-close):not(.cp-globe-pin):not(.ins-strip__prev):not(.ins-strip__next):not(.ins-topic):not([class*="wp-"]):active,
body input[type="submit"]:active,
body input[type="button"]:not(.components-button):active {
	background: var(--skavend-btn-bg-active);
	background-color: #051a14;
	color: var(--skavend-btn-text);
	transform: translateY(1px);
	box-shadow: var(--skavend-btn-shadow-active);
}

/* Shared themed button classes — hover, active, focus */
.in-btn,
.ins-btn,
.sv-btn,
.cap-btn,
.ap-btn,
.home-hero__btn,
.cta-banner-section__btn,
.cp-form__submit,
.cp-cta__btn,
.insa-btn {
	text-decoration: none;
	transition:
		transform 0.2s ease,
		background 0.2s ease,
		background-color 0.2s ease,
		box-shadow 0.2s ease,
		border-color 0.2s ease,
		color 0.2s ease;
}

.in-btn:hover,
.ins-btn:hover,
.sv-btn:hover,
.cap-btn:hover,
.ap-btn:hover,
.home-hero__btn--primary:hover,
.cta-banner-section__btn--primary:hover,
.cp-form__submit:hover,
.cp-cta__btn:hover,
.insa-btn:hover {
	text-decoration: none;
	background: var(--skavend-btn-bg-hover);
	background-color: #0c4a38;
	color: var(--skavend-btn-text);
	transform: translateY(-2px);
	box-shadow: var(--skavend-btn-shadow-hover);
}

.in-btn:active,
.ins-btn:active,
.sv-btn:active,
.cap-btn:active,
.ap-btn:active,
.home-hero__btn:active,
.cta-banner-section__btn:active,
.cp-form__submit:active,
.cp-cta__btn:active,
.insa-btn:active {
	transform: translateY(1px);
	box-shadow: var(--skavend-btn-shadow-active);
}

/* Ghost / secondary buttons */
.in-btn--ghost,
.ins-btn--ghost,
.sv-btn--ghost,
.cap-btn--ghost,
.home-hero__btn--secondary {
	background: transparent;
	background-color: transparent;
	color: var(--color-text-primary, #14241e);
	border: 1.5px solid var(--skavend-btn-ghost-border);
	box-shadow: none;
}

.in-btn--ghost:hover,
.ins-btn--ghost:hover,
.sv-btn--ghost:hover,
.cap-btn--ghost:hover,
.home-hero__btn--secondary:hover {
	background: var(--skavend-btn-ghost-hover);
	background-color: var(--skavend-btn-ghost-hover);
	color: var(--color-text-primary, #14241e);
	border-color: var(--skavend-btn-ghost-border);
	box-shadow: none;
	transform: translateY(-2px);
}

.in-btn--ghost:active,
.ins-btn--ghost:active,
.sv-btn--ghost:active,
.cap-btn--ghost:active,
.home-hero__btn--secondary:active {
	background: var(--skavend-btn-ghost-active);
	background-color: var(--skavend-btn-ghost-active);
	transform: translateY(0);
	box-shadow: none;
}

/* Plain <button> elements using page btn classes — beat global + Elementor resets */
.in-page button.in-btn,
.ins-page button.ins-btn,
.sv-page button.sv-btn,
.cap-page button.cap-btn,
.ap-page button.ap-btn {
	background: var(--skavend-btn-bg);
	background-color: #0a3d2d;
	color: var(--skavend-btn-text);
	border: none;
	box-shadow: var(--skavend-btn-shadow);
}

.in-page button.in-btn:hover,
.ins-page button.ins-btn:hover,
.sv-page button.sv-btn:hover,
.cap-page button.cap-btn:hover,
.ap-page button.ap-btn:hover {
	background: var(--skavend-btn-bg-hover);
	background-color: #0c4a38;
	color: var(--skavend-btn-text);
}

.in-page button.in-btn--ghost,
.ins-page button.ins-btn--ghost,
.sv-page button.sv-btn--ghost,
.cap-page button.cap-btn--ghost {
	background: transparent;
	background-color: transparent;
	color: var(--color-text-primary, #14241e);
	border: 1.5px solid var(--skavend-btn-ghost-border);
	box-shadow: none;
}

.in-page button.in-btn--ghost:hover,
.ins-page button.ins-btn--ghost:hover,
.sv-page button.sv-btn--ghost:hover,
.cap-page button.cap-btn--ghost:hover {
	background: var(--skavend-btn-ghost-hover);
	background-color: var(--skavend-btn-ghost-hover);
	color: var(--color-text-primary, #14241e);
	border-color: var(--skavend-btn-ghost-border);
	box-shadow: none;
}

.in-page button.in-btn--ghost:active,
.ins-page button.ins-btn--ghost:active,
.sv-page button.sv-btn--ghost:active,
.cap-page button.cap-btn--ghost:active {
	background: var(--skavend-btn-ghost-active);
	background-color: var(--skavend-btn-ghost-active);
	transform: translateY(0);
}

@media (prefers-reduced-motion: reduce) {
	.in-btn,
	.ins-btn,
	.sv-btn,
	.cap-btn,
	.ap-btn,
	.home-hero__btn,
	.cta-banner-section__btn,
	body button:not(.menu-toggle),
	body input[type="submit"],
	body input[type="button"] {
		transition: none;
	}
}
