/*
 * UNITO: Arabic / right-to-left layer. Loaded only on RTL pages (TranslatePress Arabic, or the RTL preview).
 *
 * 1) Arabic glyphs come from Tajawal (SIL OFL, fonts/README.txt). Latin text (UNITO, style codes, sizes,
 *    numbers) keeps Manrope and Marcellus: Tajawal is the next family in every font stack, and is also
 *    attached to the two brand families through unicode-range for elements that name them directly.
 * 2) Arabic type scale: Arabic letters are taller and never tracked, so the Latin line-heights and
 *    letter-spacing are reset for RTL only.
 * 3) Mirroring WoodMart does not do on a translated site (the pages are authored in English).
 */

/* ---------- 1. Fonts ---------- */
@font-face { font-family: "Tajawal"; font-style: normal; font-weight: 100 400; font-display: swap; src: url("fonts/tajawal-400-arabic.woff2") format("woff2"); unicode-range: U+0600-06FF, U+0750-077F, U+0870-088E, U+0890-0891, U+0897-08E1, U+08E3-08FF, U+200C-200E, U+204F, U+2E41, U+FB50-FDFF, U+FE70-FE74, U+FE76-FEFC; }
@font-face { font-family: "Tajawal"; font-style: normal; font-weight: 500; font-display: swap; src: url("fonts/tajawal-500-arabic.woff2") format("woff2"); unicode-range: U+0600-06FF, U+0750-077F, U+0870-088E, U+0890-0891, U+0897-08E1, U+08E3-08FF, U+200C-200E, U+204F, U+2E41, U+FB50-FDFF, U+FE70-FE74, U+FE76-FEFC; }
@font-face { font-family: "Tajawal"; font-style: normal; font-weight: 600 900; font-display: swap; src: url("fonts/tajawal-700-arabic.woff2") format("woff2"); unicode-range: U+0600-06FF, U+0750-077F, U+0870-088E, U+0890-0891, U+0897-08E1, U+08E3-08FF, U+200C-200E, U+204F, U+2E41, U+FB50-FDFF, U+FE70-FE74, U+FE76-FEFC; }
/* Display headings are set in Marcellus 400; Arabic needs a medium weight to hold the same presence. */
@font-face { font-family: "Tajawal Display"; font-style: normal; font-weight: 100 500; font-display: swap; src: url("fonts/tajawal-500-arabic.woff2") format("woff2"); unicode-range: U+0600-06FF, U+0750-077F, U+0870-088E, U+0890-0891, U+0897-08E1, U+08E3-08FF, U+200C-200E, U+204F, U+2E41, U+FB50-FDFF, U+FE70-FE74, U+FE76-FEFC; }
@font-face { font-family: "Tajawal Display"; font-style: normal; font-weight: 600 900; font-display: swap; src: url("fonts/tajawal-700-arabic.woff2") format("woff2"); unicode-range: U+0600-06FF, U+0750-077F, U+0870-088E, U+0890-0891, U+0897-08E1, U+08E3-08FF, U+200C-200E, U+204F, U+2E41, U+FB50-FDFF, U+FE70-FE74, U+FE76-FEFC; }
@font-face { font-family: "Manrope"; font-style: normal; font-weight: 200 400; font-display: swap; src: url("fonts/tajawal-400-arabic.woff2") format("woff2"); unicode-range: U+0600-06FF, U+0750-077F, U+0870-088E, U+0890-0891, U+0897-08E1, U+08E3-08FF, U+200C-200E, U+204F, U+2E41, U+FB50-FDFF, U+FE70-FE74, U+FE76-FEFC; }
@font-face { font-family: "Manrope"; font-style: normal; font-weight: 500; font-display: swap; src: url("fonts/tajawal-500-arabic.woff2") format("woff2"); unicode-range: U+0600-06FF, U+0750-077F, U+0870-088E, U+0890-0891, U+0897-08E1, U+08E3-08FF, U+200C-200E, U+204F, U+2E41, U+FB50-FDFF, U+FE70-FE74, U+FE76-FEFC; }
@font-face { font-family: "Manrope"; font-style: normal; font-weight: 600 800; font-display: swap; src: url("fonts/tajawal-700-arabic.woff2") format("woff2"); unicode-range: U+0600-06FF, U+0750-077F, U+0870-088E, U+0890-0891, U+0897-08E1, U+08E3-08FF, U+200C-200E, U+204F, U+2E41, U+FB50-FDFF, U+FE70-FE74, U+FE76-FEFC; }
@font-face { font-family: "Marcellus"; font-style: normal; font-weight: 400; font-display: swap; src: url("fonts/tajawal-500-arabic.woff2") format("woff2"); unicode-range: U+0600-06FF, U+0750-077F, U+0870-088E, U+0890-0891, U+0897-08E1, U+08E3-08FF, U+200C-200E, U+204F, U+2E41, U+FB50-FDFF, U+FE70-FE74, U+FE76-FEFC; }
@font-face { font-family: "Marcellus"; font-style: normal; font-weight: 500 900; font-display: swap; src: url("fonts/tajawal-700-arabic.woff2") format("woff2"); unicode-range: U+0600-06FF, U+0750-077F, U+0870-088E, U+0890-0891, U+0897-08E1, U+08E3-08FF, U+200C-200E, U+204F, U+2E41, U+FB50-FDFF, U+FE70-FE74, U+FE76-FEFC; }

