/* ============================================
   RTL (Arabic) layout & typography
   Loaded only when <html dir="rtl">
   ============================================ */

/* --- Base: respect writing direction --- */
html[dir="rtl"] body {
    text-align: start;
}

/* Latin / numeric islands stay LTR so punctuation and digits don't flip oddly */
html[dir="rtl"] .prose a[href],
html[dir="rtl"] .prose code,
html[dir="rtl"] .prose kbd,
html[dir="rtl"] .prose samp,
html[dir="rtl"] .ltr,
html[dir="rtl"] [dir="ltr"] {
    unicode-bidi: isolate;
}

html[dir="rtl"] .ltr,
html[dir="rtl"] [dir="ltr"] {
    direction: ltr;
    text-align: left;
}

/* --- Prose / CMS content --- */
html[dir="rtl"] .prose {
    text-align: start;
    unicode-bidi: isolate;
}

html[dir="rtl"] .prose ul,
html[dir="rtl"] .prose ol {
    padding-left: 0 !important;
    padding-right: 1.75rem !important;
    padding-inline-start: 1.75rem !important;
    padding-inline-end: 0 !important;
}

html[dir="rtl"] .prose li {
    padding-left: 0 !important;
    padding-right: 0.375rem !important;
    padding-inline-start: 0.375rem !important;
    padding-inline-end: 0 !important;
    text-align: start;
}

html[dir="rtl"] .prose ul > li,
html[dir="rtl"] .prose ol > li {
    padding-left: 0 !important;
    padding-inline-start: 0.375rem !important;
}

/* Bullet / number markers on the start (right) edge */
html[dir="rtl"] .prose li::marker {
    unicode-bidi: isolate;
}

html[dir="rtl"] .prose h2,
html[dir="rtl"] .prose h3 {
    padding-left: 0 !important;
    padding-right: 0.875rem !important;
    padding-inline-start: 0.875rem !important;
    padding-inline-end: 0 !important;
}

html[dir="rtl"] .prose h2:first-child,
html[dir="rtl"] .prose h3:first-child {
    padding-right: 0 !important;
    padding-inline-start: 0 !important;
}

html[dir="rtl"] .prose h2::before,
html[dir="rtl"] .prose h3::before {
    left: auto !important;
    right: 0 !important;
    inset-inline-start: 0 !important;
    inset-inline-end: auto !important;
}

