/* ===========================================================================
   CRM5 — Right-to-Left overrides
   Loaded ONLY when the interface language is RTL (e.g. Arabic). The base
   bootstrap.min.css is LTR, and the big inline layout block in app.blade.php
   uses physical left/right, so this file mirrors the structural pieces that do
   not auto-flip from `direction: rtl` alone (the fixed sidebar, content margin,
   and the common Bootstrap spacing helpers).
   =========================================================================== */

html[dir="rtl"] body { direction: rtl; text-align: right; }

/* ── Fixed sidebar → right edge ──────────────────────────────────────────── */
html[dir="rtl"] .sidebar { left: auto; right: 16px; }
html[dir="rtl"] .main-wrapper { margin-left: 0; margin-right: 294px; padding: 0 0 20px 20px; }

/* Mini (collapsed) sidebar */
html[dir="rtl"] body.crm-sidebar-mini .sidebar { left: auto; right: 16px; }
html[dir="rtl"] body.crm-sidebar-mini .main-wrapper { margin-right: 98px; margin-left: 0; }

/* Mobile drawer slides in from the right */
@media (max-width: 900px) {
    html[dir="rtl"] .sidebar { right: -280px; left: auto; }
    html[dir="rtl"] body.crm-mobile-open .sidebar { right: 20px; left: auto; }
    html[dir="rtl"] body.crm-sidebar-mini .sidebar { right: -280px; left: auto; }
    html[dir="rtl"] .main-wrapper { margin-right: 0 !important; margin-left: 0 !important; padding-right: 20px; padding-left: 20px; }
}

/* ── Sidebar nav internals ───────────────────────────────────────────────── */
html[dir="rtl"] .s-nav-item,
html[dir="rtl"] .s-nav-group-hdr { text-align: right; }
html[dir="rtl"] .s-nav-caret { margin-left: 0; margin-right: auto; }
html[dir="rtl"] .s-nav-sub-inner { padding-right: 52px; padding-left: 8px; }
html[dir="rtl"] .s-nav-item:hover,
html[dir="rtl"] .s-nav-group-hdr:hover { transform: translateX(-2px); }
html[dir="rtl"] .s-nav-sub-link.active::before { left: auto; right: 2px; }

/* Mini-mode hover tooltip flips to the left of the rail */
html[dir="rtl"] body.crm-sidebar-mini .s-nav-item[data-label]:hover::after,
html[dir="rtl"] body.crm-sidebar-mini .s-nav-group-hdr[data-label]:hover::after {
    left: auto; right: 68px;
}

/* ── Right-side fly-out opens to the LEFT of the rail ────────────────────── */
html[dir="rtl"] .s-nav-group.flyout-open > .s-nav-sub.s-nav-fly { animation: lmbFlyRtl .15s ease; }
@keyframes lmbFlyRtl { from { opacity: 0; transform: translateX(8px); } to { opacity: 1; transform: none; } }

/* ── Common Bootstrap spacing helpers (physical in the LTR build) ────────── */
html[dir="rtl"] .me-1 { margin-right: 0 !important; margin-left: .25rem !important; }
html[dir="rtl"] .me-2 { margin-right: 0 !important; margin-left: .5rem !important; }
html[dir="rtl"] .me-3 { margin-right: 0 !important; margin-left: 1rem !important; }
html[dir="rtl"] .ms-1 { margin-left: 0 !important; margin-right: .25rem !important; }
html[dir="rtl"] .ms-2 { margin-left: 0 !important; margin-right: .5rem !important; }
html[dir="rtl"] .ms-3 { margin-left: 0 !important; margin-right: 1rem !important; }
html[dir="rtl"] .ms-auto { margin-left: 0 !important; margin-right: auto !important; }
html[dir="rtl"] .me-auto { margin-right: 0 !important; margin-left: auto !important; }

html[dir="rtl"] .ps-1 { padding-left: 0 !important; padding-right: .25rem !important; }
html[dir="rtl"] .ps-2 { padding-left: 0 !important; padding-right: .5rem !important; }
html[dir="rtl"] .ps-3 { padding-left: 0 !important; padding-right: 1rem !important; }
html[dir="rtl"] .pe-1 { padding-right: 0 !important; padding-left: .25rem !important; }
html[dir="rtl"] .pe-2 { padding-right: 0 !important; padding-left: .5rem !important; }
html[dir="rtl"] .pe-3 { padding-right: 0 !important; padding-left: 1rem !important; }

