/**
 * Tenant storefront/account RTL form controls
 * Loaded when user_lang_dir == 'rtl' (see header.blade.php)
 */

/* ------------------------------------------------------------------
   Password visibility toggle — reinforce absolute positioning + mirror
   ------------------------------------------------------------------ */
[dir="rtl"] .form-group.single-input,
[dir="rtl"] .single-info-input.single-input,
[dir="rtl"] .single-input:has(.toggle-password) {
    position: relative;
}

[dir="rtl"] .toggle-password {
    position: absolute;
    bottom: 13px;
    left: auto;
    right: auto;
    inset-inline-end: 15px;
    inset-inline-start: auto;
    top: auto;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    line-height: 1;
    z-index: 2;
    margin: 0;
    padding: 0;
    width: auto;
}

[dir="rtl"] .single-input:has(.toggle-password) .form-control,
[dir="rtl"] .single-input:has(.toggle-password) .form--control {
    padding-inline-end: 15px;
    padding-inline-start: 45px;
}

/* Generate random password stays in normal flow below fields */
[dir="rtl"] .input-item .generate-password {
    display: inline-flex;
    align-items: center;
    gap: 0.35em;
}

/* ------------------------------------------------------------------
   Bootstrap 5 checkboxes & radios
   ------------------------------------------------------------------ */
[dir="rtl"] .form-check {
    padding-left: 0;
    padding-right: 1.5em;
}

[dir="rtl"] .form-check .form-check-input {
    float: right;
    margin-left: 0;
    margin-right: -1.5em;
}

[dir="rtl"] .form-check-inline {
    margin-right: 0;
    margin-left: 1rem;
    padding-right: 0;
    padding-left: 0;
}

[dir="rtl"] .form-check-reverse {
    padding-right: 0;
    padding-left: 1.5em;
}

[dir="rtl"] .form-check-reverse .form-check-input {
    float: left;
    margin-right: 0;
    margin-left: -1.5em;
}

[dir="rtl"] .form-switch .form-check-input {
    margin-right: -2.5em;
    margin-left: 0;
}

[dir="rtl"] .form-check-label {
    text-align: right;
}

/* Login page remember-me row (box-wrap flex layout) */
[dir="rtl"] .form-group .box-wrap .left {
    display: flex;
    align-items: center;
    gap: 0.5em;
}

[dir="rtl"] .form-group .box-wrap .left .form-check-input {
    float: none;
    margin: 0;
    flex-shrink: 0;
}

[dir="rtl"] .form-group .box-wrap .left .form-check-label {
    flex: 1;
}

/* ------------------------------------------------------------------
   Legacy Bootstrap 4 custom-control (checkout/ajax login fallbacks)
   ------------------------------------------------------------------ */
[dir="rtl"] .custom-control {
    padding-left: 0;
    padding-right: 1.5rem;
}

[dir="rtl"] .custom-control-inline {
    margin-right: 0;
    margin-left: 1rem;
}

[dir="rtl"] .custom-control-label::before,
[dir="rtl"] .custom-control-label::after {
    left: auto;
    right: -1.75rem;
}

[dir="rtl"] .custom-control.custom-checkbox.mr-sm-2 {
    margin-right: 0 !important;
    margin-left: 0.5rem !important;
}

/* ------------------------------------------------------------------
   Checkout / ajax login remember-me row
   ------------------------------------------------------------------ */
[dir="rtl"] .rmber-area .text-right,
[dir="rtl"] .rmber-area .text-end,
[dir="rtl"] .order-page-login-register-right {
    text-align: left !important;
}

/* ------------------------------------------------------------------
   Selects
   ------------------------------------------------------------------ */
[dir="rtl"] .form-select {
    background-position: left 0.75rem center;
    padding-right: 0.75rem;
    padding-left: 2.25rem;
}

[dir="rtl"] .nice-select {
    text-align: right;
    padding-left: 30px;
    padding-right: 18px;
}

