/**
 * Jantel Child – main styles (font + small brand-safe tweaks).
 * Applied for both LTR and RTL; RTL layout fixes live in ../rtl.css
 */

/* ---------------------------------------------------------------------------
 * 1) Cairo font application (Arabic UI)
 * ------------------------------------------------------------------------- */

/* Body base font when Arabic locale is active (html[lang="ar"]) */
html[lang="ar"] body,
html[lang="ar"] button,
html[lang="ar"] input,
html[lang="ar"] select,
html[lang="ar"] textarea,
html[lang="ar"] .pxl-menu-primary > li > a,
html[lang="ar"] .pxl-nav-menu .pxl-menu-primary li a,
html[lang="ar"] .elementor-widget-text-editor,
html[lang="ar"] .elementor-widget-heading .elementor-heading-title,
html[lang="ar"] .price,
html[lang="ar"] .price amount,
html[lang="ar"] .woocommerce-Price-amount {
	font-family: 'Cairo', 'Montserrat', -apple-system, 'Segoe UI', Tahoma, Arial, sans-serif !important;
}

/*
 * Beat parent style.css Fahkwang !important list (page title, entry-title,
 * submit buttons, etc.) without using * { font-family }.
 * Icon fonts kept intact via :not() exclusions below.
 */
html[lang="ar"] body.jantel-child #pxl-page-title-default .pxl-page-title,
html[lang="ar"] body.jantel-child.single-product #primary div.product .entry-summary .product_title,
html[lang="ar"] body.jantel-child.single-product #primary div.product .entry-summary .entry-title,
html[lang="ar"] body.jantel-child.single-product #primary div.product .entry-summary h1,
html[lang="ar"] body.jantel-child .woocommerce ul.products li.product .woocommerce-loop-product__title,
html[lang="ar"] body.jantel-child .woocommerce ul.products li.product .woocommerce-product--title,
html[lang="ar"] body.jantel-child .woocommerce ul.products li.product .woocommerce-product--title a,
html[lang="ar"] body.jantel-child .woocommerce .woocommerce-product-inner .woocommerce-product--title,
html[lang="ar"] body.jantel-child .woocommerce .woocommerce-product-inner .woocommerce-product--title a,
html[lang="ar"] body.jantel-child .pxl-product-grid .woocommerce-product--title,
html[lang="ar"] body.jantel-child .pxl-product-grid .woocommerce-product--title a,
html[lang="ar"] body.jantel-child .pxl-product-carousel .woocommerce-product--title,
html[lang="ar"] body.jantel-child .pxl-product-carousel .woocommerce-product--title a,
html[lang="ar"] body.jantel-child .woocommerce div.product .product_title,
html[lang="ar"] body.jantel-child h1.product_title,
html[lang="ar"] body.jantel-child .woocommerce-tabs .tabs li a,
html[lang="ar"] body.jantel-child .woocommerce-Reviews-title,
html[lang="ar"] body.jantel-child .comment-reply-title,
html[lang="ar"] body.jantel-child .comment-form label,
html[lang="ar"] body.jantel-child .comment-form input[type="text"],
html[lang="ar"] body.jantel-child .comment-form input[type="email"],
html[lang="ar"] body.jantel-child .comment-form textarea,
html[lang="ar"] body.jantel-child .comment-form .form-submit .submit,
html[lang="ar"] body.jantel-child.single-product button:not(.rm-style-default):not([class*="caseicon"]):not([class*="flaticon"]),
html[lang="ar"] body.jantel-child.single-product .button,
html[lang="ar"] body.jantel-child.single-product input[type="submit"],
html[lang="ar"] body.jantel-child .btn .pxl--btn-text,
html[lang="ar"] body.jantel-child .single-product section.related h2,
html[lang="ar"] body.jantel-child .jump-to-tab,
html[lang="ar"] body.jantel-child .product_meta,
html[lang="ar"] body.jantel-child .woocommerce-sg-product-excerpt,
html[lang="ar"] body.jantel-child .woocommerce-Tabs-panel {
	font-family: 'Cairo', Tahoma, Arial, sans-serif !important;
}

