/* StoreGo Arabic RTL hotfix - no Vite build required */
html[dir="rtl"] [data-slot="sidebar"],
html[dir="rtl"] [data-slot="sidebar-wrapper"],
html[dir="rtl"] [data-sidebar="menu"],
html[dir="rtl"] [data-sidebar="menu-button"],
html[dir="rtl"] [data-sidebar="menu-sub"],
html[dir="rtl"] [data-sidebar="menu-sub-button"] {
    direction: rtl !important;
    text-align: right !important;
}

/* Main menu items: anchor/content starts from the right in Arabic */
html[dir="rtl"] [data-sidebar="menu-button"],
html[dir="rtl"] [data-sidebar="menu-button"] > a,
html[dir="rtl"] [data-sidebar="menu-button"] > div,
html[dir="rtl"] [data-sidebar="menu-button"] a,
html[dir="rtl"] [data-sidebar="menu-button"] div {
    justify-content: flex-start !important;
    text-align: right !important;
}

html[dir="rtl"] [data-sidebar="menu-button"] > div,
html[dir="rtl"] [data-sidebar="menu-button"] > a,
html[dir="rtl"] a[data-sidebar="menu-button"] {
    width: 100% !important;
}

/* Put normal menu icon on the right of the Arabic label */
html[dir="rtl"] [data-sidebar="menu-button"] svg:not(.lucide-chevron-right):not(.lucide-chevron-down):not(.lucide-chevron-left):not(.lucide-chevron-up) {
    order: -1 !important;
    flex: 0 0 auto !important;
}

/* Put expand/collapse arrow at the far left */
html[dir="rtl"] [data-sidebar="menu-button"] .lucide-chevron-right,
html[dir="rtl"] [data-sidebar="menu-button"] .lucide-chevron-down,
html[dir="rtl"] [data-sidebar="menu-button"] .lucide-chevron-left,
html[dir="rtl"] [data-sidebar="menu-button"] .lucide-chevron-up {
    order: 10 !important;
    margin-right: auto !important;
    margin-left: 0 !important;
}

/* Arabic submenu alignment and nesting line */
html[dir="rtl"] [data-sidebar="menu-sub"] {
    border-left: 0 !important;
    border-right: 1px solid var(--sidebar-border) !important;
    margin-left: 0 !important;
    margin-right: 0.875rem !important;
    padding-left: 0 !important;
    padding-right: 0.625rem !important;
}

html[dir="rtl"] [data-sidebar="menu-sub-button"],
html[dir="rtl"] [data-sidebar="menu-sub-button"] > a,
html[dir="rtl"] a[data-sidebar="menu-sub-button"] {
    justify-content: flex-start !important;
    text-align: right !important;
    width: 100% !important;
}

/* Sidebar actions / badges to the opposite side in RTL */
html[dir="rtl"] [data-sidebar="menu-action"],
html[dir="rtl"] [data-sidebar="menu-badge"],
html[dir="rtl"] [data-sidebar="group-action"] {
    right: auto !important;
    left: 0.75rem !important;
}