/* ==========================================================================
   RTL overrides — Frontend (Bootstrap 5 + Ribal Wallet theme + user dashboard)
   Loaded LAST and only when the active language is right-to-left, via the
   <x-rtl-styles area="frontend" /> component. The shipped Bootstrap build is
   LTR, so direction-aware utilities are flipped explicitly under [dir="rtl"].
   ========================================================================== */

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

/* ----- Text alignment utilities ----- */
[dir="rtl"] .text-start { text-align: right !important; }
[dir="rtl"] .text-end { text-align: left !important; }

@media (min-width: 768px) {
    [dir="rtl"] .text-md-start { text-align: right !important; }
    [dir="rtl"] .text-md-end { text-align: left !important; }
}

@media (min-width: 992px) {
    [dir="rtl"] .text-lg-start { text-align: right !important; }
    [dir="rtl"] .text-lg-end { text-align: left !important; }
}

/* ----- Float utilities ----- */
[dir="rtl"] .float-start { float: right !important; }
[dir="rtl"] .float-end { float: left !important; }

/* ----- Auto margins ----- */
[dir="rtl"] .ms-auto { margin-right: auto !important; margin-left: 0 !important; }
[dir="rtl"] .me-auto { margin-left: auto !important; margin-right: 0 !important; }

/* ----- Margin start/end (0–5) ----- */
[dir="rtl"] .ms-1 { margin-right: 0.25rem !important; margin-left: 0 !important; }
[dir="rtl"] .ms-2 { margin-right: 0.5rem !important; margin-left: 0 !important; }
[dir="rtl"] .ms-3 { margin-right: 1rem !important; margin-left: 0 !important; }
[dir="rtl"] .ms-4 { margin-right: 1.5rem !important; margin-left: 0 !important; }
[dir="rtl"] .ms-5 { margin-right: 3rem !important; margin-left: 0 !important; }

[dir="rtl"] .me-1 { margin-left: 0.25rem !important; margin-right: 0 !important; }
[dir="rtl"] .me-2 { margin-left: 0.5rem !important; margin-right: 0 !important; }
[dir="rtl"] .me-3 { margin-left: 1rem !important; margin-right: 0 !important; }
[dir="rtl"] .me-4 { margin-left: 1.5rem !important; margin-right: 0 !important; }
[dir="rtl"] .me-5 { margin-left: 3rem !important; margin-right: 0 !important; }

/* ----- Padding start/end (0–5) ----- */
[dir="rtl"] .ps-1 { padding-right: 0.25rem !important; padding-left: 0 !important; }
[dir="rtl"] .ps-2 { padding-right: 0.5rem !important; padding-left: 0 !important; }
[dir="rtl"] .ps-3 { padding-right: 1rem !important; padding-left: 0 !important; }
[dir="rtl"] .ps-4 { padding-right: 1.5rem !important; padding-left: 0 !important; }
[dir="rtl"] .ps-5 { padding-right: 3rem !important; padding-left: 0 !important; }

[dir="rtl"] .pe-1 { padding-left: 0.25rem !important; padding-right: 0 !important; }
[dir="rtl"] .pe-2 { padding-left: 0.5rem !important; padding-right: 0 !important; }
[dir="rtl"] .pe-3 { padding-left: 1rem !important; padding-right: 0 !important; }
[dir="rtl"] .pe-4 { padding-left: 1.5rem !important; padding-right: 0 !important; }
[dir="rtl"] .pe-5 { padding-left: 3rem !important; padding-right: 0 !important; }