/* Keep icon font families on icon glyphs */
html[lang="ar"] body.jantel-child [class*="caseicon-"],
html[lang="ar"] body.jantel-child [class*="flaticon-"],
html[lang="ar"] body.jantel-child [class^="pxli-"],
html[lang="ar"] body.jantel-child i.caseicon-facebook,
html[lang="ar"] body.jantel-child i.caseicon-twitter,
html[lang="ar"] body.jantel-child i.caseicon-linkedin {
	font-family: 'caseicon', 'pxli', 'Flaticon', sans-serif !important;
}

/* Line-height tuning for Arabic script (Arabic needs slightly more leading) */
html[lang="ar"] body {
	line-height: 1.8;
}

html[lang="ar"] h1, html[lang="ar"] h2, html[lang="ar"] h3,
html[lang="ar"] h4, html[lang="ar"] h5, html[lang="ar"] h6,
html[lang="ar"] .elementor-heading-title {
	line-height: 1.5 !important;
}

/* ---------------------------------------------------------------------------
 * 2) LTR islands – keep codes, emails, numbers readable inside RTL text
 * ------------------------------------------------------------------------- */

/* Postal codes / coupon codes / SKUs / emails inside RTL context */
html[lang="ar"] .sku,
html[lang="ar"] .woocommerce-MyAccount-content code,
html[lang="ar"] .coupon .input-text,
html[lang="ar"] #coupon_code,
html[lang="ar"] .pxl-coupon-code,
html[lang="ar"] .woocommerce-table__product-name .variation code {
	direction: ltr;
	unicode-bidi: embed;
	text-align: right; /* keep alignment with surrounding RTL text */
}

/* Phone numbers in contact widgets: LTR digits but right aligned */
html[lang="ar"] .pxl-contact-info .pxl-phone,
html[lang="ar"] a[href^="tel:"] {
	direction: ltr;
	unicode-bidi: embed;
	display: inline-block;
}

/* Prices: keep numeric part in one run (WC renders with currency symbol) */
html[lang="ar"] .price,
html[lang="ar"] .woocommerce-Price-amount {
	unicode-bidi: plaintext;
}

/* Checkout/order numbers */
html[lang="ar"] .woocommerce-order-overview__order order,
html[lang="ar"] .woocommerce-order-details .order-again ~ p strong {
	unicode-bidi: plaintext;
}

/* ---------------------------------------------------------------------------
 * 3) Elementor Arabic font inheritance – headings set to Latin fonts by kit
 *    will fall back to Cairo for Arabic glyphs automatically. Force key
 *    client-facing elements to render Arabic via Cairo:
 * ------------------------------------------------------------------------- */
html[lang="ar"] .elementor-widget-heading .elementor-heading-title,
html[lang="ar"] .pxl-heading .pxl-item--title,
html[lang="ar"] .pxl-post-grid .pxl-post-title,
html[lang="ar"] .pxl-fancy-box .pxl-item--title,
html[lang="ar"] .pxl-icon-box .pxl-item--title {
	font-family: 'Cairo', 'GT Walsheim Pro', sans-serif !important;
}

/* Elementor global typography uses CSS vars in newer versions */
html[lang="ar"] body {
	--e-global-typography-primary-font-family: 'Cairo', sans-serif;
	--e-global-typography-secondary-font-family: 'Cairo', sans-serif;
	--e-global-typography-text-font-family: 'Cairo', sans-serif;
	--e-global-typography-accent-font-family: 'Cairo', sans-serif;
}

/* ---------------------------------------------------------------------------
 * 4) Small brand-safe tweaks (no color/layout redesign – that is phase 2)
 * ------------------------------------------------------------------------- */

/* Keep product images un-mirrored in RTL (never flip product imagery) */
html[lang="ar"] img,
html[lang="ar"] .wp-post-image,
html[lang="ar"] .woocommerce-product-gallery__image {
	transform: none !important;
}