html[dir="rtl"] {
	--unito-ar-text: "Manrope", "Tajawal", Arial, Helvetica, sans-serif;
	--unito-ar-display: "Marcellus", "Tajawal Display", "Tajawal", Arial, Helvetica, sans-serif;
	--wd-text-font: var(--unito-ar-text);
	--wd-title-font: var(--unito-ar-display);
	--wd-entities-title-font: var(--unito-ar-text);
	--wd-alternative-font: var(--unito-ar-text);
	--wd-widget-title-font: var(--unito-ar-text);
	--wd-header-el-font: var(--unito-ar-text);
}
html[dir="rtl"] body[class*="elementor-kit-"] {
	--e-global-typography-unito_display-font-family: "Marcellus", "Tajawal Display", "Tajawal";
	--e-global-typography-unito_h2-font-family: "Marcellus", "Tajawal Display", "Tajawal";
	--e-global-typography-unito_body-font-family: "Manrope", "Tajawal";
	--e-global-typography-unito_eyebrow-font-family: "Manrope", "Tajawal";
	--e-global-typography-unito_button-font-family: "Manrope", "Tajawal";
}
html[dir="rtl"] input, html[dir="rtl"] select, html[dir="rtl"] textarea, html[dir="rtl"] button { font-family: var(--unito-ar-text); }

/* ---------- 2. Arabic type scale ---------- */
html[dir="rtl"] body[class*="elementor-kit-"] {
	--e-global-typography-unito_eyebrow-letter-spacing: 0;
	--e-global-typography-unito_button-letter-spacing: 0;
	--e-global-typography-unito_display-letter-spacing: 0;
	--e-global-typography-unito_h2-letter-spacing: 0;
	--e-global-typography-unito_display-line-height: 1.45em;
	--e-global-typography-unito_h2-line-height: 1.45em;
}
html[dir="rtl"] body { letter-spacing: 0; }
/* !important: widget typography is emitted with four classes and would win otherwise. */
html[dir="rtl"] :is(h1, h2, h3, .woodmart-title-container, .wd-empty-block-title, .wd-entities-title, .title) { line-height: 1.45 !important; letter-spacing: 0 !important; }
html[dir="rtl"] :is(h4, h5, h6, .btn, .button, .title-subtitle) { letter-spacing: 0 !important; }
html[dir="rtl"] :is(h4, h5, h6) { line-height: 1.55 !important; }

/* ---------- 3. Mirroring ---------- */
/* WoodMart keeps an explicit "left" physical in RTL. On pages written in English "left" means "start".
   Only inside Elementor content: WoodMart's own templates (product summary) already swap the class in PHP. */
html[dir="rtl"] .elementor-element .text-left { --text-align: right; --content-align: flex-start; --wd-align: flex-start; }
html[dir="rtl"] .elementor-element .text-right { --text-align: left; --content-align: flex-end; --wd-align: flex-end; }
/* The burger moves to the right in RTL, but the menu drawer still slid in from the left. */
html[dir="rtl"] .mobile-nav.wd-side-hidden.wd-left { left: auto; right: 0; transform: translate3d(100%, 0, 0); }
html[dir="rtl"] .mobile-nav.wd-side-hidden.wd-left.wd-opened { transform: none; }
/* Phone numbers, codes and emails are typed left-to-right but sit on the Arabic side of the field. */
html[dir="rtl"] :is(input, textarea)[dir="ltr"] { text-align: right; }
