/* ==========================================================================
   Viento – site-wide brand layer (all pages)
   Same palette and type as the home page: warm black / cream / gold,
   Playfair Display (headings) + Montserrat (text).
   ========================================================================== */

/* ---------- Woodmart theme variables ----------
   Defined on body: the Elementor globals (--e-global-*) live on body.elementor-kit-*, :root cannot see them. */
html body {
	--vp-ink: var(--e-global-color-vp_ink, #1d1915);
	--vp-black: var(--e-global-color-vp_black, #100f0d);
	--vp-cream: var(--e-global-color-vp_cream, #faf6f0);
	--vp-gold: var(--e-global-color-vp_gold, #c9a063);
	--vp-gold-light: var(--e-global-color-vp_gold_light, #e3c58f);
	--vp-gold-text: var(--e-global-color-vp_gold_text, #8b6431);
	--vp-body: #4b443d;
	--vp-muted: #6b625a;
	--vp-line: #e7dccb;
	--vp-font-head: var(--e-global-typography-vp_head-font-family, "Playfair Display"), Georgia, "Times New Roman", serif;
	--vp-font-body: var(--e-global-typography-vp_body-font-family, "Montserrat"), "Helvetica Neue", Arial, sans-serif;

	--wd-text-font: var(--vp-font-body);
	--wd-text-font-weight: 400;
	--wd-text-color: var(--vp-body);
	--wd-text-font-size: 15px;
	--wd-title-font: var(--vp-font-head);
	--wd-title-font-weight: 500;
	--wd-title-color: var(--vp-ink);
	--wd-entities-title-font: var(--vp-font-head);
	--wd-entities-title-font-weight: 500;
	--wd-entities-title-color: var(--vp-ink);
	--wd-entities-title-color-hover: var(--vp-gold-text);
	--wd-alternative-font: var(--vp-font-body);
	--wd-widget-title-font: var(--vp-font-body);
	--wd-widget-title-font-weight: 600;
	--wd-widget-title-color: var(--vp-ink);
	--wd-widget-title-font-size: 13px;
	--wd-header-el-font: var(--vp-font-body);
	--wd-primary-color: var(--vp-gold);
	--wd-alternative-color: var(--vp-gold-text);
	--wd-link-color: var(--vp-gold-text);
	--wd-link-color-hover: var(--vp-ink);
	--btn-default-bgcolor: var(--vp-ink);
	--btn-default-bgcolor-hover: #3a322b;
	--btn-default-color: #fff;
	--btn-default-color-hover: #fff;
	--btn-accented-bgcolor: color-mix(in srgb, var(--vp-gold) 94%, #000);
	--btn-accented-bgcolor-hover: var(--vp-gold);
	--btn-accented-color: #1b140b;
	--btn-accented-color-hover: #1b140b;
	--btn-default-brd-radius: 3px;
	--btn-accented-brd-radius: 3px;
	--btn-accented-box-shadow: none;
	--btn-accented-box-shadow-hover: none;
	--wd-brd-radius: 6px;
	--wd-form-brd-radius: 3px;
	--wd-form-brd-width: 1px;
	--wd-form-brd-color: var(--vp-line);
	--wd-form-brd-color-focus: var(--vp-gold);
}

/* Elementor global kit fallback: printed inline by Viento_Site until the Viento colours/fonts are saved
   in Elementor > Site Settings (Tools > Viento Kurulum). */

body {
	color: var(--vp-body);
	font-family: var(--vp-font-body);
	-webkit-font-smoothing: antialiased;
}

/* ---------- One type system inside page content ----------
   Older pages set per-widget fonts (Poppins, Lato, Quicksand, Roboto). Font family only is unified;
   sizes, weights and colours chosen in Elementor stay as they are. */
.wd-content-layout .elementor-widget:not([class*="elementor-widget-viento"]) {
	font-family: var(--vp-font-body) !important;
}

.wd-content-layout :is(h1, h2, h3, h4, h5, h6, .elementor-heading-title, .title, .wd-entities-title, .wd-title):not([class*="vp-"]) {
	font-family: var(--vp-font-head) !important;
	letter-spacing: 0;
}

.wd-content-layout .elementor-widget:not([class*="elementor-widget-viento"]) :is(p, li, span, a, label, input, textarea, select, button):not([class*="fa-"]):not([class*="eicon"]):not([class*="wd-icon"]):not(.elementor-icon) {
	font-family: var(--vp-font-body);
}

/* Text inside a heading (e.g. icon box titles: <h3><span>) follows the heading font */
.wd-content-layout :is(h1, h2, h3, h4, h5, h6, .elementor-heading-title):not([class*="vp-"]) :is(span, a, strong, em) {
	font-family: inherit !important;
}

.wd-content-layout .wd-title-subtitle,
.wd-content-layout .title-subtitle,
.wd-content-layout .elementor-widget-wd_title .title-subtitle {
	color: var(--vp-gold-text) !important;
	font-family: var(--vp-font-body) !important;
	font-weight: 600;
	letter-spacing: .14em;
	text-transform: uppercase;
}

.wd-content-layout a:not(.btn):not(.elementor-button):not([class*="vp-"]):hover {
	color: var(--vp-gold-text);
}

/* ---------- Page title band (was the demo pattern) ---------- */
.wd-page-title {
	position: relative;
	padding-top: clamp(44px, 6vw, 76px);
	padding-bottom: clamp(40px, 5.5vw, 70px);
	background:
		radial-gradient(55% 120% at 85% 0%, rgba(201, 160, 99, .18) 0%, rgba(201, 160, 99, 0) 70%),
		radial-gradient(40% 90% at 0% 100%, rgba(201, 160, 99, .08) 0%, rgba(201, 160, 99, 0) 70%),
		var(--vp-black) !important;
	background-image:
		radial-gradient(55% 120% at 85% 0%, rgba(201, 160, 99, .18) 0%, rgba(201, 160, 99, 0) 70%),
		radial-gradient(40% 90% at 0% 100%, rgba(201, 160, 99, .08) 0%, rgba(201, 160, 99, 0) 70%) !important;
	border-bottom: 1px solid rgba(201, 160, 99, .25);
}

.wd-page-title .wd-page-title-bg,
.wd-page-title .page-title-bg {
	display: none !important;
}

.wd-page-title .title,
.wd-page-title .entry-title {
	color: #fff !important;
	font-family: var(--vp-font-head) !important;
	font-size: clamp(32px, 3.6vw, 52px);
	font-weight: 500;
	line-height: 1.12;
	letter-spacing: 0;
	text-transform: none;
}

.wd-page-title .title::after {
	content: "";
	display: block;
	width: 56px;
	height: 2px;
	margin: 18px auto 0;
	background: linear-gradient(90deg, var(--vp-gold), var(--vp-gold-light));
}

.wd-page-title.title-design-default .title::after,
.wd-page-title.title-design-left .title::after {
	margin-left: 0;
}

.wd-page-title .wd-breadcrumbs,
.wd-page-title .wd-breadcrumbs a {
	color: rgba(255, 255, 255, .62) !important;
	font-family: var(--vp-font-body);
	font-size: 12.5px;
	letter-spacing: .06em;
}

.wd-page-title .wd-breadcrumbs a:hover {
	color: var(--vp-gold-light) !important;
}

.wd-page-title .wd-breadcrumbs .wd-last,
.wd-page-title .wd-breadcrumbs .wd-last * {
	color: var(--vp-gold-light) !important;
	font-weight: 600;
}

.wd-page-title .wd-delimiter::before {
	color: rgba(201, 160, 99, .6);
}

/* ---------- Buttons ---------- */
.wd-content-layout .elementor-button,
.wd-content-layout .btn.btn-color-primary,
.wd-content-layout .btn-style-default.btn-color-black,
.wd-content-layout input[type="submit"],
.wd-content-layout button[type="submit"] {
	border: 1px solid color-mix(in srgb, var(--vp-gold) 94%, #000) !important;
	border-radius: 3px !important;
	background: linear-gradient(180deg, color-mix(in srgb, var(--vp-gold) 80%, #fff) 0%, color-mix(in srgb, var(--vp-gold) 94%, #000) 100%) !important;
	color: #1b140b !important;
	fill: #1b140b !important;
	font-family: var(--vp-font-body) !important;
	font-weight: 600 !important;
	letter-spacing: .02em;
	box-shadow: 0 10px 24px -14px rgba(201, 160, 99, .9);
	transition: transform .25s ease, box-shadow .25s ease, background .25s ease;
}

.wd-content-layout .elementor-button:hover,
.wd-content-layout .btn.btn-color-primary:hover,
.wd-content-layout input[type="submit"]:hover,
.wd-content-layout button[type="submit"]:hover {
	background: linear-gradient(180deg, color-mix(in srgb, var(--vp-gold) 70%, #fff) 0%, var(--vp-gold) 100%) !important;
	color: #1b140b !important;
	transform: translateY(-2px);
}

.wd-content-layout .elementor-button .elementor-button-icon svg {
	fill: currentColor;
}

/* ---------- Icon boxes / icons from old pages ---------- */
.wd-content-layout .elementor-view-stacked .elementor-icon {
	background-color: var(--vp-ink) !important;
	color: var(--vp-gold) !important;
	fill: var(--vp-gold) !important;
}

.wd-content-layout .elementor-view-stacked .elementor-icon svg {
	fill: var(--vp-gold) !important;
}

.wd-content-layout .elementor-view-framed .elementor-icon,
.wd-content-layout .elementor-view-default .elementor-icon {
	border-color: var(--vp-gold) !important;
	color: var(--vp-gold-text) !important;
	fill: var(--vp-gold-text) !important;
}

.wd-content-layout .elementor-icon-box-title,
.wd-content-layout .elementor-icon-box-title a {
	color: var(--vp-ink) !important;
}

.wd-content-layout .elementor-icon-box-description {
	color: var(--vp-muted) !important;
}

/* Carousel / slider dots and arrows */
.wd-content-layout .swiper-pagination-bullet-active,
.wd-content-layout .wd-nav-pagin li .active,
.wd-content-layout .elementor-swiper-button {
	background-color: var(--vp-gold) !important;
}

.wd-content-layout .elementor-swiper-button {
	color: #1b140b !important;
}

/* ---------- Forms (CF7, Mailchimp, search) ---------- */
.wd-content-layout :is(input[type="text"], input[type="email"], input[type="tel"], input[type="url"], input[type="number"], input[type="search"], textarea, select) {
	border: 1px solid var(--vp-line);
	border-radius: 3px;
	background: #fff;
	color: var(--vp-ink);
	font-family: var(--vp-font-body);
}

.wd-content-layout :is(input, textarea, select):focus {
	border-color: var(--vp-gold);
	box-shadow: 0 0 0 3px rgba(201, 160, 99, .18);
	outline: none;
}

/* ---------- Blog ---------- */
.wd-post .wd-entities-title a,
.blog-design-masonry .wd-entities-title a,
.post-title a {
	font-family: var(--vp-font-head);
	color: var(--vp-ink);
}

.wd-post .wd-entities-title a:hover {
	color: var(--vp-gold-text);
}

.wd-post-cat,
.wd-post-cat a,
.meta-post-categories a {
	background: var(--vp-gold) !important;
	color: #1b140b !important;
}

.wd-post .wd-post-date,
.wd-post .post-date {
	background: var(--vp-ink);
	color: #fff;
}

.wd-post .wd-post-date .post-date-day,
.wd-post .post-date .post-date-day {
	color: var(--vp-gold-light);
}

/* ---------- Footer (was navy) ---------- */
.wd-footer.footer-container,
.wd-footer {
	background-color: var(--vp-black) !important;
	background-image: radial-gradient(45% 80% at 100% 0%, rgba(201, 160, 99, .1) 0%, rgba(201, 160, 99, 0) 70%) !important;
	border-top: 1px solid rgba(201, 160, 99, .3);
	color: rgba(255, 255, 255, .7);
}

.wd-footer .main-footer {
	padding-top: clamp(44px, 5vw, 64px);
	padding-bottom: 18px;
}

.wd-footer :is(.widget-title, .elementor-heading-title, h1, h2, h3, h4, h5, h6) {
	color: var(--vp-gold-light) !important;
	font-family: var(--vp-font-body) !important;
	font-size: 12.5px !important;
	font-weight: 600 !important;
	letter-spacing: .16em !important;
	text-transform: uppercase !important;
}

.wd-footer,
.wd-footer :is(p, li, span, a, .elementor-widget) {
	font-family: var(--vp-font-body) !important;
}

.wd-footer a {
	color: rgba(255, 255, 255, .72) !important;
	transition: color .25s ease;
}

.wd-footer a:hover,
.wd-footer .current-menu-item > a {
	color: var(--vp-gold-light) !important;
}

.wd-footer .wd-entities-title a,
.wd-footer .recent-posts-title a {
	color: #fff !important;
	font-family: var(--vp-font-head) !important;
	font-size: 15px;
	font-weight: 500;
}

/* Comment counts in the recent-posts widget (comments are not used; the string is untranslated) */
.wd-footer .recent-posts-comment {
	display: none !important;
}

.wd-footer .wd-list img,
.wd-footer .list-icon img {
	filter: sepia(1) saturate(2.4) hue-rotate(-12deg) brightness(.95);
	opacity: .9;
}

.wd-copyrights {
	background: #0b0a09 !important;
	border-top: 1px solid rgba(201, 160, 99, .18) !important;
	color: rgba(255, 255, 255, .55) !important;
	font-family: var(--vp-font-body);
	font-size: 13px;
}

.wd-copyrights strong {
	color: var(--vp-gold-light);
	font-weight: 600;
}

/* ---------- Small UI ---------- */
.scrollToTop,
.wd-scroll-top {
	border: 1px solid rgba(201, 160, 99, .6) !important;
	background: #fff !important;
	color: var(--vp-ink) !important;
}

.scrollToTop:hover,
.wd-scroll-top:hover {
	background: var(--vp-gold) !important;
	color: #1b140b !important;
}

::selection {
	background: rgba(201, 160, 99, .35);
	color: var(--vp-ink);
}

/* ---------- RTL (Arabic) ----------
   Latin words keep the brand fonts, Arabic glyphs use Amiri (headings) / Tajawal (text). */
html[dir="rtl"] body {
	--vp-font-head: var(--e-global-typography-vp_head-font-family, "Playfair Display"), "Amiri", Georgia, serif;
	--vp-font-body: var(--e-global-typography-vp_body-font-family, "Montserrat"), "Tajawal", Tahoma, Arial, sans-serif;
}

/* Arabic is cursive: letter spacing breaks the joins */
html[dir="rtl"] :is(.wd-page-title .title, .wd-page-title .wd-breadcrumbs, .wd-footer .widget-title, .wd-footer h5, .wd-content-layout .title-subtitle, .wd-content-layout .elementor-button) {
	letter-spacing: 0 !important;
}

html[dir="rtl"] .wd-page-title .title {
	line-height: 1.35;
}

html[dir="rtl"] .wd-page-title.title-design-default .title::after,
html[dir="rtl"] .wd-page-title.title-design-left .title::after {
	margin-right: 0;
	margin-left: auto;
}
