/*----------------------------------------------
*
* [RTL Support Stylesheet]
*
* Theme    : NEXGEN
* Version  : 1.1.0
* Author   : Codings
* Support  : codings.dev
*
----------------------------------------------*/

/* Arabic Google Font */
@import url('https://fonts.googleapis.com/css2?family=Cairo:wght@400;600;700&display=swap');

/*----------------------------------------------

[ALL CONTENTS]

1. Support

----------------------------------------------*/

/*----------------------------------------------
1. Support
----------------------------------------------*/

/* #region Support */

body {
    direction: rtl;
}

body .navbar-nav i.icon-arrow-down {
    margin: 0 0.3rem 0 0;
}

body .btn i {
    margin-left: 0.5rem;
}

body .dark-button:after {
    right: 2px;
    left: 0;
}

body h2.featured.alt:before {
    left: initial;
    right: 0;
}

body h2.featured:before {
    left: initial;
    right: 15px;
}

body .items .item:first-child .card.featured:before {
    top: -10px;
    right: -10px;
    bottom: 0;
    left: -0;
}

body .items .item:last-child .card.featured:before {
    left: -10px;
    right: initial;
}

body .progressbar {
    -webkit-transform: scaleX(-1);
    transform: scaleX(-1);
}

body .progressbar li {
    font-size: 0;
}

body .progressbar li:before {
    -webkit-transform: scaleX(-1);
    transform: scaleX(-1);
}

body .lg-outer {
    direction: initial;
}

/* #endregion Support */

/*----------------------------------------------
2. Arabic Layout Overrides
----------------------------------------------*/

/* #region Arabic Layout */

/* Highlights image-right: flip image to left side so it doesn't overlap text in RTL */
[dir="rtl"] .highlights.image-right .image {
    right: auto;
    left: 0;
}

/* Font family for RTL content */
[dir="rtl"] body,
[dir="rtl"] h1,
[dir="rtl"] h2,
[dir="rtl"] h3,
[dir="rtl"] h4,
[dir="rtl"] h5,
[dir="rtl"] h6,
[dir="rtl"] p,
[dir="rtl"] a,
[dir="rtl"] span,
[dir="rtl"] button,
[dir="rtl"] input,
[dir="rtl"] textarea {
    font-family: 'Cairo', sans-serif;
}

/* Hero section: right-align text block for RTL */
[dir="rtl"] .slide-content .left.text-left {
    text-align: right !important;
}

[dir="rtl"] .slide-content .col-12.d-flex.justify-content-start {
    justify-content: flex-end !important;
}

/* Hero CTA buttons: reverse spacing so gap is on the left of second button */
[dir="rtl"] .d-sm-inline-flex .ml-sm-4 {
    margin-left: 0 !important;
    margin-right: 1.5rem !important;
}

/* Platform stats: stack digit on top of label text, centered */
[dir="rtl"] #funfacts .item {
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
}

[dir="rtl"] #funfacts .item .radial.left {
    float: none;
    text-align: center;
    margin: 0 0 0.5rem 0;
}

[dir="rtl"] #funfacts .item h4 {
    margin-bottom: 0.25rem;
}

[dir="rtl"] #funfacts .col-12.col-md-6.text-md-left {
    text-align: right !important;
}

[dir="rtl"] #funfacts .pre-title.m-md-0 {
    margin-right: 0 !important;
    margin-left: auto !important;
}

/* Platform section: spacing between intro text and stat counters */
[dir="rtl"] #funfacts .row.intro {
    margin-bottom: 2rem !important;
}

[dir="rtl"] #funfacts .row.items {
    margin-top: 1rem;
}

/* Platform stat items: equal spacing */
[dir="rtl"] #funfacts .item.pr-md-4 {
    padding-right: 0 !important;
    padding-left: 0 !important;
}

/* Platform buttons: add gap between SIGN-UP and LOG-IN */
[dir="rtl"] #funfacts .d-sm-inline-flex {
    gap: 1rem;
}

[dir="rtl"] #funfacts .d-sm-inline-flex .me-3 {
    margin-left: 0 !important;
    margin-right: 0 !important;
}

[dir="rtl"] #funfacts .d-sm-inline-flex button[style*="margin-right"] {
    margin-right: 0 !important;
}

/* Platform section: reverse padding direction */
[dir="rtl"] .col-12.col-md-6.pr-md-5 {
    padding-right: 15px !important;
    padding-left: 3rem !important;
}

/* Section intros (services, markets, products, locations): right-align text */
[dir="rtl"] #features .text-md-left,
[dir="rtl"] #markets .text-md-left,
[dir="rtl"] #products .text-md-left,
[dir="rtl"] #locations .text-md-left {
    text-align: right !important;
}

[dir="rtl"] #features .pre-title.ml-md-0,
[dir="rtl"] #markets .pre-title.ml-md-0,
[dir="rtl"] #products .pre-title.ml-md-0,
[dir="rtl"] #locations .pre-title.ml-md-0 {
    margin-left: auto !important;
    margin-right: 0 !important;
}

/* Cards: right-align text in all card sections */
[dir="rtl"] .card {
    text-align: right;
}

/* Process steps: right-to-left horizontal flow */
[dir="rtl"] #process .items {
    flex-direction: row-reverse;
}

/* Contact section: swap column order so address appears on left in RTL */
[dir="rtl"] #contact .row > .col-12.col-md-8 {
    order: 2;
}

[dir="rtl"] #contact .row > .col-12.col-md-4 {
    order: 1;
}

[dir="rtl"] #contact .col-12.col-md-8.pr-md-5 {
    padding-right: 15px !important;
    padding-left: 3rem !important;
}

/* Contact form: flip dropdown arrow to left and add padding so text doesn't overlap */
[dir="rtl"] .input-group .icon-arrow-down {
    right: auto;
    left: 8px;
}

[dir="rtl"] .input-group select.form-control {
    padding-right: 0.75rem;
    padding-left: 1.75rem;
    text-align: right;
}

/* Contact info icons: flip margin direction */
[dir="rtl"] .contact_icons {
    margin-right: 0 !important;
    margin-left: 0.75rem !important;
}

/* Footer: swap text alignment */
[dir="rtl"] #copyright .text-lg-left {
    text-align: right !important;
}

[dir="rtl"] #copyright .text-lg-right {
    text-align: left !important;
}

/* Navbar: fix icon/button margins for RTL */
[dir="rtl"] .navbar .ml-auto {
    margin-left: 0 !important;
    margin-right: auto !important;
}

[dir="rtl"] .navbar-nav.action .ml-3 {
    margin-left: 0 !important;
    margin-right: 1rem !important;
}

/* #endregion Arabic Layout */