[dir="rtl"] .nice-select:after {
    right: auto;
    left: 12px;
}

[dir="rtl"] .nice-select .list {
    text-align: right;
}

/* ------------------------------------------------------------------
   Input groups
   ------------------------------------------------------------------ */
[dir="rtl"] .input-group > :not(:first-child):not(.dropdown-menu):not(.valid-tooltip):not(.valid-feedback):not(.invalid-tooltip):not(.invalid-feedback) {
    margin-left: 0;
    margin-right: calc(-1 * var(--bs-border-width, 1px));
    border-start-start-radius: var(--bs-border-radius, 0.375rem);
    border-end-start-radius: var(--bs-border-radius, 0.375rem);
    border-start-end-radius: 0;
    border-end-end-radius: 0;
}

[dir="rtl"] .input-group:not(.has-validation) > :not(:last-child):not(.dropdown-toggle):not(.dropdown-menu) {
    border-start-end-radius: var(--bs-border-radius, 0.375rem);
    border-end-end-radius: var(--bs-border-radius, 0.375rem);
    border-start-start-radius: 0;
    border-end-start-radius: 0;
}

[dir="rtl"] .input-group-text {
    border-radius: 0 var(--bs-border-radius, 0.375rem) var(--bs-border-radius, 0.375rem) 0;
}

[dir="rtl"] .input-group .form-control,
[dir="rtl"] .input-group .form--control {
    text-align: right;
}

/* ------------------------------------------------------------------
   Validation feedback & icons
   ------------------------------------------------------------------ */
[dir="rtl"] .valid-feedback,
[dir="rtl"] .invalid-feedback {
    text-align: right;
}

[dir="rtl"] .form-control.is-valid,
[dir="rtl"] .was-validated .form-control:valid {
    background-position: left calc(0.375em + 0.1875rem) center;
    padding-left: calc(1.5em + 0.75rem);
    padding-right: 0.75rem;
}

[dir="rtl"] .form-control.is-invalid,
[dir="rtl"] .was-validated .form-control:invalid {
    background-position: left calc(0.375em + 0.1875rem) center;
    padding-left: calc(1.5em + 0.75rem);
    padding-right: 0.75rem;
}

[dir="rtl"] .form-select.is-valid,
[dir="rtl"] .form-select.is-invalid,
[dir="rtl"] .was-validated .form-select:valid,
[dir="rtl"] .was-validated .form-select:invalid {
    background-position: left calc(0.375em + 0.1875rem) center, left 0.75rem center;
    padding-left: calc(1.5em + 2.25rem);
    padding-right: 0.75rem;
}

/* ------------------------------------------------------------------
   Aromatic RTL form text alignment (placeholders / inputs / intl-tel)
   ------------------------------------------------------------------ */
[dir="rtl"] body.aromatic .form-control,
[dir="rtl"] body.aromatic .form--control,
[dir="rtl"] body.aromatic input[type="text"],
[dir="rtl"] body.aromatic input[type="email"],
[dir="rtl"] body.aromatic input[type="password"],
[dir="rtl"] body.aromatic input[type="tel"],
[dir="rtl"] body.aromatic input[type="number"],
[dir="rtl"] body.aromatic input[type="search"],
[dir="rtl"] body.aromatic textarea,
[dir="rtl"] body.aromatic select.form-control {
    text-align: right !important;
    direction: rtl;
}

[dir="rtl"] body.aromatic label {
    text-align: right;
}

[dir="rtl"] body.aromatic .iti {
    width: 100%;
}

[dir="rtl"] body.aromatic .iti input.form-control,
[dir="rtl"] body.aromatic .iti input[type="tel"] {
    text-align: right !important;
    direction: rtl !important;
}

[dir="rtl"] body.aromatic .iti__country-list {
    text-align: right;
    direction: rtl;
}

[dir="rtl"] body.aromatic .invalid-feedback,
[dir="rtl"] body.aromatic .valid-feedback,
[dir="rtl"] body.aromatic .error-message {
    text-align: right;
}
