/* Keep placeholder alignment consistent with the active interface language. */
html[dir="rtl"] input::placeholder,
html[dir="rtl"] textarea::placeholder,
html[dir="rtl"] .select2-container .select2-selection__placeholder {
    direction: rtl !important;
    text-align: right !important;
}

html[dir="ltr"] input::placeholder,
html[dir="ltr"] textarea::placeholder,
html[dir="ltr"] .select2-container .select2-selection__placeholder {
    direction: ltr !important;
    text-align: left !important;
}

/* WebKit fallback for older embedded browsers. */
html[dir="rtl"] input::-webkit-input-placeholder,
html[dir="rtl"] textarea::-webkit-input-placeholder {
    direction: rtl !important;
    text-align: right !important;
}

html[dir="ltr"] input::-webkit-input-placeholder,
html[dir="ltr"] textarea::-webkit-input-placeholder {
    direction: ltr !important;
    text-align: left !important;
}

/* Select2 renders single-select placeholders as a span instead of a native placeholder. */
.select2-container .select2-selection__placeholder {
    display: block;
    width: 100%;
    unicode-bidi: plaintext;
}

/* Phone values are always written left-to-right, regardless of UI language.
 * Placeholder direction and alignment still come from the locale rules above. */
input[type="tel"],
input.phone-number-input {
    direction: ltr !important;
    text-align: left !important;
    unicode-bidi: plaintext;
}
