/*
 Theme Name:   Woodmart Child
 Description:  Woodmart Child Theme
 Author:       XTemos
 Author URI:   http://xtemos.com
 Template:     woodmart
 Version:      1.0.0
 Text Domain:  woodmart
*/
:root {
	--wd-text-font: "Cabin", Arial, Helvetica, sans-serif;
	--wd-text-font-weight: 400;
	--wd-text-color: rgb(56,56,56);
	--wd-text-font-size: 14px;
	--wd-title-font: "Poppins", Arial, Helvetica, sans-serif;
	--wd-title-font-weight: 600;
	--wd-title-color: rgb(30,30,30);
	--wd-entities-title-font: "Poppins", Arial, Helvetica, sans-serif;
	--wd-entities-title-font-weight: 500;
	--wd-entities-title-color: #333333;
	--wd-entities-title-color-hover: rgb(51 51 51 / 65%);
	--wd-alternative-font: "Lato", Arial, Helvetica, sans-serif;
	--wd-widget-title-font: "Poppins", Arial, Helvetica, sans-serif;
	--wd-widget-title-font-weight: 600;
	--wd-widget-title-transform: uppercase;
	--wd-widget-title-color: #333;
	--wd-widget-title-font-size: 16px;
	--wd-header-el-font: "Cabin", Arial, Helvetica, sans-serif;
	--wd-header-el-font-weight: 700;
	--wd-header-el-transform: uppercase;
	--wd-header-el-font-size: 13px;
	--wd-otl-style: dotted;
	--wd-otl-width: 2px;
	--wd-primary-color: rgb(233,45,116);
	--wd-alternative-color: #fbbc34;
	--btn-default-bgcolor: #f7f7f7;
	--btn-default-bgcolor-hover: #efefef;
	--btn-accented-bgcolor: rgb(233,45,116);
	--btn-accented-bgcolor-hover: rgb(210,39,106);
	--wd-form-brd-width: 2px;
	--notices-success-bg: #459647;
	--notices-success-color: #fff;
	--notices-warning-bg: #E0B252;
	--notices-warning-color: #fff;
	--wd-link-color: #333333;
	--wd-link-color-hover: #242424;
	--wd-sticky-btn-height: 60px;
}
.wd-age-verify-wrap {
	--wd-popup-width: 500px;
}
.wd-popup.wd-promo-popup {
	background-image: none;
	background-repeat: no-repeat;
	background-size: cover;
	background-position: center center;
}
.wd-promo-popup-wrap {
	--wd-popup-width: 750px;
	--wd-popup-padding: 15px;
}
:is(.woodmart-woocommerce-layered-nav, .wd-product-category-filter) .wd-scroll-content {
	max-height: 223px;
}
.wd-page-title .wd-page-title-bg img {
	object-fit: cover;
	object-position: center center;
}
.wd-footer {
	background-color: rgb(26,26,26);
	background-image: none;
}
.mfp-wrap.wd-popup-quick-view-wrap {
	--wd-popup-width: 920px;
}

@media (max-width: 1024px) {
	:root {
		--wd-sticky-btn-height: 95px;
	}

}

@media (max-width: 768.98px) {
	:root {
		--wd-sticky-btn-height: 42px;
	}

}
:root{
--wd-container-w: 1222px;
--wd-form-brd-radius: 30px;
--btn-default-color: #333;
--btn-default-color-hover: #333;
--btn-accented-color: #fff;
--btn-accented-color-hover: #fff;
--btn-default-brd-radius: 35px;
--btn-default-box-shadow: none;
--btn-default-box-shadow-hover: none;
--btn-accented-brd-radius: 35px;
--btn-accented-box-shadow: none;
--btn-accented-box-shadow-hover: none;
--wd-brd-radius: 12px;
--wd-cat-brd-radius: 8px;
}

@media (min-width: 1222px) {
section.elementor-section.wd-section-stretch > .elementor-container {
margin-left: auto;
margin-right: auto;
}
}


.wd-page-title {
background-color: rgb(153,153,153);
}

html[dir="rtl"] .elementor-widget-wd_title .title-wrapper.text-left,
html[dir="rtl"] .elementor-widget-wd_title .title-wrapper.text-left .woodmart-title-container,
html[dir="rtl"] .elementor-widget-wd_title .title-wrapper.text-left .title-subtitle,
html[dir="rtl"] .elementor-widget-wd_title .title-wrapper.text-left .title-after_title,
html[dir="rtl"] .elementor-widget-heading.elementor-align-left .elementor-heading-title {
  direction: rtl;
  text-align: right !important;
}

html[lang^="fr"] #slider-143 .elementor-widget-wd_title .woodmart-title-container {
  font-size: 50px !important;
  line-height: 1.15 !important;
}