/* ----- Borders start/end ----- */
[dir="rtl"] .border-start { border-right: 1px solid var(--bs-border-color, #dee2e6) !important; border-left: 0 !important; }
[dir="rtl"] .border-end { border-left: 1px solid var(--bs-border-color, #dee2e6) !important; border-right: 0 !important; }

/* ----- Dropdowns ----- */
[dir="rtl"] .dropdown-menu { text-align: right; }
[dir="rtl"] .dropdown-menu-end { right: auto; left: 0; }
[dir="rtl"] .dropdown-menu-start { left: auto; right: 0; }

/* ----- Lists ----- */
[dir="rtl"] ul,
[dir="rtl"] ol { padding-right: 0; }

/* ----- Form switches / checks ----- */
[dir="rtl"] .form-switch {
    padding-right: 2.5em;
    padding-left: 0;
}

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

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

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

/* ----- 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-right: -1px;
    margin-left: 0;
}

/* ----- Ribal Wallet theme: header navigation ----- */
[dir="rtl"] .header-area .main-menu ul li { margin-right: 0; margin-left: 30px; }
[dir="rtl"] .header-area .main-menu ul li:last-child { margin-left: 0; }
[dir="rtl"] .header-area .main-menu ul li .submenu { left: auto; right: 0; text-align: right; }

/* ----- Ribal Wallet theme: buttons with leading/trailing icons ----- */
// disabled-sasa16 [dir="rtl"] .theme-btn i { margin-right: 0; margin-left: 8px; }
// disabled-sasa16 [dir="rtl"] .theme-btn i.right-icon { margin-left: 0; margin-right: 8px; }

/* ----- nice-select (custom dropdowns) ----- */
[dir="rtl"] .nice-select { text-align: right !important; padding-right: 18px; padding-left: 30px; }
[dir="rtl"] .nice-select::after { left: 12px; right: auto; }
[dir="rtl"] .nice-select .list { left: auto; right: 0; }

/* ----- Native selects: move the caret (and its padding) to the left ----- */
[dir="rtl"] .form-select {
    background-position: left 0.75rem center;
    padding-right: 0.75rem;
    padding-left: 2.25rem;
    text-align: right;
}

/* ----- User dashboard header: open custom dropdowns toward the viewport -----
   Desktop only: on <=991px these dropdowns are already centered (left:50% +
   translateX), which is direction-agnostic, so leave that untouched. */
@media (min-width: 992px) {
    [dir="rtl"] .premium-header .ph-quick-wrap .quick-function-dropdown,
    [dir="rtl"] .premium-header .ph-profile__menu {
        right: auto;
        left: 0;
    }
}

/* ----- Lists / checkmarks / feature rows ----- */
[dir="rtl"] .list-icon i,
[dir="rtl"] .check-list li i { margin-right: 0; margin-left: 10px; }

/* ----- User dashboard shell ----- */
[dir="rtl"] .dashboard-sidebar { right: 0; left: auto; }
[dir="rtl"] .dashboard-sidebar .sidebar-menu a i { margin-right: 0; margin-left: 12px; }
[dir="rtl"] .dashboard-content { margin-right: var(--dashboard-sidebar-width, 0); margin-left: 0; }
[dir="rtl"] .dashboard-card .card-icon { margin-right: 0; margin-left: 16px; }

/* ----- Tables ----- */
[dir="rtl"] .table > :not(caption) > * > * { text-align: right; }
[dir="rtl"] .table .text-end { text-align: left !important; }

/* ----- Breadcrumbs ----- */
[dir="rtl"] .breadcrumb-item + .breadcrumb-item { padding-right: 0.5rem; padding-left: 0; }
[dir="rtl"] .breadcrumb-item + .breadcrumb-item::before { padding-right: 0; padding-left: 0.5rem; float: right; }

/* ----- Mobile offcanvas drawer ----- */
[dir="rtl"] .offcanvas__info {
    right: auto;
    left: 0;
    border-left: 0;
    border-right: 2px solid var(--theme);
    transform: translateX(calc(-100% - 80px));
}
[dir="rtl"] .offcanvas__info.info-open {
    transform: translateX(0);
}
[dir="rtl"] .offcanvas__wrapper .offcanvas__content .offcanvas__contact ul li .offcanvas__contact-icon {
    margin-right: 0;
    margin-left: 20px;
}

/* more-rtl-v2: text next to icon, chevron at end and flipped */
html[dir="rtl"] [class*="more-sheet"] a,
html[dir="rtl"] [class*="more-sheet"] .more-item,
html[dir="rtl"] [class*="moreSheet"] a,
html[dir="rtl"] [id*="more"] .more-item,
html[dir="rtl"] [id*="More"] a.d-flex,
html[dir="rtl"] .app-more-item,
html[dir="rtl"] .app-more-row,
html[dir="rtl"] .mobile-more-item,
html[dir="rtl"] .more-menu-item {
  display: flex !important;
  flex-direction: row !important;
  align-items: center !important;
  direction: rtl;
  text-align: start !important;
  justify-content: flex-start !important;
  gap: 12px !important;
}
html[dir="rtl"] [class*="more-sheet"] a > div,
html[dir="rtl"] [class*="more-sheet"] a > span,
html[dir="rtl"] .more-item > div,
html[dir="rtl"] .more-item > span,
html[dir="rtl"] .app-more-item > div {
  text-align: start !important;
}
html[dir="rtl"] [class*="more-sheet"] a .ms-auto,
html[dir="rtl"] [class*="more-sheet"] .bi-chevron-right,
html[dir="rtl"] [class*="more-sheet"] .fa-chevron-right,
html[dir="rtl"] [class*="more-sheet"] .fa-angle-right,
html[dir="rtl"] [class*="more-sheet"] [class*="chevron-right"],
html[dir="rtl"] [class*="more-sheet"] [class*="arrow-right"],
html[dir="rtl"] .more-item .bi-chevron-right,
html[dir="rtl"] .more-item .fa-chevron-right {
  margin-left: 0 !important;
  margin-right: auto !important;
  transform: scaleX(-1) !important;
}
html[dir="rtl"] [class*="more-sheet"] .text-start { text-align: start !important; }
html[dir="rtl"] [class*="more-sheet"] .text-end { text-align: start !important; }
html[dir="rtl"] [class*="more-sheet"] .text-left { text-align: start !important; }

/* more-rtl-v3 */
html[dir="rtl"] .dk-more-sheet .dk-more-menu__item,
html[dir="rtl"] .dk-more-menu .dk-more-menu__item,
html[dir="rtl"] .dk-more-sheet a.dk-more-menu__item,
html[dir="rtl"] .dk-more-sheet button.dk-more-menu__item {
  display: flex !important;
  flex-direction: row !important;
  align-items: center !important;
  justify-content: flex-start !important;
  gap: 12px !important;
  text-align: start !important;
  direction: rtl;
}
html[dir="rtl"] .dk-more-sheet .dk-more-menu__icon {
  flex: 0 0 auto !important;
  order: 0 !important;
}
html[dir="rtl"] .dk-more-sheet .dk-more-menu__copy {
  flex: 1 1 auto !important;
  text-align: start !important;
  min-width: 0 !important;
}
html[dir="rtl"] .dk-more-sheet .dk-more-menu__title {
  text-align: start !important;
  display: block !important;
}
html[dir="rtl"] .dk-more-sheet .dk-more-menu__arrow {
  flex: 0 0 auto !important;
  margin-left: 0 !important;
  margin-right: auto !important;
  transform: scaleX(-1) !important;
}
html[dir="rtl"] .dk-more-overview-card {
  display: flex !important;
  flex-direction: row !important;
  align-items: center !important;
  justify-content: space-between !important;
  text-align: start !important;
  direction: rtl;
  gap: 10px !important;
}
html[dir="rtl"] .dk-more-overview-card__copy {
  flex: 1 1 auto !important;
  text-align: start !important;
}
html[dir="rtl"] .dk-more-overview-card__stat {
  margin-inline-start: auto !important;
  text-align: end !important;
  flex: 0 0 auto !important;
}
html[dir="rtl"] .dk-more-referral-card {
  direction: rtl;
  text-align: start;
}

/* more-rtl-v4 */
html[dir="rtl"] .dk-more-install {
  display: flex !important;
  flex-direction: row !important;
  align-items: center !important;
  direction: ltr !important;
  gap: 10px !important;
}
html[dir="rtl"] .dk-more-install__icon {
  order: 0 !important;
  flex: 0 0 auto !important;
  margin: 0 !important;
}
html[dir="rtl"] .dk-more-install__copy {
  order: 1 !important;
  flex: 1 1 auto !important;
  min-width: 0 !important;
  direction: rtl !important;
  text-align: right !important;
}
html[dir="rtl"] .dk-more-install__button {
  order: 2 !important;
  flex: 0 0 auto !important;
  margin-left: auto !important;
  margin-right: 0 !important;
}

/* more-rtl-v5 tabbar */
html[dir="rtl"] .dk-tabbar,
html[dir="rtl"] .dk-tabbar__inner {
  direction: ltr !important;
  flex-direction: row !important;
}
html[dir="rtl"] .dk-tabbar .dk-tab,
html[dir="rtl"] .dk-tabbar .dk-tab__lb {
  direction: rtl;
  text-align: center;
}

/* more-rtl-v6 quick */
html[dir="rtl"] .dk-quick-sheet .dk-quick-head,
html[dir="rtl"] .dk-qf-sheet .dk-qf-head,
html[dir="rtl"] [class*="quick-sheet"] [class*="__head"],
html[dir="rtl"] [class*="quick-menu"] [class*="head"] {
  direction: ltr !important;
  flex-direction: row !important;
}
html[dir="rtl"] .dk-quick-sheet .dk-quick-head [class*="title"],
html[dir="rtl"] [class*="quick"] [class*="title"] {
  direction: rtl;
  text-align: start;
}
html[dir="rtl"] .dk-quick-top,
html[dir="rtl"] .dk-qf-top,
html[dir="rtl"] [class*="quick"] [class*="hero"],
html[dir="rtl"] [class*="quick"] [class*="wallet-row"],
html[dir="rtl"] .dk-quick-wallet,
html[dir="rtl"] .qf-hero {
  direction: ltr !important;
  flex-direction: row !important;
}
html[dir="rtl"] .dk-quick-wallet,
html[dir="rtl"] [class*="quick"] [class*="wallet"] {
  direction: ltr !important;
}
html[dir="rtl"] .dk-quick-wallet [class*="copy"],
html[dir="rtl"] [class*="quick"] [class*="wallet"] [class*="copy"] {
  direction: rtl;
  text-align: right;
}

/* wallets-hero-v2 */
.wallet-page-header.user-feature-header,
.user-feature-header.wallet-page-header,
.wallet-page-header {
  position: relative !important;
  overflow: hidden !important;
  border-radius: 22px !important;
  padding: 18px 16px 16px !important;
  background: linear-gradient(135deg, #1d4ed8 0%, #0f766e 56%, #14b8a6 100%) !important;
  box-shadow: 0 12px 28px rgba(15,118,110,.22) !important;
  display: flex !important;
  flex-wrap: wrap !important;
  align-items: flex-start !important;
  gap: 12px !important;
}
.wallet-page-header::before {
  content: "" !important;
  position: absolute !important;
  width: 170px !important;
  height: 170px !important;
  border-radius: 50% !important;
  background: rgba(255,255,255,.14) !important;
  top: -70px !important;
  inset-inline-end: -36px !important;
  pointer-events: none !important;
}
.wallet-page-header::after {
  content: "" !important;
  position: absolute !important;
  width: 88px !important;
  height: 88px !important;
  border-radius: 50% !important;
  background: rgba(255,255,255,.08) !important;
  bottom: -28px !important;
  inset-inline-start: -18px !important;
  pointer-events: none !important;
}
.wallet-page-header h1,
.wallet-page-header h2,
.wallet-page-header h3,
.wallet-page-header h4,
.wallet-page-header h5,
.wallet-page-header .user-feature-header__title,
.wallet-page-header [class*="title"] {
  color: #fff !important;
  font-size: 20px !important;
  font-weight: 800 !important;
  margin: 0 0 4px !important;
  position: relative !important;
  z-index: 1 !important;
}
.wallet-page-header p,
.wallet-page-header .user-feature-header__subtitle,
.wallet-page-header [class*="subtitle"] {
  color: rgba(255,255,255,.84) !important;
  font-size: 12.5px !important;
  line-height: 1.35 !important;
  margin: 0 !important;
  position: relative !important;
  z-index: 1 !important;
}
.wallet-page-header .user-feature-header__actions,
.wallet-page-header .wallet-page-actions,
.wallet-page-header > .d-flex,
.wallet-page-header [class*="actions"] {
  display: flex !important;
  flex-direction: row !important;
  flex-wrap: wrap !important;
  gap: 8px !important;
  width: 100% !important;
  position: relative !important;
  z-index: 1 !important;
  margin-top: 6px !important;
}
.wallet-page-header .wallet-page-action,
.wallet-page-header a.btn,
.wallet-page-header button.btn {
  flex: 1 1 0 !important;
  background: rgba(255,255,255,.96) !important;
  color: #0f172a !important;
  border: 0 !important;
  border-radius: 14px !important;
  padding: 10px 12px !important;
  font-size: 13px !important;
  font-weight: 700 !important;
  box-shadow: 0 4px 10px rgba(0,0,0,.08) !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 6px !important;
  white-space: nowrap !important;
}

/* wallets-hero-v3 */
.wallet-page-header.user-feature-header,
.user-feature-header.wallet-page-header,
.wallet-page-header {
  padding: 12px 14px 12px !important;
  border-radius: 18px !important;
  gap: 8px !important;
  min-height: 0 !important;
}
.wallet-page-header::before {
  width: 110px !important;
  height: 110px !important;
  top: -48px !important;
  inset-inline-end: -28px !important;
}
.wallet-page-header::after {
  width: 62px !important;
  height: 62px !important;
  bottom: -22px !important;
}
.wallet-page-header h1,
.wallet-page-header h2,
.wallet-page-header h3,
.wallet-page-header h4,
.wallet-page-header h5,
.wallet-page-header .user-feature-header__title,
.wallet-page-header [class*="title"] {
  font-size: 16px !important;
  line-height: 1.2 !important;
  margin: 0 0 2px !important;
}
.wallet-page-header p,
.wallet-page-header .user-feature-header__subtitle,
.wallet-page-header [class*="subtitle"] {
  font-size: 11px !important;
  line-height: 1.3 !important;
  max-width: 88% !important;
}
.wallet-page-header .user-feature-header__icon,
.wallet-page-header [class*="icon"] {
  width: 32px !important;
  height: 32px !important;
  min-width: 32px !important;
  font-size: 13px !important;
}
.wallet-page-header .user-feature-header__actions,
.wallet-page-header [class*="actions"] {
  gap: 6px !important;
  margin-top: 2px !important;
}
.wallet-page-header .wallet-page-action,
.wallet-page-header a.btn,
.wallet-page-header button.btn {
  padding: 7px 10px !important;
  font-size: 12px !important;
  border-radius: 12px !important;
  min-height: 36px !important;
}

/* wallets-hero-v4 */
.wallet-page-header .wallet-page-action,
.wallet-page-header a.btn,
.wallet-page-header button.btn {
  flex: 0 1 auto !important;
  width: auto !important;
  min-height: 32px !important;
  height: 32px !important;
  padding: 0 12px !important;
  font-size: 12px !important;
  line-height: 1 !important;
  border-radius: 999px !important;
  gap: 5px !important;
}
.wallet-page-header .wallet-page-action svg,
.wallet-page-header .wallet-page-action i,
.wallet-page-header a.btn svg,
.wallet-page-header button.btn svg,
.wallet-page-header a.btn i,
.wallet-page-header button.btn i {
  width: 13px !important;
  height: 13px !important;
  min-width: 13px !important;
  min-height: 13px !important;
  font-size: 12px !important;
  line-height: 1 !important;
}
.wallet-page-header .user-feature-header__actions,
.wallet-page-header [class*="actions"] {
  width: auto !important;
  flex: 0 0 auto !important;
}

/* p2p-hero-btns-v1 */
.p2p-market-header.user-feature-header,
.user-feature-header.p2p-market-header,
.p2p-market-header {
  padding: 12px 14px 12px !important;
  border-radius: 18px !important;
  gap: 8px !important;
}
.p2p-market-header .user-feature-header__actions,
.p2p-market-header [class*="actions"] {
  display: flex !important;
  flex-wrap: wrap !important;
  gap: 6px !important;
  width: auto !important;
  margin-top: 4px !important;
}
.p2p-market-header a.btn,
.p2p-market-header button.btn,
.p2p-market-header .btn {
  flex: 0 1 auto !important;
  width: auto !important;
  min-height: 32px !important;
  height: 32px !important;
  padding: 0 12px !important;
  font-size: 12px !important;
  font-weight: 700 !important;
  line-height: 1 !important;
  border-radius: 999px !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 5px !important;
  white-space: nowrap !important;
}
.p2p-market-header a.btn svg,
.p2p-market-header button.btn svg,
.p2p-market-header a.btn i,
.p2p-market-header button.btn i {
  width: 13px !important;
  height: 13px !important;
  font-size: 12px !important;
}
.p2p-market-header a.btn-light-primary,
.p2p-market-header .btn-light-primary,
.p2p-market-header a.btn-light {
  background: #fff !important;
  color: #0f172a !important;
  border: 0 !important;
  box-shadow: 0 3px 8px rgba(0,0,0,.10) !important;
}
.p2p-market-header a.btn-outline,
.p2p-market-header .btn-outline,
.p2p-market-header a.btn-outline-light,
.p2p-market-header a.btn-outline-primary {
  background: rgba(255,255,255,.16) !important;
  color: #fff !important;
  border: 1px solid rgba(255,255,255,.38) !important;
}