/* ============================================================
   SAFQA — RTL (Arabic) Full Support Layer
   Uses design tokens from design_system.css.
   ============================================================ */

/* ---- Base RTL document ---- */
html[dir="rtl"] {
    direction: rtl;
    font-family: var(--safqa-font-arabic, 'Noto Sans Arabic', 'Tahoma', sans-serif) !important;
}

/* ---- Typography ---- */
html[dir="rtl"] h1,
html[dir="rtl"] h2,
html[dir="rtl"] h3,
html[dir="rtl"] h4,
html[dir="rtl"] h5,
html[dir="rtl"] h6 {
    text-align: right;
    direction: rtl;
}

/* ---- Breadcrumbs ---- */
html[dir="rtl"] .ty-breadcrumbs {
    direction: rtl;
    text-align: right;
}
html[dir="rtl"] .ty-breadcrumbs__slash {
    display: inline-block;
    transform: scaleX(-1);
    margin: 0 8px;
}
html[dir="rtl"] .ty-breadcrumbs .ty-icon-right-dir,
html[dir="rtl"] .ty-breadcrumbs .ty-icon-left-dir {
    transform: scaleX(-1) !important;
}

/* ---- Navigation menu ---- */
html[dir="rtl"] .ty-menu__items,
html[dir="rtl"] .ut2-menu__items {
    direction: rtl;
}
html[dir="rtl"] .ty-menu__item-link,
html[dir="rtl"] .ut2-menu__item > a {
    direction: rtl;
    text-align: right;
}
html[dir="rtl"] .ty-menu .ty-icon-down-open,
html[dir="rtl"] .ty-menu .ty-icon-right-open,
html[dir="rtl"] .ut2-menu .ty-icon-down-open,
html[dir="rtl"] .ut2-menu .ty-icon-right-open {
    transform: scaleX(-1) !important;
}

/* ---- Banners ---- */
html[dir="rtl"] .ut2-banner,
html[dir="rtl"] .ty-mainbox-simple-container {
    direction: rtl;
}
html[dir="rtl"] .ut2-banner .ut2-a__title,
html[dir="rtl"] .ut2-banner .ut2-a__descr,
html[dir="rtl"] .ut2-banner .ut2-a__description {
    direction: rtl;
    text-align: right;
}
html[dir="rtl"] .ut2-banner .ut2-a__content.align-left {
    justify-content: flex-end !important;
    text-align: right !important;
    align-items: flex-end !important;
}
html[dir="rtl"] .ut2-banner .ut2-a__content.align-right {
    justify-content: flex-start !important;
    text-align: left !important;
    align-items: flex-start !important;
}
html[dir="rtl"] .ut2-banner .box {
    text-align: right !important;
    margin-right: auto !important;
    margin-left: 0 !important;
}

/* ---- Buttons ---- */
html[dir="rtl"] .ty-btn,
html[dir="rtl"] .ut2-btn,
html[dir="rtl"] button {
    direction: rtl;
}

/* ---- Forms ---- */
html[dir="rtl"] input[type="text"],
html[dir="rtl"] input[type="email"],
html[dir="rtl"] input[type="password"],
html[dir="rtl"] input[type="number"],
html[dir="rtl"] input[type="tel"],
html[dir="rtl"] select,
html[dir="rtl"] textarea {
    direction: rtl;
    text-align: right;
}

/* ---- Pagination ---- */
html[dir="rtl"] .ty-pagination {
    direction: rtl;
    flex-direction: row-reverse;
}
html[dir="rtl"] .ty-pagination .ty-icon-right-dir,
html[dir="rtl"] .ty-pagination .ty-icon-left-dir {
    transform: scaleX(-1) !important;
}

/* ---- Category titles ---- */
html[dir="rtl"] .ty-category-banner__title,
html[dir="rtl"] .ty-subcategories__item-name {
    direction: rtl;
    text-align: right;
}

/* ---- Sidebar ---- */
html[dir="rtl"] .ty-sidebox,
html[dir="rtl"] .ut2-sidebox {
    direction: rtl;
    text-align: right;
}

/* ---- Top panel ---- */
html[dir="rtl"] .ut2-top-panel,
html[dir="rtl"] .ty-top-panel {
    direction: rtl;
    text-align: right;
}

/* ---- Header search ---- */
html[dir="rtl"] .ut2-h__search input,
html[dir="rtl"] .ty-search-field input {
    direction: rtl;
    text-align: right;
}
html[dir="rtl"] .ut2-h__search button,
html[dir="rtl"] .ty-search-field__submit {
    border-radius: var(--safqa-radius-pill, 999px) 0 0 var(--safqa-radius-pill, 999px) !important;
}

/* ---- Footer ---- */
html[dir="rtl"] .ty-footer,
html[dir="rtl"] .ut2-footer {
    direction: rtl;
    text-align: right;
}

/* ---- BDI ---- */
html[dir="rtl"] bdi {
    direction: rtl;
    unicode-bidi: isolate;
}

/* ---- Safqa design system RTL ---- */
html[dir="rtl"] .safqa-trust-bar__inner {
    flex-direction: row-reverse;
}
html[dir="rtl"] .safqa-trust-item {
    flex-direction: row-reverse;
}
html[dir="rtl"] .safqa-section-heading {
    flex-direction: row-reverse;
}
html[dir="rtl"] .safqa-section-heading__title::after {
    left: auto !important;
    right: 0 !important;
}
html[dir="rtl"] .safqa-dark-toggle {
    left: auto !important;
    right: var(--safqa-space-6, 24px) !important;
}

/* ---- Product cards RTL ---- */
html[dir="rtl"] .ut2-gl__content,
html[dir="rtl"] .ut2-gl__name,
html[dir="rtl"] .ut2-gl__price,
html[dir="rtl"] .ut2-gl__vendor {
    text-align: right;
    direction: rtl;
}

/* ---- Dropdown menus RTL ---- */
html[dir="rtl"] .ut2-megamenu,
html[dir="rtl"] .ty-menu__submenu {
    direction: rtl;
    text-align: right;
    right: 0 !important;
    left: auto !important;
}

/* ---- Notification toasts RTL ---- */
html[dir="rtl"] .ty-notification,
html[dir="rtl"] [class*="cm-notification"] {
    direction: rtl;
    text-align: right;
    border-left: none !important;
    border-right: 4px solid var(--safqa-brand, #009598) !important;
}

/* ---- Buybox RTL ---- */
html[dir="rtl"] .buybox-stock {
    flex-direction: row-reverse;
}

/* ---- Mobile bottom nav RTL ---- */
html[dir="rtl"] .safqa-bottom-nav {
    direction: rtl;
}

/* ---- PROTECT icon fonts — ALWAYS LTR regardless of page direction ---- */
html[dir="rtl"] .ty-icon,
html[dir="rtl"] [class*="ty-icon-"],
html[dir="rtl"] .ut2-icon,
html[dir="rtl"] [class*="ut2-icon-"],
html[dir="rtl"] [class*="ut2-mwi-icon"],
html[dir="rtl"] .fa,
html[dir="rtl"] [class*="fa-"],
html[dir="rtl"] .safqa-bottom-nav__icon {
    font-family: 'tygh-icons', 'FontAwesome', 'glyphs', sans-serif !important;
    direction: ltr !important;
    display: inline-block !important;
}

/* ---- Live search RTL ---- */
html[dir="rtl"] .ty-live-search__results,
html[dir="rtl"] [class*="live-search"] {
    direction: rtl;
    text-align: right;
}