/* rtl.css - Right-to-Left styling for Arabic language */

/* Basic document direction */
html[lang="ar"],
body[lang="ar"] {
    direction: rtl;
    text-align: right;
}

/* Text alignment classes */
.text-left {
    text-align: right !important;
}

.text-right {
    text-align: left !important;
}

/* Float classes */
.float-start,
.float-left {
    float: right !important;
}

.float-end,
.float-right {
    float: left !important;
}

/* Margin and padding adjustments */
.ms-1, .ms-2, .ms-3, .ms-4, .ms-5,
.ms-auto, .margin-start, .ml-1, .ml-2,
.ml-3, .ml-4, .ml-5, .ml-auto, .margin-left {
    margin-right: 0.25rem !important;
    margin-left: 0 !important;
}

.me-1, .me-2, .me-3, .me-4, .me-5,
.me-auto, .margin-end, .mr-1, .mr-2,
.mr-3, .mr-4, .mr-5, .mr-auto, .margin-right {
    margin-left: 0.25rem !important;
    margin-right: 0 !important;
}

.ps-1, .ps-2, .ps-3, .ps-4, .ps-5,
.ps-auto, .padding-start, .pl-1, .pl-2,
.pl-3, .pl-4, .pl-5, .pl-auto, .padding-left {
    padding-right: 0.25rem !important;
    padding-left: 0 !important;
}

.pe-1, .pe-2, .pe-3, .pe-4, .pe-5,
.pe-auto, .padding-end, .pr-1, .pr-2,
.pr-3, .pr-4, .pr-5, .pr-auto, .padding-right {
    padding-left: 0.25rem !important;
    padding-right: 0 !important;
}

/* Specific margin values for Bootstrap classes */
.ms-1, .ml-1 { margin-right: 0.25rem !important; margin-left: 0 !important; }
.ms-2, .ml-2 { margin-right: 0.5rem !important; margin-left: 0 !important; }
.ms-3, .ml-3 { margin-right: 1rem !important; margin-left: 0 !important; }
.ms-4, .ml-4 { margin-right: 1.5rem !important; margin-left: 0 !important; }
.ms-5, .ml-5 { margin-right: 3rem !important; margin-left: 0 !important; }

.me-1, .mr-1 { margin-left: 0.25rem !important; margin-right: 0 !important; }
.me-2, .mr-2 { margin-left: 0.5rem !important; margin-right: 0 !important; }
.me-3, .mr-3 { margin-left: 1rem !important; margin-right: 0 !important; }
.me-4, .mr-4 { margin-left: 1.5rem !important; margin-right: 0 !important; }
.me-5, .mr-5 { margin-left: 3rem !important; margin-right: 0 !important; }

/* Specific padding values for Bootstrap classes */
.ps-1, .pl-1 { padding-right: 0.25rem !important; padding-left: 0 !important; }
.ps-2, .pl-2 { padding-right: 0.5rem !important; padding-left: 0 !important; }
.ps-3, .pl-3 { padding-right: 1rem !important; padding-left: 0 !important; }
.ps-4, .pl-4 { padding-right: 1.5rem !important; padding-left: 0 !important; }
.ps-5, .pl-5 { padding-right: 3rem !important; padding-left: 0 !important; }

.pe-1, .pr-1 { padding-left: 0.25rem !important; padding-right: 0 !important; }
.pe-2, .pr-2 { padding-left: 0.5rem !important; padding-right: 0 !important; }
.pe-3, .pr-3 { padding-left: 1rem !important; padding-right: 0 !important; }
.pe-4, .pr-4 { padding-left: 1.5rem !important; padding-right: 0 !important; }
.pe-5, .pr-5 { padding-left: 3rem !important; padding-right: 0 !important; }

/* Text alignment on different screens */
@media (min-width: 576px) {
    .text-sm-left {
        text-align: right !important;
    }
    .text-sm-right {
        text-align: left !important;
    }
}

@media (min-width: 768px) {
    .text-md-left {
        text-align: right !important;
    }
    .text-md-right {
        text-align: left !important;
    }
}

@media (min-width: 992px) {
    .text-lg-left {
        text-align: right !important;
    }
    .text-lg-right {
        text-align: left !important;
    }
}

@media (min-width: 1200px) {
    .text-xl-left {
        text-align: right !important;
    }
    .text-xl-right {
        text-align: left !important;
    }
}

/* Flexbox ordering */
.flex-row {
    flex-direction: row-reverse !important;
}

.flex-row-reverse {
    flex-direction: row !important;
}

/* Border radius for inputs and buttons */
input, 
.form-control,
.btn,
.card {
    border-radius: 0.25rem !important;
}

/* List styles */
ul.list-unstyled {
    padding-right: 0;
}

/* Bootstrap grid adjustments */
.offset-1 { margin-right: 8.333333%; margin-left: 0 !important; }
.offset-2 { margin-right: 16.666667%; margin-left: 0 !important; }
.offset-3 { margin-right: 25%; margin-left: 0 !important; }
.offset-4 { margin-right: 33.333333%; margin-left: 0 !important; }
.offset-5 { margin-right: 41.666667%; margin-left: 0 !important; }
.offset-6 { margin-right: 50%; margin-left: 0 !important; }
.offset-7 { margin-right: 58.333333%; margin-left: 0 !important; }
.offset-8 { margin-right: 66.666667%; margin-left: 0 !important; }
.offset-9 { margin-right: 75%; margin-left: 0 !important; }
.offset-10 { margin-right: 83.333333%; margin-left: 0 !important; }
.offset-11 { margin-right: 91.666667%; margin-left: 0 !important; }

