/**
 * Shared RTL overrides for invoice checkout pages (without-product, with-product, product).
 */
body {
  direction: rtl;
}

html[dir="rtl"] .quantity__minus,
html[dir="rtl"] .quantity__plus,
html[dir="rtl"] .quantity__input,
html[dir="rtl"] .phone-country-dropdown .phone-country-btn .selected-text {
  font-family: "Open Sans", sans-serif !important;
}

.payment-box {
  margin-right: auto;
  margin-left: initial;
}

.invoice-header .invoice-logo .logo-image {
  margin-right: initial;
  margin-left: 15px;
}

.secure-img img {
  margin-right: 0px;
  margin-left: 5px;
}

.in-custom-checkbox .form-check-label {
  margin-right: 3px;
  margin-left: 0px;
}

.save-checkbox .form-check {
  padding-right: 1.5rem;
  padding-left: 0px;
}

.save-checkbox .form-check .form-check-input {
  float: right;
  margin-right: -1.5em;
}

.pe-2 {
  padding-left: 0.5rem;
  padding-right: 0.7rem !important;
}

.ps-2 {
  padding-left: 0.7rem !important;
  padding-right: 0.5rem;
}

.paymenttab .nav-pills li {
  border-left: 1px solid #ffffff;
  border-right: 0px;
}

.paymenttab .nav-pills li:last-child {
  border-left: 0px;
  border-right: 1px solid #ffffff;
}

.form-floating > label {
  left: initial;
  right: 0;
}

.paymenttab .nav-pills {
  direction: rtl;
}

.paymenttab .nav-item .nav-link {
  text-align: center;
}

.payment-box .payment-title h5,
.total-amount-wrapper,
.total-amount-wrapper p,
.total-amount-wrapper h5,
.include-shipping-text,
.breakup-card,
.breakup-card .breakup-costing p,
.breakup-card .amount-payable-main p {
  text-align: right;
}

/* .breakup-box {
  flex-direction: row-reverse;
} */

/* Keep mixed-language dates stable in RTL (e.g. 02 Apr 2026) */
.m-payment-info-wrap .invoice-date p,
.invoicedate-info .in-invoice-date .in-invoicecontent {
  direction: ltr;
  unicode-bidi: isolate;
  display: inline-block;
}

/* Keep top mobile amount section centered without overlapping side items */
.m-payment-info-wrap
  .d-flex.align-items-center.justify-content-between.text-center {
  display: flex !important;
  /* align-items: flex-start !important; */
}

.m-payment-info-wrap .invoice-date,
.m-payment-info-wrap .i-details {
  flex: 0 0 92px;
}

.m-payment-info-wrap .invoice-date {
  order: 1;
  text-align: right;
}

.m-payment-info-wrap .i-details {
  order: 3;
  text-align: left;
}

.m-payment-info-wrap .m-payable-amount {
  order: 2;
  flex: 1 1 auto;
  text-align: center;
}

.cvv-icon {
  right: initial;
  left: 10px;
}

.invoice-card {
  right: initial;
  left: 10px;
}

.credit-info .form-floating .password-toggle-pad,
.sadad-pay-main .form-floating .password-toggle-pad {
  direction: rtl;
  text-align: start;
}

/* Verifying CSS */
.verifing-checkbox .custom-checkbox {
  margin-bottom: 12px;
  position: relative;
  padding-right: 1.5rem;
  padding-left: 0rem;
}

.verifing-checkbox .form-check-input {
  position: absolute;
  right: 0;
}

.verifing-checkbox .custom-checkbox .form-check-label {
  margin-left: 0px;
  margin-right: 13px;
}

.cancel-payment-modal-wrapper .btn-close {
  left: -8px;
  right: initial;
}

.cancel-pay-btn .can-btn-no.me-3 {
  margin-right: initial;
  margin-left: 1rem;
}

/* Shipping / checkout layout */
.breakup-card {
  left: 0;
  right: initial;
}

.content-scroller {
  padding-right: initial;
  padding-left: 15px;
}

.in-invoicecontent {
  text-align: right;
  line-height: 26px;
}

.custom-accordion .ship-state-badge{
  margin-right: auto;
  margin-left: 0;
}

.custom-accordion .accordion-button::after{
  margin-right: 10px;
  margin-left: 0
}

.accordion-button::after {
  margin-left: initial;
  margin-right: auto;
}

