/** * Compact EN | AR language switcher in ThemeREX / Elementor header. */ .top_panel .storypath-lang-switcher, .sc_layouts_item .storypath-lang-switcher, .elementor-shortcode .storypath-lang-switcher { display: inline-flex; align-items: center; vertical-align: middle; margin-left: 10px; line-height: 1.2; white-space: nowrap; } .storypath-lang-switcher .storypath-lang-item, .storypath-lang-switcher .storypath-lang-sep { display: inline-block; font-size: inherit; line-height: 1.2; } .storypath-lang-switcher .storypath-lang-item { padding: 4px 2px; text-decoration: none; color: inherit; transition: color 0.2s ease; } .storypath-lang-switcher a.storypath-lang-item:hover, .storypath-lang-switcher a.storypath-lang-item:focus { color: #fc20af; text-decoration: none; } .storypath-lang-switcher .storypath-lang-item.is-current { font-weight: 600; color: #171717; cursor: default; } .storypath-lang-switcher .storypath-lang-sep { padding: 0 4px; color: #999; font-weight: 400; user-select: none; } /* -------------------------------------------------------------------------- Arabic header: keep the same layout as English (logo left, menu right). Polylang sets dir=rtl on , which mirrors everything — we override that for the header only. Page body content below stays RTL. -------------------------------------------------------------------------- */ html[dir="rtl"] .top_panel, body.rtl .top_panel { direction: ltr; } /* Arabic labels still read right-to-left inside the unchanged header positions. */ html[dir="rtl"] .top_panel .sc_layouts_menu_nav, body.rtl .top_panel .sc_layouts_menu_nav { direction: rtl; } html[dir="rtl"] .top_panel .sc_layouts_login_details, body.rtl .top_panel .sc_layouts_login_details { direction: rtl; white-space: nowrap; } /* Phone numbers must stay LTR even when surrounded by Arabic UI text. */ html[dir="rtl"] .top_panel .top-bar-phone-number .sc_layouts_iconed_text_line2, body.rtl .top_panel .top-bar-phone-number .sc_layouts_iconed_text_line2 { direction: ltr; unicode-bidi: embed; display: inline-block; } /* -------------------------------------------------------------------------- Arabic footer: keep the same column order and alignment as English. booklovers/rtl.css flips footer titles + product thumbnails unless we scope overrides to .footer_wrap here (this file loads after rtl.css). -------------------------------------------------------------------------- */ html[dir="rtl"] .footer_wrap, body.rtl .footer_wrap { --direction-multiplier: 1; } html[dir="rtl"] .footer_wrap, body.rtl .footer_wrap, html[dir="rtl"] .footer_wrap .elementor-section, html[dir="rtl"] .footer_wrap .elementor-container, html[dir="rtl"] .footer_wrap .elementor-column, html[dir="rtl"] .footer_wrap .elementor-widget-wrap, html[dir="rtl"] .footer_wrap .e-con, html[dir="rtl"] .footer_wrap .e-con-inner, body.rtl .footer_wrap .elementor-section, body.rtl .footer_wrap .elementor-container, body.rtl .footer_wrap .elementor-column, body.rtl .footer_wrap .elementor-widget-wrap, body.rtl .footer_wrap .e-con, body.rtl .footer_wrap .e-con-inner { direction: ltr; text-align: left; } html[dir="rtl"] .footer_wrap .elementor-container, html[dir="rtl"] .footer_wrap .elementor-row, html[dir="rtl"] .footer_wrap .e-con-inner, body.rtl .footer_wrap .elementor-container, body.rtl .footer_wrap .elementor-row, body.rtl .footer_wrap .e-con-inner { flex-direction: row !important; } html[dir="rtl"] .footer_wrap .widget_title, html[dir="rtl"] .footer_wrap .widgettitle, body.rtl .footer_wrap .widget_title, body.rtl .footer_wrap .widgettitle { direction: rtl; text-align: left !important; } html[dir="rtl"] .footer_wrap .widget .widget_title, html[dir="rtl"] .footer_wrap .widget .widgettitle, body.rtl .footer_wrap .widget .widget_title, body.rtl .footer_wrap .widget .widgettitle { padding-right: 0; padding-left: 26px; } html[dir="rtl"] .footer_wrap .widget .widget_title:before, html[dir="rtl"] .footer_wrap .widget .widgettitle:before, body.rtl .footer_wrap .widget .widget_title:before, body.rtl .footer_wrap .widget .widgettitle:before { left: 0; right: auto; } html[dir="rtl"] .footer_wrap .trx_widget_contacts, html[dir="rtl"] .footer_wrap .widget_contacts, html[dir="rtl"] .footer_wrap .menu-footer-menu-container, html[dir="rtl"] .footer_wrap .widget_nav_menu, html[dir="rtl"] .footer_wrap .footer-bottom-text, body.rtl .footer_wrap .trx_widget_contacts, body.rtl .footer_wrap .widget_contacts, body.rtl .footer_wrap .menu-footer-menu-container, body.rtl .footer_wrap .widget_nav_menu, body.rtl .footer_wrap .footer-bottom-text { direction: ltr; text-align: left; } html[dir="rtl"] .footer_wrap .menu-footer-menu-container ul, html[dir="rtl"] .footer_wrap .widget_nav_menu ul, body.rtl .footer_wrap .menu-footer-menu-container ul, body.rtl .footer_wrap .widget_nav_menu ul { direction: ltr; text-align: left; padding-left: 0; } /* What's New — image left, details right (same as English footer). */ html[dir="rtl"] .footer_wrap .woocommerce ul.product_list_widget li, html[dir="rtl"] .footer_wrap .wp-widget-woocommerce_products ul.product_list_widget li, body.rtl .footer_wrap .woocommerce ul.product_list_widget li, body.rtl .footer_wrap .wp-widget-woocommerce_products ul.product_list_widget li { direction: ltr; text-align: left; overflow: hidden; } html[dir="rtl"] .footer_wrap .woocommerce ul.product_list_widget li img, html[dir="rtl"] .footer_wrap .wp-widget-woocommerce_products ul.product_list_widget li img, body.rtl .footer_wrap .woocommerce ul.product_list_widget li img, body.rtl .footer_wrap .wp-widget-woocommerce_products ul.product_list_widget li img { float: left !important; margin: 0 32px 0 0 !important; width: 80px; height: 110px; object-fit: cover; } html[dir="rtl"] .footer_wrap .widget .product_list_widget li .product-title, body.rtl .footer_wrap .widget .product_list_widget li .product-title { direction: rtl; text-align: left; unicode-bidi: plaintext; } html[dir="rtl"] .footer_wrap .widget .product_list_widget li .star-rating, html[dir="rtl"] .footer_wrap .widget .product_list_widget li .amount, html[dir="rtl"] .footer_wrap .widget .product_list_widget li .price, body.rtl .footer_wrap .widget .product_list_widget li .star-rating, body.rtl .footer_wrap .widget .product_list_widget li .amount, body.rtl .footer_wrap .widget .product_list_widget li .price { direction: ltr; unicode-bidi: embed; text-align: left; } html[dir="rtl"] .footer_wrap a[href^="tel:"], html[dir="rtl"] .footer_wrap a[href^="mailto:"], body.rtl .footer_wrap a[href^="tel:"], body.rtl .footer_wrap a[href^="mailto:"] { direction: ltr; unicode-bidi: embed; display: inline-block; } /* Preserve centered copyright line in the footer bottom bar. */ html[dir="rtl"] .footer_wrap .elementor-widget-text-editor .elementor-widget-container[style*="text-align: center"], html[dir="rtl"] .footer_wrap .elementor-widget-text-editor .elementor-widget-container p[style*="text-align: center"], body.rtl .footer_wrap .elementor-widget-text-editor .elementor-widget-container[style*="text-align: center"], body.rtl .footer_wrap .elementor-widget-text-editor .elementor-widget-container p[style*="text-align: center"] { text-align: center !important; } /* -------------------------------------------------------------------------- Arabic typography — theme fonts (Futura PT, Playfair) have no Arabic glyphs. Font is set in storypath-polylang-rtl.php (default: Rubik). Change with define( 'STORYPATH_ARABIC_FONT', 'Tajawal' ); in wp-config.php -------------------------------------------------------------------------- */ html[dir="rtl"] body, body.rtl { font-family: var(--storypath-arabic-font, "Rubik", sans-serif); } html[dir="rtl"] .woocommerce, html[dir="rtl"] .woocommerce-page, body.rtl .woocommerce, body.rtl .woocommerce-page { font-family: var(--storypath-arabic-font, "Rubik", sans-serif); } html[dir="rtl"] .woocommerce div.product .product_title, html[dir="rtl"] .woocommerce ul.products li.product .woocommerce-loop-product__title, html[dir="rtl"] .woocommerce ul.products li.product .woocommerce-loop-product__title a, body.rtl .woocommerce div.product .product_title, body.rtl .woocommerce ul.products li.product .woocommerce-loop-product__title, body.rtl .woocommerce ul.products li.product .woocommerce-loop-product__title a { font-family: var(--storypath-arabic-font, "Rubik", sans-serif); text-align: center; } html[dir="rtl"] .single-product div.product div.summary .product_title, body.rtl .single-product div.product div.summary .product_title { width: 100%; text-align: center; } /* Homepage Slider Revolution — backup if layer fonts are still English. */ html[dir="rtl"] .rev_slider .rs-layer, html[dir="rtl"] .rev_slider rs-layer, body.rtl .rev_slider .rs-layer, body.rtl .rev_slider rs-layer { font-family: var(--storypath-arabic-font, "Rubik", sans-serif) !important; letter-spacing: 0 !important; } /* -------------------------------------------------------------------------- WooCommerce single product / shop — supplements parent rtl.css -------------------------------------------------------------------------- */ html[dir="rtl"] .single-product div.product div.summary, html[dir="rtl"] .single-product .woocommerce-product-details__short-description, html[dir="rtl"] .single-product .woocommerce-Tabs-panel, body.rtl .single-product div.product div.summary, body.rtl .single-product .woocommerce-product-details__short-description, body.rtl .single-product .woocommerce-Tabs-panel { text-align: right; } html[dir="rtl"] .woocommerce-breadcrumb, body.rtl .woocommerce-breadcrumb { direction: rtl; text-align: right; } html[dir="rtl"] .woocommerce div.product form.variations_form .variations td, html[dir="rtl"] .woocommerce div.product form.variations_form .variations th, html[dir="rtl"] .woocommerce div.product form.variations_form .variations label, body.rtl .woocommerce div.product form.variations_form .variations td, body.rtl .woocommerce div.product form.variations_form .variations th, body.rtl .woocommerce div.product form.variations_form .variations label { text-align: right; } html[dir="rtl"] .woocommerce div.product form.variations_form .reset_variations, body.rtl .woocommerce div.product form.variations_form .reset_variations { margin-right: 0; margin-left: 1em; } html[dir="rtl"] #pa_format_attrib_extended .trx_addons_attrib_item.trx_addons_attrib_image, body.rtl #pa_format_attrib_extended .trx_addons_attrib_item.trx_addons_attrib_image { margin: 0 0 4.5em 18px !important; } html[dir="rtl"] #pa_format_attrib_extended .trx_addons_attrib_item.trx_addons_attrib_image[data-tooltip-text]:after, body.rtl #pa_format_attrib_extended .trx_addons_attrib_item.trx_addons_attrib_image[data-tooltip-text]:after { left: 50%; right: auto; transform: translateX(-50%); text-align: center; } /* Prices and SKUs stay readable LTR inside RTL pages. */ html[dir="rtl"] .woocommerce div.product p.price, html[dir="rtl"] .woocommerce div.product span.price, html[dir="rtl"] .woocommerce table.shop_attributes td p, body.rtl .woocommerce div.product p.price, body.rtl .woocommerce div.product span.price, body.rtl .woocommerce table.shop_attributes td p { direction: ltr; unicode-bidi: embed; text-align: right; } html[dir="rtl"] .woocommerce table.shop_attributes th, html[dir="rtl"] .woocommerce table.shop_attributes td, body.rtl .woocommerce table.shop_attributes th, body.rtl .woocommerce table.shop_attributes td { text-align: right; } html[dir="rtl"] .woocommerce div.product .product_meta, body.rtl .woocommerce div.product .product_meta { text-align: right; } /* Page title area on product / shop archives. */ html[dir="rtl"] .page_title, html[dir="rtl"] .sc_layouts_title, body.rtl .page_title, body.rtl .sc_layouts_title { text-align: right; }