/* tojlo crm rebrand + RTL styles (Plan 6).
 * Phase A: brand-neutral placeholder (real tojlo palette/logo lands with the brand asset set).
 * Phase B: the RTL block below is gated on <html dir="rtl"> (Persian) — extended there if stock
 * sao does not mirror the layout on its own.
 */

/* Phase B — the tojlo language switcher (EN/TR/FA), fixed top-corner, above sao chrome. */
#tojlo-lang-switch {
  position: fixed;
  top: 6px;
  right: 8px;
  z-index: 100000;
}
#tojlo-lang-switch select {
  font-size: 12px;
  padding: 2px 4px;
  border-radius: 4px;
  border: 1px solid rgba(0, 0, 0, 0.3);
  background: #fff;
  cursor: pointer;
}
html[dir="rtl"] #tojlo-lang-switch {
  right: auto;
  left: 8px;
}

/* NF6 — at phone widths the login modal spans nearly the whole viewport (measured at 375x812:
 * .modal-dialog occupies 10..365 x 10..286), so ANY top-corner position for the 24x24 badge
 * overlaps it (badge measured at 340..367 x 6..30). Clearing the modal by moving UP is impossible
 * — it would need `top: -14px`, i.e. off-screen. So below the tablet breakpoint the badge docks to
 * the BOTTOM corner instead, which the modal never reaches. The badge keeps its 24x24 WCAG 2.5.8
 * target size, and `right`/`left` are untouched so the RTL rule above still mirrors it.
 * >=768px is left alone: measured no overlap at 768 (badge 733..760 vs modal 84..684) or at 1440. */
@media (max-width: 767px) {
  #tojlo-lang-switch {
    top: auto;
    bottom: 8px;
  }
}

/* S11 CLS — RESERVE the board panels' height.
 *
 * `Sao.View.Board.Action` (sao/src/board.js:79-95) inserts each panel as
 * `.board-action.panel > .panel-heading + .panel-body` and fills `.panel-body` only once that
 * panel's own `ir.action.act_window.get` promise resolves. Measured on the S11 board: all three
 * panels render at bodyHeight=30 (empty), then jump to 783 / 225 / 1405 as their queues land —
 * each jump pushing the panels below it down. That sequential growth is the whole CLS 0.40-0.60
 * against a 0.1 budget; the panels' heights are content-derived and therefore unbounded.
 *
 * The board XML CANNOT express this: `ir/ui/board.rng` allows `<action>` exactly two attributes,
 * `name` and `colspan` — no height/size attribute exists, and an invalid attribute fails module
 * load with RELAXNG_ERR_INVALIDATTR. So the reservation is made here, in the overlay.
 *
 * A fixed `height` (not `max-height`) is required: `max-height` still lets an empty 30px body grow
 * to the cap, which is the shift we are removing. With a fixed height the panel occupies its final
 * size from the moment it is inserted, so the later content fill moves nothing. Each panel scrolls
 * its own queue — the dashboard is a summary; the full queue is one click away in S5/S7/S3. */
.board .board-action > .panel-body {
  height: 300px;
  overflow: auto;
}

/* WCAG 2.2 AA 1.4.3 — the tojlo brand mark and the navbar controls.
 *
 * Stock sao paints `.navbar-inverse` text/links `#6dd1d4` on the `@brand-primary: #267f82` navbar
 * (dist/tryton-sao.css) = 2.63:1 measured by axe, against a 4.5:1 requirement — flagged on `#title`
 * (this project's own "tojlo crm" brand mark) and on the user menu link.
 *
 * `#267f82` has a relative luminance of 0.1720, so 4.5:1 needs a foreground luminance >= 0.9491 —
 * i.e. only near-white qualifies. Computed against this background: #ffffff = 4.73:1 (passes),
 * #f5ffff = 4.65:1, #eafcfc = 4.47:1 (already fails), #d6f5f6 = 4.11:1. So white is the only tint
 * that clears AA here, and it is also already the brand contract's own default for text on the
 * primary colour (`brand_on_primary` defaults to "#ffffff", rebrand.js:292).
 *
 * Therefore: use `--brand-on-primary` when a tenant brand has been applied, and fall back to white
 * when none has — the previous behaviour left these rules unset for any user without a brand row,
 * which is exactly the un-themed state axe scanned. `!important` matches rebrand.js's sibling
 * rules and beats sao's `.navbar-inverse .navbar-nav > li > a`. */
.navbar-inverse #title,
.navbar-inverse .navbar-brand,
.navbar-inverse .navbar-text,
.navbar-inverse .navbar-nav > li > a,
.navbar-inverse .navbar-link,
.navbar-inverse .btn-link {
  color: var(--brand-on-primary, #fff) !important;
}

/* Phase B — RTL (Persian). Applied when the language switcher sets html[dir="rtl"]. */
html[dir="rtl"] body {
  direction: rtl;
  text-align: right;
}