@media (max-width: 1024px) {
  html[lang^="fr"] #slider-143 .elementor-widget-wd_title .woodmart-title-container {
    font-size: 44px !important;
  }
}

@media (max-width: 768px) {
  html[lang^="fr"] #slider-143 .elementor-widget-wd_title .woodmart-title-container {
    font-size: 36px !important;
  }
}

/* Arabic footer RTL alignment */
html[dir="rtl"] .footer-container .text-left {
  direction: rtl;
  text-align: right !important;
}

html[dir="rtl"] .footer-container .wd-list.text-left > li {
  justify-content: flex-start !important;
}

/* R-01 Arabic: mirror WoodMart "left" alignment copied from the English Elementor sources
   (text blocks, info boxes, buttons, product title/description/add-to-cart, breadcrumbs, footer social icons) */
html[dir="rtl"] .elementor .text-left {
  --text-align: right;
  --content-align: flex-start;
  --wd-align: flex-start;
  text-align: right;
}
html[dir="rtl"] .elementor .wd-text-block:not(.inline-element).text-left {
  margin-right: 0;
  margin-left: auto;
}

/* R-02 Arabic: mobile menu and shop filter panel slide in from the right (their triggers are on the right) */
html[dir="rtl"] .mobile-nav.wd-side-hidden.wd-left,
html[dir="rtl"] .wd-side-hidden.wd-left[class*="wd-col-offcanvas"] {
  left: auto;
  right: 0;
  transform: translate3d(100%, 0, 0);
}
html[dir="rtl"] .mobile-nav.wd-side-hidden.wd-left.wd-opened,
html[dir="rtl"] .wd-side-hidden.wd-left.wd-opened[class*="wd-col-offcanvas"] {
  transform: none;
}

/* R-03 Arabic: keep the Latin chat timestamp in LTR order inside the RTL floating widget */
html[dir="rtl"] .e-contact-buttons__message-bubble-time {
  direction: ltr;
  unicode-bidi: isolate;
  text-align: left;
}

/* R-04 Arabic: mirror WooCommerce pagination arrows (next must point left) */
html[dir="rtl"] .woocommerce-pagination .page-numbers .next,
html[dir="rtl"] .woocommerce-pagination .page-numbers .prev {
  display: inline-flex;
  transform: scaleX(-1);
}

/* R-05 Arabic: collapsed sub-menu chevrons point toward the reading direction */
html[dir="rtl"] .wd-nav-opener:not(.wd-active)::after {
  transform: scaleX(-1);
}

/* WhatsApp floating block (WoodMart floating block 51821, container class yp-whatsapp-fb):
   green pill, small "Contact us" label, larger WhatsApp icon. Colours and hover come from the widget. */
.yp-whatsapp-fb .wd-button-wrapper a.btn {
  gap: 8px;
  padding-inline: 18px 20px;
  box-shadow: 4px 4px 10px rgba(0, 0, 0, 0.15);
}
.yp-whatsapp-fb .wd-button-wrapper a.btn .wd-btn-icon svg {
  width: 26px;
  height: 26px;
  fill: currentColor;
}
/* Arabic: scroll-to-top sits bottom-left in RTL, so the WhatsApp button moves bottom-right */
html[dir="rtl"] .wd-fb-holder:has(.yp-whatsapp-fb) {
  --wd-justify-content: right !important;
}

/* WoodMart prints every language copy of a floating block on every language (no WPML filter on its query).
   Show only the copy that matches the page language: EN 51821, AR 51829, FR 51831. */
html:not([lang^="ar"]) #wd-fb-51829,
html:not([lang^="fr"]) #wd-fb-51831,
html[lang^="ar"] #wd-fb-51821,
html[lang^="fr"] #wd-fb-51821 {
  display: none !important;
}

/* FAQ accordions in Arabic (WoodMart wd_accordion: Contact FAQ, product-page FAQ block, FAQs Template).
   WoodMart's RTL accordion CSS keeps "left"/"right" physical, and WPML copies the English values,
   so Arabic titles sat on the left. Mirror them: titles start on the right, the opener moves to the mirrored side. */
html[dir="rtl"] .wd-accordion.wd-titles-left > .wd-accordion-item > .wd-accordion-title > div {
  justify-content: flex-start;
}
html[dir="rtl"] .wd-accordion.wd-titles-right > .wd-accordion-item > .wd-accordion-title > div {
  justify-content: flex-end;
}
html[dir="rtl"] .wd-accordion.wd-opener-pos-left > .wd-accordion-item > .wd-accordion-title {
  flex-direction: row-reverse;
}
html[dir="rtl"] .wd-accordion.wd-opener-pos-right > .wd-accordion-item > .wd-accordion-title {
  flex-direction: row;
}

