/*
 * RTL fixes shared by all pages
 * =============================
 * The Tailwind forms plugin pins the <select> chevron to the physical
 * right edge (background-position: right 0.5rem center). On an RTL page
 * the text also starts at the right, so the arrow overlaps the text and
 * hugs the edge. These rules move the chevron to the left with a
 * comfortable inset and swap the reserved padding to match.
 *
 * Specificity note: html[dir="rtl"] select beats both the plugin's bare
 * `select` rule and the padding utility classes (ps-4, pe-12, ...), so no
 * !important is needed and all selects get one consistent look.
 */

html[dir="rtl"] select:not([multiple]):not([size]) {
    background-position: left 0.75rem center;
    padding-left: 2.5rem;   /* room for the chevron */
    padding-right: 1rem;    /* text side */
}