/* ── Text alignment helpers ──────────────────────────────────────────────── */
html[dir="rtl"] .text-start { text-align: right !important; }
html[dir="rtl"] .text-end { text-align: left !important; }

/* ── Dropdowns / tables ──────────────────────────────────────────────────── */
html[dir="rtl"] .dropdown-menu-end { right: auto !important; left: 0 !important; }
html[dir="rtl"] table.dataTable thead th,
html[dir="rtl"] .table thead th,
html[dir="rtl"] table.dataTable tbody td,
html[dir="rtl"] .table tbody td { text-align: right; }

/* Float helpers used in cards */
html[dir="rtl"] .float-end { float: left !important; }
html[dir="rtl"] .float-start { float: right !important; }

/* Inputs / form text read right-to-left */
html[dir="rtl"] .form-control,
html[dir="rtl"] .form-select { text-align: right; }

/* Inherently left-to-right data stays LTR even in an RTL page:
   phone numbers, emails, URLs, money/number inputs, code. */
html[dir="rtl"] [data-crm-phone],
html[dir="rtl"] input[type="tel"],
html[dir="rtl"] input[type="email"],
html[dir="rtl"] input[type="url"],
html[dir="rtl"] input[type="number"],
html[dir="rtl"] .iti,
html[dir="rtl"] code, html[dir="rtl"] pre, html[dir="rtl"] kbd {
    direction: ltr;
    text-align: right;
}
html[dir="rtl"] .iti { text-align: right; }

/* Icon spacing inside buttons/links flips so the icon sits before the text. */
html[dir="rtl"] .btn i[class*="ph-"].me-1,
html[dir="rtl"] .btn i[class*="ph-"].me-2 { margin-left: .3rem; margin-right: 0; }

/* Bootstrap input-group (search box, date range) reads right-to-left. */
html[dir="rtl"] .input-group { flex-direction: row-reverse; }

/* Form check (checkbox/radio) label sits to the right of the box. */
html[dir="rtl"] .form-check { padding-right: 1.5em; padding-left: 0; }
html[dir="rtl"] .form-check .form-check-input { float: right; margin-right: -1.5em; margin-left: 0; }

/* Modal close button moves to the left edge. */
html[dir="rtl"] .modal-header .btn-close { margin-right: auto; margin-left: 0; }

/* Toasts / alerts keep their accent on the reading-start (right) edge. */
html[dir="rtl"] .alert { text-align: right; }

/* Breadcrumb separators flip direction. */
html[dir="rtl"] .breadcrumb-item + .breadcrumb-item { padding-right: .5rem; padding-left: 0; }
html[dir="rtl"] .breadcrumb-item + .breadcrumb-item::before { float: right; padding-left: .5rem; padding-right: 0; }

/* ===========================================================================
   Per-portal structural flips (agent + subcontractor use unique classes, so
   they live here. super-admin and the client-owner portal share .sa-* class
   names, so their flips live inline in each of those two layouts.)
   =========================================================================== */

/* ── Agent (Partner) portal ──────────────────────────────────────────────── */
html[dir="rtl"] .ap-sidebar { left: auto; right: 16px; }
html[dir="rtl"] .ap-main { margin-left: 0; margin-right: 272px; padding: 0 0 20px 20px; }
@media (max-width: 900px) {
    html[dir="rtl"] .ap-main { margin-right: 0; padding-right: 20px; }
}

/* ── Subcontractor portal ────────────────────────────────────────────────── */
html[dir="rtl"] .sp-sidebar { left: auto; right: 16px; }
html[dir="rtl"] .sp-main { margin-left: 0; margin-right: calc(230px + 32px); padding: 24px 0 24px 24px; }
@media (max-width: 900px) {
    html[dir="rtl"] .sp-sidebar { display: none; }
    html[dir="rtl"] .sp-main { margin-right: 0; padding: 16px; }
}