/* Contact page FAQ columns (containers 243be280 / 7d2946d5, desktop only): Elementor keeps padding and borders
   physical in RTL, so the divider and the 50px gutters sat on the outer edges. Put them back between the columns. */
@media (min-width: 1025px) {
  html[dir="rtl"] .elementor-element.elementor-element-243be280 {
    --padding-left: 50px;
    --padding-right: 0px;
    border-width: 0 0 0 1px;
  }
  html[dir="rtl"] .elementor-element.elementor-element-7d2946d5 {
    --padding-left: 0px;
    --padding-right: 50px;
  }
}

/* Contact page RTL + Arabic fonts (2026-10-03). WPML copies the English Elementor/WoodMart controls into Arabic,
   and Elementor/WoodMart keep "left"/"right" physical in RTL. Mirror them so Arabic is the reflection of English. */

/* Contact page top section (form column 22ccc6e2 / contact-details column 7444a9c6): Elementor keeps container
   padding and borders physical in RTL, so the divider sat on the outer right edge and the 40px gutters on the
   outer edges (0px between the columns). Same pattern as the Contact FAQ column rule above. Per element: a global
   container mirror was tested and rejected (it pushes the Arabic footer column off-screen at 1025-1250px). */
html[dir="rtl"] .elementor-element.elementor-element-22ccc6e2 {
  border-width: 0 0 0 1px;
}
@media (min-width: 1025px) {
  html[dir="rtl"] .elementor-element.elementor-element-22ccc6e2 {
    --padding-left: 40px;
    --padding-right: 0px;
  }
  html[dir="rtl"] .elementor-element.elementor-element-7444a9c6 {
    --padding-left: 0px;
    --padding-right: 40px;
  }
}

/* WoodMart "bordered" section titles: the RTL stylesheet keeps the title on the physical left (row-reverse).
   Start the title on the right and run the line to the left, with the 20px gap kept next to the title. */
html[dir="rtl"] .wd-title-style-bordered .liner-continer {
  flex-direction: row;
}
html[dir="rtl"] .wd-title-style-bordered .liner-continer::before {
  margin-right: 0;
  margin-left: 20px;
}
html[dir="rtl"] .wd-title-style-bordered .liner-continer::after {
  margin-left: 0;
  margin-right: 20px;
}

/* WoodMart info boxes with the icon/number beside the text: put it first in reading order (right). */
html[dir="rtl"] .wd-info-box.box-icon-align-left {
  flex-direction: row;
}
html[dir="rtl"] .wd-info-box.box-icon-align-right {
  flex-direction: row-reverse;
}

/* Widget-level borders, margins and legacy column padding (no logical variables): mirror per element. */
@media (min-width: 769px) {
  html[dir="rtl"] .elementor-element.elementor-element-4da0cc2 > .elementor-widget-container,
  html[dir="rtl"] .elementor-element.elementor-element-384fd18 > .elementor-widget-container {
    border-width: 0 0 0 1px;
  }
}
@media (min-width: 1025px) {
  html[dir="rtl"] .elementor-element.elementor-element-96e8a2b > .elementor-widget-container {
    border-width: 0 0 0 1px;
  }
  html[dir="rtl"] .elementor-element.elementor-element-7d9e5fe > .elementor-element-populated {
    padding: 0% 20% 0% 0%;
  }
}
html[dir="rtl"] .elementor-element.elementor-element-6105394b > .elementor-widget-container {
  margin: 0 10px 0 0;
}
html[dir="rtl"] .elementor-element.elementor-element-57c9fa43 > .elementor-widget-container {
  margin: 0 0 0 15px;
}

/* Arabic text in custom Latin-only fonts copied from English (Lato, Roboto, hkgroteskpro, Dancing Script):
   add the theme's own fallback chain so Arabic renders in the same font as the surrounding Arabic text. Size/weight unchanged. */
html[lang^="ar"] .elementor-element.elementor-element-7dd46301 .wd-accordion-title-text,
html[lang^="ar"] .elementor-element.elementor-element-2205eaa1 .wd-accordion-title-text {
  font-family: Lato, Arial, Helvetica, sans-serif;
}
html[lang^="ar"] .elementor-element.elementor-element-72262abb .title-subtitle {
  font-family: Roboto, Arial, Helvetica, sans-serif;
}
html[lang^="ar"] .elementor-element.elementor-element-201bd78d .title-subtitle,
html[lang^="ar"] .elementor-element.elementor-element-201bd78d .title,
html[lang^="ar"] .elementor-element.elementor-element-52fb0e28 .info-box-title {
  font-family: hkgroteskpro, Arial, Helvetica, sans-serif;
}
html[lang^="ar"] .elementor-element.elementor-element-5af6f7a6 .title-subtitle {
  font-family: "Dancing Script", Arial, Helvetica, sans-serif;
}
