/* AbanRah V20 — authoritative responsive shell and bidi containment.
   This file is intentionally loaded last. It replaces the scattered shell
   hotfixes that previously lived in layout.html and older version files. */

:root {
  --ar-primary: #243972;
  --ar-primary-700: #1b2c5b;
  --ar-primary-800: #142249;
  --ar-primary-soft: #eef1f9;
  --ar-sidebar-width: 292px;
  --ar-sidebar-collapsed: 88px;
}

html,
body.abanrah-ui {
  width: 100%;
  max-width: 100%;
  min-width: 0;
  overflow-x: hidden;
}

body.abanrah-ui *,
body.abanrah-ui *::before,
body.abanrah-ui *::after { box-sizing: border-box; }

/* ---------- Desktop application shell ---------- */
@media (min-width: 992px) {
  body.abanrah-app-body .abanrah-app-shell {
    /* Keep physical column placement stable; restore reading direction inside children. */
    direction: ltr !important;
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) var(--ar-sidebar-width) !important;
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
    min-height: 100vh !important;
    align-items: start !important;
  }

  html[dir="ltr"] body.abanrah-app-body .abanrah-app-shell {
    direction: ltr !important;
    grid-template-columns: var(--ar-sidebar-width) minmax(0, 1fr) !important;
  }

  html[dir="rtl"] body.abanrah-app-body .abanrah-sidebar,
  html[dir="rtl"] body.abanrah-app-body .abanrah-workspace { direction: rtl !important; }
  html[dir="ltr"] body.abanrah-app-body .abanrah-sidebar,
  html[dir="ltr"] body.abanrah-app-body .abanrah-workspace { direction: ltr !important; }

  body.abanrah-app-body .abanrah-sidebar {
    position: sticky !important;
    inset: auto !important;
    top: 0 !important;
    grid-column: 2 !important;
    grid-row: 1 !important;
    width: var(--ar-sidebar-width) !important;
    min-width: var(--ar-sidebar-width) !important;
    max-width: var(--ar-sidebar-width) !important;
    height: 100vh !important;
    margin: 0 !important;
    border-inline-start: 1px solid rgba(255,255,255,.08) !important;
    border-inline-end: 0 !important;
    box-shadow: -12px 0 35px rgba(10,40,48,.13) !important;
    z-index: 1040 !important;
  }

  html[dir="ltr"] body.abanrah-app-body .abanrah-sidebar {
    grid-column: 1 !important;
    border-inline-start: 0 !important;
    border-inline-end: 1px solid rgba(255,255,255,.08) !important;
    box-shadow: 12px 0 35px rgba(10,40,48,.13) !important;
  }

  body.abanrah-app-body .abanrah-workspace {
    position: relative !important;
    grid-column: 1 !important;
    grid-row: 1 !important;
    display: flex !important;
    flex-direction: column !important;
    width: auto !important;
    min-width: 0 !important;
    max-width: 100% !important;
    min-height: 100vh !important;
    margin: 0 !important;
    overflow: hidden !important;
  }

  html[dir="ltr"] body.abanrah-app-body .abanrah-workspace { grid-column: 2 !important; }

  body.sidebar-collapsed.abanrah-app-body .abanrah-app-shell {
    grid-template-columns: minmax(0, 1fr) var(--ar-sidebar-collapsed) !important;
  }
  html[dir="ltr"] body.sidebar-collapsed.abanrah-app-body .abanrah-app-shell {
    grid-template-columns: var(--ar-sidebar-collapsed) minmax(0, 1fr) !important;
  }
  body.sidebar-collapsed.abanrah-app-body .abanrah-sidebar {
    width: var(--ar-sidebar-collapsed) !important;
    min-width: var(--ar-sidebar-collapsed) !important;
    max-width: var(--ar-sidebar-collapsed) !important;
  }

  body.abanrah-app-body .abanrah-sidebar-backdrop { display: none !important; }
}