html[dir="rtl"] .prose blockquote {
    border-left: none !important;
    border-right: 4px solid var(--color-primary, #0ea5e9) !important;
    border-inline-start: 4px solid var(--color-primary, #0ea5e9) !important;
    border-inline-end: none !important;
    padding-left: 0 !important;
    padding-right: 1.5rem !important;
    padding-inline-start: 1.5rem !important;
    padding-inline-end: 0 !important;
}

html[dir="rtl"] .prose blockquote p:last-child::after {
    margin-left: 0;
    margin-right: 0.25rem;
    margin-inline-start: 0.25rem;
}

html[dir="rtl"] .prose dd {
    margin-left: 0 !important;
    margin-right: 1.5rem !important;
    margin-inline-start: 1.5rem !important;
}

html[dir="rtl"] .prose table thead th,
html[dir="rtl"] .prose table tbody td {
    text-align: start;
}

html[dir="rtl"] .prose .indent,
html[dir="rtl"] .prose [style*="margin-left"] {
    margin-left: 0 !important;
    margin-right: 2.5rem !important;
    margin-inline-start: 2.5rem !important;
}

/* Tailwind text-left/right utilities forced physical sides — remap in RTL */
html[dir="rtl"] .text-left {
    text-align: start !important;
}

html[dir="rtl"] .text-right {
    text-align: end !important;
}

html[dir="rtl"] .prose.text-left,
html[dir="rtl"] .prose .text-left {
    text-align: start !important;
}

html[dir="rtl"] .prose .image-style-align-left,
html[dir="rtl"] .prose img[style*="float: left"],
html[dir="rtl"] .prose img[style*="float:left"] {
    float: right;
    margin-right: 0;
    margin-left: 1.5rem;
}

html[dir="rtl"] .prose .image-style-align-right,
html[dir="rtl"] .prose img[style*="float: right"],
html[dir="rtl"] .prose img[style*="float:right"] {
    float: left;
    margin-left: 0;
    margin-right: 1.5rem;
}

/* Section heading accent bar */
html[dir="rtl"] .section-heading {
    padding-left: 0 !important;
    padding-right: 1rem !important;
    padding-inline-start: 1rem !important;
}

html[dir="rtl"] .section-heading::before {
    left: auto !important;
    right: 0 !important;
    inset-inline-start: 0 !important;
}

/* --- Spec / content tables --- */
html[dir="rtl"] .product_detail_table th,
html[dir="rtl"] .product_detail_table td,
html[dir="rtl"] table.product_detail_table th,
html[dir="rtl"] table.product_detail_table td {
    text-align: start;
}

/* --- Contact / cards --- */
html[dir="rtl"] .contact-card-title,
html[dir="rtl"] .contact-link-label,
html[dir="rtl"] .acik-adres-bar,
html[dir="rtl"] .departments-kicker,
html[dir="rtl"] .departments-title,
html[dir="rtl"] .departments-lead {
    text-align: start;
}

html[dir="rtl"] .branches-list,
html[dir="rtl"] .branch-item {
    text-align: start;
}

/* --- Navbar submenu accent --- */
html[dir="rtl"] .nav-dropdown a,
html[dir="rtl"] .mobile-submenu a {
    border-left: none !important;
    border-right: 2px solid transparent;
    border-inline-start: 2px solid transparent;
    padding-left: 1rem !important;
    padding-right: 1.15rem !important;
    padding-inline-start: 1.15rem !important;
}

html[dir="rtl"] .nav-dropdown a:hover,
html[dir="rtl"] .nav-dropdown a:focus,
html[dir="rtl"] .mobile-submenu a:hover {
    border-inline-start-color: var(--color-primary, #3d5a3a);
}

/* Language / identity drawers — open from inline-start in RTL */
html[dir="rtl"] #language-panel,
html[dir="rtl"] #identity-panel {
    right: auto !important;
    left: 0 !important;
    transform: translateX(-100%) !important;
}

html[dir="rtl"] #language-panel:not(.translate-x-full),
html[dir="rtl"] #identity-panel:not(.translate-x-full) {
    transform: translateX(0) !important;
}

html[dir="rtl"] #language-panel.translate-x-full,
html[dir="rtl"] #identity-panel.translate-x-full {
    transform: translateX(-100%) !important;
}

/* Mobile menu: typically right-anchored in LTR; mirror for RTL */
html[dir="rtl"] #mobile-menu.translate-x-full {
    transform: translateX(-100%) !important;
}

html[dir="rtl"] #mobile-menu:not(.translate-x-full) {
    transform: translateX(0) !important;
}

html[dir="rtl"] #mobile-menu {
    right: auto !important;
    left: 0 !important;
}

/* Float contact buttons → inline-start (right in RTL is start; keep end = left visually for thumb reach optional)
   Prefer logical end so they stay away from start-side menus */
html[dir="rtl"] .fixed-contact-buttons.right-6,
html[dir="rtl"] .float-contact-buttons {
    left: 1.5rem;
    right: auto;
}

/* Chevron / carousel arrows that use “left/right” labels stay mirrored by dir in most browsers;
   force icon flip for Font Awesome chevrons in RTL content headers */
html[dir="rtl"] .fa-chevron-left,
html[dir="rtl"] .fa-arrow-left,
html[dir="rtl"] .fa-angle-left {
    transform: scaleX(-1);
}

