/* Admin custom overrides — Arabic / RTL only */

/* =====================================================================
   Choices.js — RTL fixes
   The library ships with LTR-hardcoded paddings, arrow positions and
   text alignment. These rules flip everything for Arabic.
   ===================================================================== */

[dir="rtl"] .choices {
    text-align: right;
    direction: rtl;
}

/* The clickable single-select "selection" box */
[dir="rtl"] .choices__inner {
    text-align: right;
    direction: rtl;
    /* mirror the right-side dropdown arrow padding to the left */
    padding-right: 0.75rem;
    padding-left: 2rem;
}

/* The dropdown arrow (drawn as a CSS background-image positioned right) */
[dir="rtl"] .choices[data-type*="select-one"]::after {
    right: auto;
    left: 11.5px;
}

/* Search input inside an open dropdown */
[dir="rtl"] .choices__input {
    text-align: right;
    direction: rtl;
}

/* Dropdown panel + items */
[dir="rtl"] .choices__list,
[dir="rtl"] .choices__list--dropdown,
[dir="rtl"] .choices__list[aria-expanded] {
    text-align: right;
    direction: rtl;
}

[dir="rtl"] .choices__list--dropdown .choices__item,
[dir="rtl"] .choices__list[aria-expanded] .choices__item {
    text-align: right;
    direction: rtl;
    padding-right: 10px;
    padding-left: 10px;
}

/* Multi-select chosen items: button-X is normally on the right; flip it */
[dir="rtl"] .choices__list--multiple .choices__item {
    margin-right: 0;
    margin-left: 3.75px;
}

[dir="rtl"] .choices__list--multiple .choices__item.is-highlighted {
    background-color: var(--bs-primary);
}

[dir="rtl"] .choices__button {
    margin-right: 8px;
    margin-left: -4px;
    border-right: 1px solid #008fa1;
    border-left: 0;
    padding-right: 16px;
    padding-left: 0;
    background-position: center;
}

/* Placeholder colour — keep readable on RTL */
[dir="rtl"] .choices__placeholder {
    text-align: right;
    direction: rtl;
}

/* Group headings inside dropdown */
[dir="rtl"] .choices__group .choices__heading {
    text-align: right;
    direction: rtl;
}