/* ---------- Mobile / tablet drawer ---------- */
@media (max-width: 991.98px) {
  body.abanrah-app-body .abanrah-app-shell { display: block !important; width: 100% !important; }
  body.abanrah-app-body .abanrah-workspace,
  body.sidebar-collapsed.abanrah-app-body .abanrah-workspace {
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
    margin: 0 !important;
  }

  body.abanrah-app-body .abanrah-sidebar {
    position: fixed !important;
    top: 0 !important;
    bottom: 0 !important;
    /* The drawer lives on the reading-start edge: right in RTL, left in LTR. */
    inset-inline-start: 0 !important;
    inset-inline-end: auto !important;
    width: min(88vw, 310px) !important;
    min-width: 0 !important;
    max-width: min(88vw, 310px) !important;
    transform: translateX(105%) !important;
  }
  html[dir="ltr"] body.abanrah-app-body .abanrah-sidebar {
    inset-inline-start: 0 !important;
    inset-inline-end: auto !important;
    transform: translateX(-105%) !important;
  }
  body.sidebar-open.abanrah-app-body .abanrah-sidebar,
  html[dir="ltr"] body.sidebar-open.abanrah-app-body .abanrah-sidebar { transform: translateX(0) !important; }

  body.sidebar-collapsed.abanrah-app-body .abanrah-sidebar { width: min(88vw, 310px) !important; }
  body.sidebar-collapsed.abanrah-app-body .abanrah-brand-copy,
  body.sidebar-collapsed.abanrah-app-body .abanrah-user-copy,
  body.sidebar-collapsed.abanrah-app-body .abanrah-user-settings,
  body.sidebar-collapsed.abanrah-app-body .abanrah-nav-label,
  body.sidebar-collapsed.abanrah-app-body .abanrah-nav-link span,
  body.sidebar-collapsed.abanrah-app-body .abanrah-nav-chevron,
  body.sidebar-collapsed.abanrah-app-body .abanrah-sidebar-foot span { display: initial !important; }

  body.abanrah-app-body .abanrah-sidebar-backdrop {
    position: fixed !important;
    inset: 0 !important;
    z-index: 1035 !important;
    display: block !important;
    visibility: hidden;
    opacity: 0;
    pointer-events: none;
    background: rgba(5,28,34,.48);
    backdrop-filter: blur(2px);
    transition: opacity .2s ease, visibility .2s ease;
  }
  body.sidebar-open.abanrah-app-body .abanrah-sidebar-backdrop {
    visibility: visible;
    opacity: 1;
    pointer-events: auto;
  }
}

/* ---------- Direction-aware navigation ---------- */
.abanrah-nav-link { text-align: start !important; }
.abanrah-nav-chevron { margin-inline-start: auto !important; margin-inline-end: 0 !important; }
.abanrah-submenu { padding-inline-start: 34px !important; padding-inline-end: 0 !important; }
.abanrah-submenu a {
  border-inline-start: 1px solid rgba(255,255,255,.11) !important;
  border-inline-end: 0 !important;
}
.abanrah-submenu a:hover,
.abanrah-submenu a.is-active { border-inline-start-color: var(--ar-accent) !important; }
.abanrah-nav-link:hover { transform: translateX(-2px); }
html[dir="ltr"] .abanrah-nav-link:hover { transform: translateX(2px); }
.abanrah-nav-link.is-active { box-shadow: inset -3px 0 0 var(--ar-accent) !important; }
html[dir="ltr"] .abanrah-nav-link.is-active { box-shadow: inset 3px 0 0 var(--ar-accent) !important; }

/* ---------- Workspace containment ---------- */
body.abanrah-app-body .abanrah-main,
body.abanrah-app-body .abanrah-content,
body.abanrah-app-body .abanrah-content > * {
  min-width: 0 !important;
  max-width: 100%;
}
body.abanrah-app-body .abanrah-main,
body.abanrah-app-body .abanrah-content { width: 100% !important; }
body.abanrah-app-body .abanrah-content { overflow-x: hidden !important; }

/* All data tables get a local horizontal scroller, never the page/body. */
body.abanrah-ui .abanrah-table-scroll,
body.abanrah-ui .ar-table-scroll,
body.abanrah-ui .table-responsive {
  display: block !important;
  width: 100% !important;
  max-width: 100% !important;
  min-width: 0 !important;
  overflow-x: auto !important;
  overflow-y: hidden !important;
  overscroll-behavior-inline: contain;
  -webkit-overflow-scrolling: touch;
  scrollbar-gutter: stable both-edges;
}
body.abanrah-ui .abanrah-table-scroll > table,
body.abanrah-ui .ar-table-scroll > table,
body.abanrah-ui .table-responsive > table {
  width: max-content !important;
  min-width: 100% !important;
  max-width: none !important;
  margin-inline: 0 !important;
}
body.abanrah-ui .abanrah-data-table { direction: inherit; }