.product-table-main table .product-image,
.mobile-product-image.product-image {
  /* margin-right: auto; */
  margin-left: 12px;
}

.product-table-main table tr th:first-child {
  text-align: right;
}

.arrow {
  margin-right: auto;
  margin-left: initial;
}

.dropdown-menu {
  left: initial;
  /* right: 0; */
  text-align: right;
}

.dropdown-menu li {
  text-align: right;
}

.product-table-main p {
  text-align: right;
}

.invoice-desc-box .in-invoicecontent {
  text-align: right;
  line-height: 26px;
}

html[dir="rtl"] body .mobile-language-box h5 {
  font-family: "Open Sans", sans-serif !important;
}

/* Phone country dropdown (product checkout; harmless on other pages) */
.phone-country-prefix-wrap {
  direction: ltr;
}

.phone-country-dropdown .phone-country-btn {
  display: flex;
  align-items: center;
  justify-content: space-between;
  direction: rtl;
}

.phone-country-dropdown .phone-country-btn .selected-text {
  direction: ltr;
  unicode-bidi: isolate;
  display: inline-block;
}

.phone-country-dropdown .phone-country-btn .selected {
  display: flex;
  align-items: center;
  flex-direction: row-reverse;
  gap: 6px;
}

.phone-country-dropdown .phone-country-btn .selected .flag {
  margin: 0;
}

.phone-country-dropdown .phone-country-btn .arrow {
  margin-inline-start: auto;
  padding-inline-start: 6px;
}

.phone-country-dropdown .phone-country-menu {
  left: auto;
  right: 0;
}

.m-productdetail-listing table tr th:first-child,
.m-productdetail-listing table tr td:first-child{
  text-align: right;
}

@media (max-width: 767px) {
  .phone-country-dropdown .phone-country-btn {
    flex-direction: row-reverse;
    justify-content: flex-end;
  }

  .phone-country-dropdown .phone-country-btn .selected {
    flex-direction: row;
  }
}

@media (min-width: 768px) and (max-width: 991px) {
  .md-inv-content p {
    text-align: right;
  }

  .mobile-language-box a {
    margin-left: 0px;
    margin-right: 10px;
  }

  .lang-sel-dropdownmain {
    right: initial;
    left: 0px;
  }

  .i-details {
    left: 20px;
    right: initial;
  }

  /* .i-details {
    position: absolute;
    right: initial;
    left: 20px;
  } */

  .i-details .mi-detail-text a {
    display: inline-block;
    margin-left: 0px;
    margin-right: 8px;
  }

  .md-dtl-arrowup {
    left: 15px;
    right: inherit;
  }
}

@media (min-width: 577px) and (max-width: 767px) {
  .mobile-language-box a {
    margin-left: 0px;
    margin-right: 10px;
  }

  .lang-sel-dropdownmain {
    right: initial;
    left: 0px;
  }

  .md-inv-content p {
    text-align: right;
  }

  .i-details {
    left: 20px;
    right: initial;
  }

  /* .i-details {
    position: absolute;
    right: initial;
    left: 20px;
  } */

  .i-details .mi-detail-text a {
    display: inline-block;
    margin-left: 0px;
    margin-right: 8px;
  }

  .verifying-modal-wrapper .modal-content {
    border-radius: 15px;
    width: 320px;
    max-width: 320px;
  }

  .verifying-modal-wrapper .modal-body {
    padding: 20px 29px 27px 29px;
    height: 310px;
  }

  .processing_title h5 {
    font-size: 15px;
    margin-bottom: 41px;
  }

  .processing_loader img {
    height: 54px;
  }

  .verifing-checkbox .custom-checkbox .form-check-label {
    font-size: 12px;
    font-weight: 600;
  }

  .verifing-checkbox {
    width: 70%;
  }

  .verifing-checkbox .custom-checkbox {
    margin-bottom: 3px;
  }

  .processing_loader {
    margin-bottom: 38px;
  }

  .donot_close_window {
    bottom: -54px;
  }

  .donot_close_window h6 {
    font-size: 12px;
  }

  .md-dtl-arrowup {
    left: 15px;
    right: inherit;
  }
}

