/* Modal and Offcanvas Header Adjustments */
/* lang.css - MODAL & OFFCANVAS GLOBAL FIX */

.m/* ============================================================
   FINAL GLOBAL MODAL HEADER FIX (FOR RTL BOOTSTRAP)
   ============================================================ */

/* 1. Reset the header container */
.modal-header,
.offcanvas-header {
  display: flex !important;
  justify-content: space-between !important;
  align-items: center !important;
}

/* 2. THE CLUMPING KILLER: 
   Bootstrap RTL adds 'margin-right: auto' to the close button.
   We must kill it to stop the 'X' from sticking to the title. */
.modal-header .btn-close,
.offcanvas-header .btn-close {
  margin-left: 0 !important; 
  margin-right: 0 !important; 
  flex-shrink: 0 !important;
}

/* 3. THE JUSTIFICATION FIX:
   Setting flex-grow: 1 forces the title to fill the space
   and push the 'X' to the far edge. */
.modal-title,
.offcanvas-title {
  margin-left: 0 !important;
  margin-right: 0 !important;
  flex-grow: 1 !important; 
}

/* 4. ENGLISH (LTR) 
   Visual Goal: [Title] <-----------> [X]
   Logic: row-reverse flips the 1st element (Title) to the LEFT. */
[dir="ltr"] .modal-header,
[dir="ltr"] .offcanvas-header {
  flex-direction: row-reverse !important;
}
[dir="ltr"] .modal-title {
  text-align: left !important;
}

/* 5. HEBREW (RTL) 
   Visual Goal: [X] <-----------> [Title]
   Logic: row naturally starts on the RIGHT in this library. */
[dir="rtl"] .modal-header,
[dir="rtl"] .offcanvas-header {
  flex-direction: row !important;
}
[dir="rtl"] .modal-title {
  text-align: right !important;
}