/* The master-travel page used to be the main offender: keep its table entirely
   inside the workspace and let the wrapper own horizontal scrolling. */
body.abanrah-ui .ar-master-travels-scroll { position: relative; isolation: isolate; }
body.abanrah-ui .ar-master-travels-table {
  display: table !important;
  width: max-content !important;
  min-width: 100% !important;
  max-width: none !important;
  table-layout: auto !important;
  direction: inherit !important;
}

/* ---------- General responsive content repairs ---------- */
body.abanrah-ui img,
body.abanrah-ui video,
body.abanrah-ui canvas { max-width: 100%; }
body.abanrah-ui input,
body.abanrah-ui select,
body.abanrah-ui textarea { max-width: 100%; }
body.abanrah-ui .d-flex { min-width: 0; }
body.abanrah-ui .filter-container .d-flex,
body.abanrah-ui .abanrah-filter-form .d-flex,
body.abanrah-ui .abanrah-form-actions { row-gap: .65rem; }

@media (max-width: 767.98px) {
  body.abanrah-ui .filter-container { padding: 14px !important; }
  body.abanrah-ui .filter-container .form-group,
  body.abanrah-ui .abanrah-filter-form .form-group { width: 100%; margin-inline: 0 !important; }
  body.abanrah-ui .filter-container .form-control,
  body.abanrah-ui .abanrah-filter-form .form-control,
  body.abanrah-ui .filter-container .select2-container,
  body.abanrah-ui .abanrah-filter-form .select2-container {
    width: 100% !important;
    max-width: 100% !important;
  }
  body.abanrah-ui .filter-container .d-flex.justify-content-center,
  body.abanrah-ui .abanrah-filter-form .d-flex.justify-content-center {
    width: 100%;
    align-items: stretch !important;
  }
  body.abanrah-ui .filter-container .d-flex.justify-content-center > .btn,
  body.abanrah-ui .abanrah-filter-form .d-flex.justify-content-center > .btn,
  body.abanrah-ui .filter-container .d-flex.justify-content-center > a,
  body.abanrah-ui .abanrah-filter-form .d-flex.justify-content-center > a {
    flex: 1 1 180px;
    justify-content: center;
  }
  body.abanrah-ui .pagination,
  body.abanrah-ui .pagination .step-links { max-width: 100%; flex-wrap: wrap; justify-content: center; }
}

/* ---------- Top bar and footer ---------- */
.abanrah-topbar { min-width: 0; }
.abanrah-topbar-start { min-width: 0; flex: 1 1 auto; }
.abanrah-topbar-actions { min-width: 0; flex: 0 1 auto; }
.abanrah-topbar-title-wrap { min-width: 0; }
.abanrah-profile-chip { padding-inline: 5px 10px !important; }
.abanrah-public-nav .abanrah-public-login { margin-inline-start: 8px !important; margin-inline-end: 0 !important; }

@media (max-width: 575.98px) {
  .abanrah-content { padding: 12px !important; }
  .abanrah-topbar { gap: 8px !important; padding-inline: 8px !important; }
  .abanrah-topbar-title { font-size: .88rem !important; }
  .abanrah-profile-chip { padding-inline: 4px !important; }
  .abanrah-app-footer { flex-wrap: wrap; justify-content: center !important; text-align: center; }
}