/* Form elements */
.form-check {
    padding-left: 0;
}

.form-check-input {
    margin-left: 0;
    margin-right: -1.25rem;
}

/* Dropdown menus */
.dropdown-menu {
    text-align: right;
    left: auto;
    right: 0;
}

.dropdown-menu-end {
    right: auto !important;
    left: 0 !important;
}

.dropdown-menu-start {
    left: auto !important;
    right: 0 !important;
}

/* Modal dialogs */
.modal-header .btn-close {
    margin: -0.5rem auto -0.5rem -0.5rem;
}

/* Carousel controls */
.carousel-control-prev {
    left: auto;
    right: 0;
}

.carousel-control-next {
    right: auto;
    left: 0;
}

.carousel-item-next.carousel-item-left,
.carousel-item-prev.carousel-item-right {
    transform: translateX(0);
}

.carousel-item-next,
.active.carousel-item-right {
    transform: translateX(-100%);
}

.carousel-item-prev,
.active.carousel-item-left {
    transform: translateX(100%);
}

/* Input groups */
.input-group > .input-group-prepend {
    order: 13;
}

.input-group > .form-control:not(:last-child),
.input-group > .custom-select:not(:last-child) {
    border-top-left-radius: 0;
    border-bottom-left-radius: 0;
    border-top-right-radius: 0.25rem;
    border-bottom-right-radius: 0.25rem;
}

.input-group > .form-control:not(:first-child),
.input-group > .custom-select:not(:first-child) {
    border-top-right-radius: 0;
    border-bottom-right-radius: 0;
    border-top-left-radius: 0.25rem;
    border-bottom-left-radius: 0.25rem;
}

/* Alert close button */
.alert-dismissible {
    padding-right: 1.25rem;
    padding-left: 4rem;
}

.alert-dismissible .close,
.alert-dismissible .btn-close {
    left: 0;
    right: auto;
}

/* List groups */
.list-group {
    padding-right: 0;
}

/* Tables */
.table th {
    text-align: right;
}

/* Navigation */
.nav {
    padding-right: 0;
}

/* Pagination */
.page-item:first-child .page-link {
    border-top-left-radius: 0;
    border-bottom-left-radius: 0;
    border-top-right-radius: 0.25rem;
    border-bottom-right-radius: 0.25rem;
}

.page-item:last-child .page-link {
    border-top-right-radius: 0;
    border-bottom-right-radius: 0;
    border-top-left-radius: 0.25rem;
    border-bottom-left-radius: 0.25rem;
}

/* Progress bars */
.progress-bar {
    float: right;
}

/* RTL-specific font adjustments */
body[lang="ar"] {
    font-family: "Tajawal", "Cairo", sans-serif !important;
    letter-spacing: 0 !important;
}

/* Form validation icons */
.was-validated .form-control:invalid, 
.form-control.is-invalid {
    background-position: left calc(0.375em + 0.1875rem) center;
    padding-left: calc(1.5em + 0.75rem);
    padding-right: 0.75rem;
}

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

/* Utilities for horizontal alignment */
.justify-content-start {
    justify-content: flex-end !important;
}

.justify-content-end {
    justify-content: flex-start !important;
}

/* Text direction utilities */
.text-start {
    text-align: right !important;
}

.text-end {
    text-align: left !important;
}

/* Custom styles for your specific project */
.auth-brand {
    text-align: right;
}

.auth-fluid-right {
    right: auto;
    left: 0;
}

.auth-fluid-form-box {
    margin-right: auto;
    margin-left: 0;
}

/* Checkboxes and radio buttons position adjustment */
.form-check-inline {
    margin-right: 0;
    margin-left: 0.75rem;
}

.form-check-label {
    padding-right: 0.5rem;
}

/* Specific adjustments for your application */
.slider-bg2 {
    background-position: left 0 !important;
}

.form-group.text-left {
    text-align: right !important;
}

/* Mobile adjustments */
@media (max-width: 767.98px) {
    .matchmaking-form-submit {
        text-align: center !important;
    }
}
/* Add these specific styles to fix the remember me checkbox alignment in RTL mode */
html[lang="ar"] .form-check,
body[lang="ar"] .form-check {
    padding-left: 0;
    text-align: right;
}

html[lang="ar"] .form-check-input,
body[lang="ar"] .form-check-input {
    float: right;
    margin-right: -1.5em;
    margin-left: 0;
}

html[lang="ar"] .form-check .form-check-input,
body[lang="ar"] .form-check .form-check-input {
    float: right;
    margin-left: 0.5em;
    margin-right: -1.5em;
}

html[lang="ar"] .form-check-label,
body[lang="ar"] .form-check-label {
    display: inline-block;
    margin-right: 0.5em;
    margin-left: 0;
}

/* Force correct vertical alignment for checkbox and label */
html[lang="ar"] .form-check,
body[lang="ar"] .form-check {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    flex-direction: row-reverse;
}

html[lang="ar"] .form-check .form-check-input,
body[lang="ar"] .form-check .form-check-input {
    margin-top: 0;
    position: static;
    margin-left: 0.5em;
    margin-right: 0;
}

html[lang="ar"] .form-check .form-check-label,
body[lang="ar"] .form-check .form-check-label {
    margin-right: 0;
    margin-left: 7px;
}