@media (min-width: 360px) and (max-width: 576px) {
  .mobile-language-box a {
    margin-left: 0px;
    margin-right: 10px;
  }

  .lang-sel-dropdownmain {
    right: initial;
    left: 0px;
  }

  .md-inv-content p {
    text-align: right;
  }

  /* .i-details {
    position: absolute;
    right: initial;
    left: 20px;
  } */

  .i-details {
    left: 20px;
    right: initial;
  }

  .i-details .mi-detail-text a {
    display: inline-block;
    margin-left: 0px;
    margin-right: 8px;
  }

  .verifying-modal-wrapper .modal-content {
    border-radius: 15px;
    width: 320px;
    max-width: 320px;
  }

  .verifying-modal-wrapper .modal-body {
    padding: 20px 29px 27px 29px;
    height: 310px;
  }

  .processing_title h5 {
    font-size: 15px;
    margin-bottom: 41px;
  }

  .processing_loader img {
    height: 54px;
  }

  .verifing-checkbox .custom-checkbox .form-check-label {
    font-size: 12px;
    font-weight: 600;
  }

  .verifing-checkbox {
    width: 70%;
  }

  .verifing-checkbox .custom-checkbox {
    margin-bottom: 3px;
  }

  .processing_loader {
    margin-bottom: 38px;
  }

  .donot_close_window {
    bottom: -54px;
  }

  .donot_close_window h6 {
    font-size: 12px;
  }

  .md-dtl-arrowup {
    left: 15px;
    right: inherit;
  }
}

@media (min-width: 320px) and (max-width: 360px) {
  .mobile-language-box a {
    margin-left: 0px;
    margin-right: 10px;
  }

  .lang-sel-dropdownmain {
    right: initial;
    left: 0px;
  }

  .md-inv-content p {
    text-align: right;
  }
  .i-details {
    left: 20px;
    right: initial;
  }
  /* .i-details {
    position: absolute;
    right: initial;
    left: 20px;
  } */

  .i-details .mi-detail-text a {
    display: inline-block;
    margin-left: 0px;
    margin-right: 8px;
  }

  .verifying-modal-wrapper .modal-content {
    border-radius: 15px;
    width: 320px;
    max-width: 320px;
  }

  .verifying-modal-wrapper .modal-body {
    padding: 20px 29px 27px 29px;
    height: 310px;
  }

  .processing_title h5 {
    font-size: 15px;
    margin-bottom: 41px;
  }

  .processing_loader img {
    height: 54px;
  }

  .verifing-checkbox .custom-checkbox .form-check-label {
    font-size: 12px;
    font-weight: 600;
  }

  .verifing-checkbox {
    width: 70%;
  }

  .verifing-checkbox .custom-checkbox {
    margin-bottom: 3px;
  }

  .processing_loader {
    margin-bottom: 38px;
  }

  .donot_close_window {
    bottom: -54px;
  }

  .donot_close_window h6 {
    font-size: 12px;
  }

  .md-dtl-arrowup {
    left: 15px;
    right: inherit;
  }
}

/* ============================================================
   Shipping address block — RTL mirroring.
   Flex-row layouts (.ship-trigger, .ship-step-row, .add-ship-modal-title-row)
   already reverse visually on their own under body{direction:rtl}, since an
   un-set flex-direction defaults to row, which is direction-aware. Only the
   explicit physical left/right properties below (border, padding, margin,
   text-align, icon direction) need overriding — logical ones don't need a
   rule here at all.
   ============================================================ */

.req-asterisk {
  margin-left: 0;
  margin-right: 1px;
}

.unit-no-label .optional-tag {
  margin-left: 0;
  margin-right: 2px;
}

.custom-accordion.ship-state-pending .accordion-button {
  text-align: right;
  border-left: 0;
  border-right: 3px solid var(--themeColor, #8d193c);
  padding-left: 8px;
  padding-right: 16px;
}

.custom-accordion.ship-state-invalid .accordion-button {
  text-align: right;
  border-left: 0;
  border-right: 3px solid #E30233;
  padding-left: 8px;
  padding-right: 16px;
}

.custom-accordion.ship-state-complete .accordion-button {
  text-align: right;
  border-left: 0;
  border-right: 3px solid #005915;
  padding-left: 8px;
  padding-right: 16px;
}

.ship-state-title-icon {
  margin-right: 0;
  margin-left: 8px;
}

/* Mobile "add shipping address" trigger row — the right-pointing chevron reads as
   "forward" in LTR; mirror it so it still points toward the direction the sheet
   opens from in RTL, matching this codebase's other forward/back chevrons. */
.ship-trigger-arrow svg {
  transform: scaleX(-1);
}