/* ---------- Language selector ---------- */
body.abanrah-ui form.abanrah-language-switcher-v18 {
  display: inline-flex !important;
  flex-direction: row !important;
  direction: ltr !important;
  align-items: center !important;
  gap: 5px !important;
  min-height: 30px !important;
  padding: 0 !important;
  margin: 0 !important;
  color: #4f5d6b !important;
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
  white-space: nowrap !important;
}
body.abanrah-ui form.abanrah-language-switcher-v18 .abanrah-language-label {
  display: inline-flex !important;
  flex-direction: row !important;
  align-items: baseline !important;
  gap: 1px !important;
  margin-inline: 3px 0 !important;
  color: #596675 !important;
  font-size: .72rem !important;
  font-weight: 600 !important;
  unicode-bidi: isolate !important;
}
body.abanrah-ui form.abanrah-language-switcher-v18 .abanrah-language-colon { direction: ltr; }
body.abanrah-ui form.abanrah-language-switcher-v18 .abanrah-language-radio {
  position: absolute !important;
  inline-size: 1px !important;
  block-size: 1px !important;
  opacity: 0 !important;
  pointer-events: none !important;
}
body.abanrah-ui form.abanrah-language-switcher-v18 label.abanrah-language-option {
  min-width: 0 !important;
  min-height: 24px !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 3px !important;
  padding: 2px 5px !important;
  margin: 0 !important;
  color: #435164 !important;
  background: transparent !important;
  border: 1px solid #cfd7e1 !important;
  border-radius: 4px !important;
  box-shadow: none !important;
  cursor: pointer !important;
  font-size: .68rem !important;
  font-weight: 700 !important;
  line-height: 1 !important;
}
body.abanrah-ui form.abanrah-language-switcher-v18 label.abanrah-language-option:hover {
  background: #f8fafc !important;
  border-color: #aeb8c7 !important;
}
body.abanrah-ui form.abanrah-language-switcher-v18 label.abanrah-language-option.is-active {
  color: #243972 !important;
  background: transparent !important;
  border-color: #6f7c8d !important;
  font-weight: 850 !important;
}
body.abanrah-ui form.abanrah-language-switcher-v18 .abanrah-language-radio:focus-visible + label.abanrah-language-option {
  outline: 2px solid rgba(36,57,114,.22) !important;
  outline-offset: 1px !important;
}
body.abanrah-ui form.abanrah-language-switcher-v18 .abanrah-inline-flag {
  width: 19px !important;
  height: 12px !important;
  display: inline-flex !important;
  flex: 0 0 19px !important;
  overflow: hidden !important;
  border: 1px solid rgba(19,31,51,.18) !important;
  border-radius: 1px !important;
  background: transparent !important;
  box-shadow: none !important;
}
body.abanrah-ui form.abanrah-language-switcher-v18 .abanrah-inline-flag svg { width: 100% !important; height: 100% !important; display: block !important; }
body.abanrah-ui form.abanrah-language-switcher-v18 .abanrah-language-code { direction: ltr !important; unicode-bidi: isolate !important; }
.abanrah-footer-language { display: inline-flex; align-items: center; justify-content: center; min-width: 0; }
.abanrah-public-footer .abanrah-language-label { color: rgba(255,255,255,.84) !important; }
.abanrah-public-footer label.abanrah-language-option { color: #fff !important; border-color: rgba(255,255,255,.35) !important; }
.abanrah-public-footer label.abanrah-language-option:hover,
.abanrah-public-footer label.abanrah-language-option.is-active {
  color: #fff !important;
  background: rgba(255,255,255,.08) !important;
  border-color: rgba(255,255,255,.72) !important;
}
@media (max-width: 575.98px) {
  body.abanrah-ui form.abanrah-language-switcher-v18 { gap: 3px !important; }
  body.abanrah-ui form.abanrah-language-switcher-v18 .abanrah-language-label { display: none !important; }
  body.abanrah-ui form.abanrah-language-switcher-v18 label.abanrah-language-option { padding: 2px 4px !important; }
}

/* ---------- Bidi helpers for legacy Bootstrap-4-era markup ---------- */
html[dir="ltr"] body.abanrah-ui .text-right { text-align: left !important; }
html[dir="ltr"] body.abanrah-ui .text-left { text-align: right !important; }
html[dir="rtl"] body.abanrah-ui .text-right { text-align: right !important; }
html[dir="rtl"] body.abanrah-ui .text-left { text-align: left !important; }
/* Inputs, tables and Select2 inherit the active document direction unless a
   field explicitly opts into LTR (telephone/email/IDs). */
html[dir="ltr"] body.abanrah-ui .abanrah-content table,
html[dir="ltr"] body.abanrah-ui .abanrah-content form,
html[dir="ltr"] body.abanrah-ui .select2-container { direction: ltr; }
html[dir="rtl"] body.abanrah-ui .abanrah-content table,
html[dir="rtl"] body.abanrah-ui .abanrah-content form,
html[dir="rtl"] body.abanrah-ui .select2-container { direction: rtl; }
body.abanrah-ui [dir="ltr"],
body.abanrah-ui input[type="tel"],
body.abanrah-ui input[type="email"],
body.abanrah-ui .ltr { direction: ltr !important; unicode-bidi: isolate; }

/* Logical replacements for the legacy Bootstrap spacing utilities most often
   used next to icons. This keeps icon/text gaps correct in both directions. */
html[dir="rtl"] body.abanrah-ui .mr-1 { margin-right: 0 !important; margin-left: .25rem !important; }
html[dir="rtl"] body.abanrah-ui .mr-2 { margin-right: 0 !important; margin-left: .5rem !important; }
html[dir="rtl"] body.abanrah-ui .mr-3 { margin-right: 0 !important; margin-left: 1rem !important; }
html[dir="rtl"] body.abanrah-ui .ml-1 { margin-left: 0 !important; margin-right: .25rem !important; }
html[dir="rtl"] body.abanrah-ui .ml-2 { margin-left: 0 !important; margin-right: .5rem !important; }
html[dir="rtl"] body.abanrah-ui .ml-3 { margin-left: 0 !important; margin-right: 1rem !important; }
html[dir="ltr"] body.abanrah-ui .mr-1 { margin-right: .25rem !important; margin-left: 0 !important; }
html[dir="ltr"] body.abanrah-ui .mr-2 { margin-right: .5rem !important; margin-left: 0 !important; }
html[dir="ltr"] body.abanrah-ui .mr-3 { margin-right: 1rem !important; margin-left: 0 !important; }
html[dir="ltr"] body.abanrah-ui .ml-1 { margin-left: .25rem !important; margin-right: 0 !important; }
html[dir="ltr"] body.abanrah-ui .ml-2 { margin-left: .5rem !important; margin-right: 0 !important; }
html[dir="ltr"] body.abanrah-ui .ml-3 { margin-left: 1rem !important; margin-right: 0 !important; }

body.abanrah-ui .abanrah-table-scroll:focus-visible,
body.abanrah-ui .ar-table-scroll:focus-visible {
  outline: 2px solid rgba(36,57,114,.35);
  outline-offset: 2px;
}

/* ---------- Remaining legacy direction repairs ---------- */
body.abanrah-ui .abanrah-page-title { text-align: start !important; }
body.abanrah-ui .abanrah-page-title::before {
  margin-inline-end: .7rem !important;
  margin-left: 0 !important;
  margin-right: 0 !important;
}
body.abanrah-ui .abanrah-main .alert { border-inline-start-width: 5px !important; }
body.abanrah-ui .abanrah-back-fab { left: auto !important; right: auto !important; inset-inline-end: 18px !important; }
body.abanrah-ui .ar-v8-section-nav a b { margin-inline-start: auto !important; margin-left: 0 !important; margin-right: 0 !important; }
body.abanrah-ui .ar-v8-fleet-table thead th,
body.abanrah-ui .notifications-table th { text-align: start !important; }
body.abanrah-ui .notifications-note { border-inline-start: 4px solid #243972 !important; border-right: 0 !important; border-left: 0 !important; }

html[dir="ltr"] body.abanrah-ui .ar-input-with-icon > i { left: 14px !important; right: auto !important; }
html[dir="ltr"] body.abanrah-ui .ar-input-with-icon .form-control { padding-left: 43px !important; padding-right: 47px !important; }
html[dir="ltr"] body.abanrah-ui .ar-password-toggle { right: 8px !important; left: auto !important; }
html[dir="ltr"] body.abanrah-ui .ar-service-card small { left: 24px !important; right: auto !important; }
html[dir="ltr"] body.abanrah-ui .ar-document-preview > span { left: 9px !important; right: auto !important; }
html[dir="ltr"] body.abanrah-ui .ar-v9-master-status { left: 13px !important; right: auto !important; }
@media (max-width: 991.98px) {
  body.abanrah-ui .abanrah-back-fab { inset-inline-end: 12px !important; }
}

@media print {
  body.abanrah-ui .abanrah-table-scroll,
  body.abanrah-ui .ar-table-scroll,
  body.abanrah-ui .table-responsive { overflow: visible !important; }
  body.abanrah-ui .abanrah-table-scroll > table,
  body.abanrah-ui .ar-table-scroll > table,
  body.abanrah-ui .table-responsive > table { width: 100% !important; min-width: 0 !important; }
}