/* Global CSS for Elementor Site Settings > Custom CSS */
:root {
	--e-global-color-primary: #3d2b1f;
	--e-global-color-secondary: #556b2f;
	--e-global-color-text: #4f453f;
	--e-global-color-accent: #8b5e3c;
	--surface-bg: #fbf9f8;
	--surface-dim: #dcd9d9;
	--surface-container-low: #f6f3f2;
	--font-main: 'Hanken Grotesk', sans-serif;
}

.shayke-site {
	direction: rtl;
	text-align: right;
}

.shayke-main {
	min-height: 50vh;
}

/* Hide Hello Elementor default chrome */
.site-header:not(.shayke-header),
.site-footer:not(.shayke-footer) {
	display: none !important;
}

.shayke-btn-primary {
	background-color: var(--e-global-color-primary);
	color: #fff;
	padding: 12px 24px;
	border-radius: 4px;
	font-family: var(--font-main);
	font-weight: 600;
	text-transform: uppercase;
	letter-spacing: 0.05em;
	transition: all 0.3s ease;
	border: none;
	cursor: pointer;
}

.shayke-btn-primary:hover {
	background-color: var(--e-global-color-accent);
	transform: translateY(-2px);
}

.shayke-card {
	background-color: var(--surface-container-low);
	border-radius: 4px;
	overflow: hidden;
	transition: transform 0.3s ease, box-shadow 0.3s ease;
}

.shayke-card:hover {
	transform: translateY(-5px);
	box-shadow: 0 10px 20px rgba(61, 43, 31, 0.1);
}

.form-input-custom,
.woocommerce form .form-row input.input-text,
.woocommerce form .form-row textarea,
.woocommerce form .form-row select {
	border: 1px solid rgba(129, 117, 110, 0.3);
	border-radius: 4px;
	padding: 0.75rem 1rem;
	width: 100%;
	background: #fff;
	text-align: right;
	transition: border-color 0.2s ease, box-shadow 0.2s ease;
}

.form-input-custom:focus {
	outline: none;
	border-color: #3d2b1f;
	box-shadow: 0 0 0 2px rgba(61, 43, 31, 0.1);
}

.card-hover:hover .card-img {
	transform: scale(1.05);
}

.reveal-on-scroll {
	opacity: 1;
}

@media (max-width: 768px) {
	.px-margin-desktop,
	.elementor .e-con.px-margin-desktop {
		padding-left: 1.25rem !important;
		padding-right: 1.25rem !important;
	}

	.py-section-gap,
	.elementor .e-con.py-section-gap {
		padding-top: 3rem !important;
		padding-bottom: 3rem !important;
	}

	.pt-section-gap,
	.elementor .e-con.pt-section-gap {
		padding-top: 3rem !important;
	}

	.pb-section-gap,
	.elementor .e-con.pb-section-gap {
		padding-bottom: 3rem !important;
	}

	.mb-section-gap,
	.elementor .e-con.mb-section-gap {
		margin-bottom: 3rem !important;
	}

	.gap-section-gap,
	.elementor .e-con.gap-section-gap {
		gap: 3rem !important;
	}
}