/**
 * Lubda (furniture) — global font + RTL polish.
 * Loaded after rtl.css, app.css, and extracss so overrides win.
 */
:root {
  --lubda-font: "IBM Plex Sans Arabic", "Segoe UI", Tahoma, sans-serif;
}

html,
body,
.tw-font-sans,
main,
.skin-blue-light .main-header .logo,
.skin-blue-light .main-header .navbar,
.sidebar-menu,
.form-control,
input,
select,
textarea,
button,
.btn,
.box,
.small-box,
.content-header,
h1, h2, h3, h4, h5, h6,
label,
.table,
.dataTables_wrapper,
.select2-container {
  font-family: var(--lubda-font) !important;
}

/* rtl.css sets Conv_GESSTwoLight — ensure Plex wins on RTL */
html[dir="rtl"] body,
body[dir="rtl"] {
  font-family: var(--lubda-font) !important;
}

/* Tailwind logical alignment in RTL */
[dir="rtl"] .tw-text-left {
  text-align: right !important;
}
[dir="rtl"] .tw-text-right {
  text-align: left !important;
}

/* SweetAlert (extracss forces LTR text) */
[dir="rtl"] .swal-title,
[dir="rtl"] .swal-text,
[dir="rtl"] .swal-content {
  text-align: right !important;
  direction: rtl !important;
}
[dir="rtl"] .swal-footer {
  text-align: left !important;
}

/* AdminLTE content header titles */
[dir="rtl"] .content-header > h1,
[dir="rtl"] .content-header > .breadcrumb {
  float: none;
}

/* Breadcrumb: many pages use margin-left on first item */
[dir="rtl"] ul.breadcrumb {
  padding-right: 0;
  padding-left: 15px;
}

/* Charts (Highcharts uses SVG text; body font does not inherit) */
.highcharts-container text,
.highcharts-container .highcharts-title,
.highcharts-container .highcharts-axis-labels text {
  font-family: var(--lubda-font) !important;
}

/* POS screen: header tools show icon + label; keep readable wrapping */
#pos_header_more_options {
  row-gap: 0.35rem;
}

/* POS footer: muted strip (see footer_pos.blade.php) */
body .tw-bg-gray-100 footer.no-print.tw-border-t p {
  font-variant-numeric: tabular-nums;
}

/* Bootstrap 3 help (i) popovers: vertical placement + RTL text (avoids misaligned "auto" side popovers in Arabic) */
html[dir="rtl"] .popover {
  direction: rtl;
  text-align: right;
}

/* =========================================================================
   RTL polish — every rule below is scoped to [dir="rtl"] so LTR is untouched.
   Targets breakages the AdminLTE rtl.css layer + Tailwind utilities miss.
   ========================================================================= */

/* Numbers, money, codes, dates, phones read left-to-right even in Arabic UI. */
[dir="rtl"] .input_number,
[dir="rtl"] input[type="number"],
[dir="rtl"] input[type="tel"],
[dir="rtl"] input[type="email"],
[dir="rtl"] input[type="url"],
[dir="rtl"] .display_currency,
[dir="rtl"] .ltr,
[dir="rtl"] .mobile,
[dir="rtl"] td.numeric,
[dir="rtl"] .tw-tabular-nums {
  direction: ltr;
  text-align: right;
  unicode-bidi: plaintext;
}
[dir="rtl"] .display_currency {
  display: inline-block;
}

/* Bootstrap 3 input-group corners flip in RTL (addon should round on the right). */
[dir="rtl"] .input-group .form-control:first-child,
[dir="rtl"] .input-group-addon:first-child,
[dir="rtl"] .input-group-btn:first-child > .btn {
  border-radius: 0 4px 4px 0;
}
[dir="rtl"] .input-group .form-control:last-child,
[dir="rtl"] .input-group-addon:last-child,
[dir="rtl"] .input-group-btn:last-child > .btn {
  border-radius: 4px 0 0 4px;
}

/* select2 single-select arrow + clear sit on the correct side in RTL. */
[dir="rtl"] .select2-container--default .select2-selection--single .select2-selection__arrow {
  left: 6px;
  right: auto;
}
[dir="rtl"] .select2-container--default .select2-selection--single .select2-selection__rendered {
  padding-right: 8px;
  padding-left: 20px;
  text-align: right;
}

/* Modal / box close (×) moves to the left edge in RTL. */
[dir="rtl"] .modal-header .close,
[dir="rtl"] .box-tools.pull-right {
  float: left;
}

/* DataTables: search box, length menu and pagination mirror correctly. */
[dir="rtl"] .dataTables_wrapper .dataTables_filter {
  text-align: left;
}
[dir="rtl"] .dataTables_wrapper .dataTables_length {
  text-align: right;
}
[dir="rtl"] .dataTables_wrapper .dataTables_paginate {
  float: left;
}

/* Checkbox / radio labels: gap on the correct side. */
[dir="rtl"] .checkbox label,
[dir="rtl"] .radio label {
  padding-right: 20px;
  padding-left: 0;
}
[dir="rtl"] .checkbox input[type="checkbox"],
[dir="rtl"] .radio input[type="radio"] {
  margin-right: -20px;
  margin-left: 0;
}

/* Bootstrap pull helpers used in content headers / action bars. */
[dir="rtl"] .content-header .pull-right,
[dir="rtl"] .box-header .pull-right {
  float: left !important;
}

/* Toastr notifications stack on the correct side. */
[dir="rtl"] #toast-container > .toast {
  direction: rtl;
  text-align: right;
}

/* ---------------------------------------------------------------------------
   Help (i) popovers drift to the far right in RTL because rtl.css forces
   `.popover{left:auto;right:0}`, and in an RTL container that `right:0` beats
   Bootstrap's inline `left`. Clear `right` so the computed `left` positions the
   popover under its trigger. (LTR is unaffected — scoped to dir=rtl.)
   ------------------------------------------------------------------------- */
html[dir="rtl"] .popover {
  right: auto !important;
}
html[dir="rtl"] .popover.bottom > .arrow,
html[dir="rtl"] .popover.top > .arrow {
  right: auto;
  left: 50%;
  margin-left: -11px;
  margin-right: 0;
}

/* ---------------------------------------------------------------------------
   Profile menu: it uses physical `right-0`, which in RTL anchors the panel to
   the button's right edge and pushes a wide menu off the left of the screen.
   In RTL anchor it to the left edge so it opens under the button on-screen.
   ------------------------------------------------------------------------- */
[dir="rtl"] .bayan-user-menu {
  right: auto !important;
  left: 0 !important;
}

/* Profile menu: wide enough for the Arabic "signed in as" line, never wider
   than the viewport, and text wraps instead of clipping. */
.bayan-user-menu {
  width: 16rem !important;
  max-width: calc(100vw - 1.5rem);
}
.bayan-user-menu p {
  white-space: normal;
  overflow-wrap: anywhere;
}
.bayan-user-menu p.tw-truncate {
  white-space: nowrap;
}
[dir="rtl"] .bayan-user-menu,
[dir="rtl"] .bayan-user-menu p,
[dir="rtl"] .bayan-user-menu a {
  text-align: right;
}