html[dir="rtl"] .fa-chevron-right,
html[dir="rtl"] .fa-arrow-right,
html[dir="rtl"] .fa-angle-right {
    transform: scaleX(-1);
}

/* Breadcrumbs / meta rows */
html[dir="rtl"] .breadcrumb,
html[dir="rtl"] nav[aria-label="breadcrumb"] {
    direction: rtl;
}

html[dir="rtl"] .breadcrumb .fa-chevron-right,
html[dir="rtl"] .breadcrumb .fa-angle-right {
    transform: scaleX(-1);
}

/* Forms */
html[dir="rtl"] input,
html[dir="rtl"] textarea,
html[dir="rtl"] select {
    text-align: start;
}

html[dir="rtl"] input[type="email"],
html[dir="rtl"] input[type="tel"],
html[dir="rtl"] input[type="url"],
html[dir="rtl"] input[type="number"] {
    direction: ltr;
    unicode-bidi: isolate;
    text-align: left;
}

/* Footer columns already start-aligned via dir; ensure legal strip */
html[dir="rtl"] .footer-bottom,
html[dir="rtl"] .footer-bottom__legal {
    text-align: start;
}

html[dir="rtl"] .footer-bottom__copy {
    text-align: start;
}

html[dir="rtl"] .footer-bottom__meta {
    justify-content: flex-start;
}

html[dir="rtl"] .footer-bottom__by {
    direction: ltr;
    unicode-bidi: isolate;
    margin-left: 0 !important;
    margin-inline-start: auto;
}

html[dir="rtl"] .footer-main-grid {
    width: 100%;
}

html[dir="rtl"] .footer-social-row {
    justify-content: flex-start;
}

html[dir="rtl"] footer .text-left {
    text-align: start !important;
}

/* Bayi dealer cards */
html[dir="rtl"] .bayi-dealer-grid,
html[dir="rtl"] .bayi-dealer-card {
    text-align: start;
}

html[dir="rtl"] .contact-dept-list a,
html[dir="rtl"] .departments-list a {
    padding-left: 0.75rem !important;
    padding-right: 2.5rem !important;
    padding-inline-start: 2.5rem !important;
    text-align: start;
}

/* Generic CMS content wrappers that may not use .prose */
html[dir="rtl"] .ck-content ul,
html[dir="rtl"] .content-body ul,
html[dir="rtl"] .icerik-body ul,
html[dir="rtl"] .entry-content ul,
html[dir="rtl"] .ck-content ol,
html[dir="rtl"] .content-body ol,
html[dir="rtl"] .icerik-body ol,
html[dir="rtl"] .entry-content ol {
    padding-left: 0 !important;
    padding-inline-start: 1.75rem !important;
}

html[dir="rtl"] .ck-content li,
html[dir="rtl"] .content-body li,
html[dir="rtl"] .icerik-body li,
html[dir="rtl"] .entry-content li {
    text-align: start;
    padding-inline-start: 0.375rem;
}

/* --- Topbar: prevent RTL pile-up (hours + shop + lang + social) --- */
html[dir="rtl"] #topbar .container > div {
    gap: 1rem;
}

html[dir="rtl"] #topbar .topbar-quick-link[dir="ltr"] {
    unicode-bidi: isolate;
    direction: ltr;
}

/* Legacy physical separators if any remain in markup */
html[dir="rtl"] #topbar .border-l {
    border-left-width: 0 !important;
    border-right-width: 1px;
    border-inline-start-width: 1px;
    border-inline-end-width: 0 !important;
}

html[dir="rtl"] #topbar .ml-4 {
    margin-left: 0 !important;
    margin-inline-start: 1rem !important;
}

html[dir="rtl"] #topbar .pl-4 {
    padding-left: 0 !important;
    padding-inline-start: 1rem !important;
}

html[dir="rtl"] #topbar .ml-auto {
    margin-left: 0 !important;
    margin-inline-start: auto !important;
}