/** * ltr.css — English (LTR) layout for Mashvim VeTasim * --------------------------------------------------- * Every rule here is scoped under html[dir="ltr"], so this file has * ZERO effect on the Hebrew (RTL) site. It mirrors the handful of * direction-specific rules from style.css so the English site flips * fully left-to-right, like the big international booking sites. * * (The language toggle button styles at the bottom apply in both * languages — they are intentionally not scoped.) */ /* ═══ THE MASTER FLIP ═══ style.css sets `body { direction: rtl; }` explicitly, which overrides the dir="ltr" attribute set on . This rule restores the flip — everything below fine-tunes the details. */ html[dir="ltr"] body { direction: ltr; } /* ── Text alignment ── */ html[dir="ltr"] .input-group, html[dir="ltr"] .sd-btn, html[dir="ltr"] .sd-btn-label, html[dir="ltr"] .dashboard-table th, html[dir="ltr"] .dashboard-table td { text-align: left !important; } /* ── Scroll progress bar fills left → right ── */ html[dir="ltr"] #scrollProgressBar { float: left; } /* ── Header: auth area separator flips sides ── */ html[dir="ltr"] .header-auth-area { padding-left: 0; border-left: none; padding-right: 16px; border-right: 1px solid var(--border-color); } html[dir="ltr"] .top-input-group i { margin-left: 0; margin-right: 8px; } /* ── Sidebar active item accent bar ── */ html[dir="ltr"] .sidebar a.active { border-right: none !important; border-left: 4px solid var(--gold) !important; } /* ── Table cell separators ── */ html[dir="ltr"] .dashboard-table td, html[dir="ltr"] .dashboard-table th { border-left: none; border-right: 1px solid var(--border-soft); } html[dir="ltr"] .dashboard-table td:last-child, html[dir="ltr"] .dashboard-table th:last-child { border-right: none; } /* ── Trip card: price column separator + gold accent bar ── */ html[dir="ltr"] .trip-price-section { border-right: none; padding-right: 0; border-left: 1px solid var(--border-color); padding-left: 28px; } /* ── Toasts accent ── */ html[dir="ltr"] .custom-toast, html[dir="ltr"] [id^="custom-toast"] > div { border-right: none; border-left: 4px solid var(--gold); } /* ── Inputs with icon padding (search fields) ── */ html[dir="ltr"] input.has-icon, html[dir="ltr"] .icon-input input { padding-left: 14px; padding-right: 35px; } /* ── Mobile menu drawer: slides in from the RIGHT in LTR ── */ @media (max-width: 992px) { html[dir="ltr"] .main-nav { right: auto; left: -320px; transition: left var(--anim-med) ease; border-left: none; border-right: 1px solid var(--border-color); box-shadow: 10px 0 40px rgba(0, 0, 0, 0.1) !important; } html[dir="ltr"] .main-nav.open { left: 0; right: auto; } html[dir="ltr"] .close-mobile-menu { right: auto; left: 20px; } html[dir="ltr"] .user-greeting { padding-left: 0 !important; padding-right: 10px !important; } html[dir="ltr"] .time-box:nth-child(2) { text-align: left; align-items: flex-end; } html[dir="ltr"] .route-line-icon { transform: translate(-50%, -50%) scaleX(1); } html[dir="ltr"] .filters-sidebar { right: auto; left: 0; } html[dir="ltr"] .close-filter-btn { left: auto; right: 15px; } html[dir="ltr"] .pax-popup { right: auto !important; left: 2.5vw !important; } } /* ── Small typographic niceties for English ── */ html[dir="ltr"] body { letter-spacing: 0.1px; } /* ═══════════════════════════════════════════════════════════ Language toggle button (applies in BOTH languages) ═══════════════════════════════════════════════════════════ */ .mvt-lang-toggle { display: inline-flex; align-items: center; gap: 7px; background: transparent; border: 1px solid var(--border-color, #DCE7F2); color: var(--text-main, #0F172A); border-radius: 50px; padding: 7px 14px; font-family: inherit; font-size: 13px; font-weight: 800; cursor: pointer; transition: all 0.2s ease; white-space: nowrap; line-height: 1; } .mvt-lang-toggle i { color: var(--gold, #B48629); font-size: 14px; } .mvt-lang-toggle:hover { border-color: var(--gold, #B48629); box-shadow: 0 0 0 3px rgba(180, 134, 41, 0.12); } @media (max-width: 992px) { .mvt-lang-toggle { padding: 6px 11px; font-size: 12px; } .mvt-lang-toggle .mvt-lang-label { display: inline; } } /* ═══ v2: page-level RTL rules that live inside the PHP pages ═══ */ /* Hot-trips carousel cards (index.php defines direction:rtl on them) */ html[dir="ltr"] .hot-trip-card { direction: ltr; text-align: left; } /* Passenger-mix dropdown buttons */ html[dir="ltr"] .pax-btn, html[dir="ltr"] #hotelPaxDropdown .pax-btn span { text-align: left; } /* Booking page columns force direction:rtl internally */ html[dir="ltr"] .booking-main, html[dir="ltr"] .price-sidebar { direction: ltr; } /* Client-area flight card: amenities column separator flips */ html[dir="ltr"] .flight-amenities { border-right: none; padding-right: 0; text-align: left; border-left: 1px solid var(--border-color); padding-left: 15px; } /* Inline styles written for RTL — mirrored wholesale in English mode */ html[dir="ltr"] [style*="direction:rtl"], html[dir="ltr"] [style*="direction: rtl"] { direction: ltr !important; } html[dir="ltr"] [style*="text-align:right"], html[dir="ltr"] [style*="text-align: right"] { text-align: left !important; } html[dir="ltr"] [style*="margin-right:auto"] { margin-right: 0 !important; margin-left: auto !important; } /* Accessibility panel (footer.php) — flips with the site */ html[dir="ltr"] .acc-panel { direction: ltr; } /* ═══ v4: flight direction — the plane flies left→right in English ═══ */ html[dir="ltr"] .route-line-icon { transform: scaleX(1); } @media (max-width: 850px) { html[dir="ltr"] .route-line-icon { transform: translate(-50%, -50%) scaleX(1); } } /* Inline RTL spacing (style="margin-...") mirrored in English mode */ html[dir="ltr"] [style*="margin-left:3px"] { margin-left:0 !important; margin-right:3px !important; } html[dir="ltr"] [style*="margin-left:4px"] { margin-left:0 !important; margin-right:4px !important; } html[dir="ltr"] [style*="margin-left:5px"] { margin-left:0 !important; margin-right:5px !important; } html[dir="ltr"] [style*="margin-left:6px"] { margin-left:0 !important; margin-right:6px !important; } html[dir="ltr"] [style*="margin-left:8px"] { margin-left:0 !important; margin-right:8px !important; } html[dir="ltr"] [style*="margin-left:10px"] { margin-left:0 !important; margin-right:10px !important; } html[dir="ltr"] [style*="margin-right:3px"]:not([style*="auto"]) { margin-right:0 !important; margin-left:3px !important; } html[dir="ltr"] [style*="margin-right:4px"]:not([style*="auto"]) { margin-right:0 !important; margin-left:4px !important; } html[dir="ltr"] [style*="margin-right:5px"]:not([style*="auto"]) { margin-right:0 !important; margin-left:5px !important; } html[dir="ltr"] [style*="margin-right:6px"]:not([style*="auto"]) { margin-right:0 !important; margin-left:6px !important; } html[dir="ltr"] [style*="margin-right:8px"]:not([style*="auto"]) { margin-right:0 !important; margin-left:8px !important; } html[dir="ltr"] [style*="margin-right:10px"]:not([style*="auto"]) { margin-right:0 !important; margin-left:10px !important; }