/*
 * RTL Stylesheet — Arabic (العربية)
 * Loaded automatically by WordPress when text direction is RTL.
 */

/* ── 1. Base direction & font ─────────────────────────────────────────────── */

body,
html {
    direction: rtl;
    text-align: right;
    font-family: 'Cairo', 'Tajawal', 'Segoe UI', sans-serif;
}

/* ── 2. Header ────────────────────────────────────────────────────────────── */

.navbar,
.navbar-nav,
.header-inner,
.header-top,
.main-header .container,
.main-header .row {
    direction: rtl;
}

.navbar-nav {
    flex-direction: row-reverse;
}

.navbar-nav .nav-item .nav-link {
    padding-right: 15px;
    padding-left: 15px;
}

.dropdown-menu {
    right: 0;
    left: auto;
    text-align: right;
}

.header-number {
    flex-direction: row-reverse;
}

.header-number i {
    margin-left: 8px;
    margin-right: 0;
}

.gf-lang-switcher {
    margin-left: 0;
    margin-right: 14px;
}

/* ── 3. Breadcrumb ────────────────────────────────────────────────────────── */

.breadcrumb {
    flex-direction: row-reverse;
    justify-content: flex-end;
}

.breadcrumb-item + .breadcrumb-item::before {
    float: right;
    padding-left: 8px;
    padding-right: 0;
    content: "\f284"; /* bi-chevron-left for RTL */
}

/* ── 4. Bootstrap utilities flip ──────────────────────────────────────────── */

.me-1 { margin-left: 0.25rem !important; margin-right: 0 !important; }
.me-2 { margin-left: 0.5rem  !important; margin-right: 0 !important; }
.me-3 { margin-left: 1rem    !important; margin-right: 0 !important; }
.me-4 { margin-left: 1.5rem  !important; margin-right: 0 !important; }
.ms-1 { margin-right: 0.25rem !important; margin-left: 0 !important; }
.ms-2 { margin-right: 0.5rem  !important; margin-left: 0 !important; }
.ms-3 { margin-right: 1rem    !important; margin-left: 0 !important; }
.ms-4 { margin-right: 1.5rem  !important; margin-left: 0 !important; }
.ms-auto { margin-right: auto !important; margin-left: 0 !important; }
.ps-3 { padding-right: 1rem  !important; padding-left: 0 !important; }
.pe-3 { padding-left: 1rem   !important; padding-right: 0 !important; }
.text-start { text-align: right !important; }
.text-end   { text-align: left  !important; }
.float-start { float: right !important; }
.float-end   { float: left  !important; }

/* ── 5. Service Archive Page ──────────────────────────────────────────────── */

.srv-toolbar {
    flex-direction: row-reverse;
}

.srv-sections {
    flex-direction: row-reverse;
}

.srv-sections .ms-auto {
    margin-right: auto !important;
    margin-left: 0    !important;
}

.srv-cat-left-icon {
    left: auto;
    right: 16px;
}

.srv-cat-select {
    padding-left: 42px  !important;
    padding-right: 40px !important;
}

.srv-cat-select-icon {
    right: auto;
    left: 16px;
}

.services-search-icon {
    left: auto;
    right: 14px;
}

.services-search-input {
    padding-left:  42px !important;
    padding-right: 44px !important;
}

.services-search-clear {
    right: auto;
    left: 14px;
}

.srv-card-body {
    border-left: none;
    border-right: 3px solid var(--themeht-primary-color);
    text-align: right;
}

.srv-details-link {
    flex-direction: row-reverse;
}

/* ── 6. Service Single Page ───────────────────────────────────────────────── */

.srv-single-ribbon {
    flex-direction: row-reverse;
}

.srv-info-grid {
    direction: rtl;
}

.srv-info-item {
    flex-direction: row-reverse;
    text-align: right;
}

.srv-back-btn {
    flex-direction: row-reverse;
}

.srv-nav-next {
    align-items: flex-start;
    text-align: right;
}

.srv-nav-prev {
    align-items: flex-end;
    text-align: left;
}

.srv-nav-inner {
    flex-direction: row-reverse;
}

.srv-sidenav-link {
    flex-direction: row-reverse;
    text-align: right;
    padding-right: 16px;
    padding-left: 0;
}

.srv-sidenav-link:hover {
    padding-right: 20px;
    padding-left: 0;
}

.srv-acc-trigger {
    flex-direction: row-reverse;
    text-align: right;
}

.srv-acc-link {
    flex-direction: row-reverse;
    padding-right: 28px;
    padding-left: 16px;
    text-align: right;
}

.srv-acc-count {
    margin-right: auto;
    margin-left: 0;
}

.srv-sidebar-heading {
    flex-direction: row-reverse;
}

.srv-sidebar-all-link {
    flex-direction: row-reverse;
}

/* ── 7. Alpha filter ──────────────────────────────────────────────────────── */

.srv-alpha-filter {
    flex-direction: row-reverse;
}

/* Hide alpha filter on Arabic — service titles are in English, A–Z is not useful */
.srv-alpha-hidden {
    display: none !important;
}

/* ── 8. Footer ────────────────────────────────────────────────────────────── */

.gulflab-footer .row,
.gf-footer-col {
    direction: rtl;
    text-align: right;
}

/* Column heading underline — anchor to right in RTL */
.gf-col-heading::after {
    left: auto;
    right: 0;
}

/* Services stat — flip left border to right */
.gf-services-stat {
    border-left: none;
    border-right: 3px solid var(--themeht-primary-color);
    border-radius: 10px 0 0 10px;
}

/* Contact list items */
.gf-contact-list li {
    flex-direction: row-reverse;
    text-align: right;
}

.gf-contact-item {
    flex-direction: row-reverse;
}

.gf-contact-item i {
    margin-left: 10px;
    margin-right: 0;
}

/* Quick links widget: flip chevron to point left (RTL forward) */
.gf-widget-wrap ul li a::before {
    content: '\F284'; /* bi-chevron-left */
}

/* Widget heading underline — anchor to right */
.gf-widget-wrap .widget-title::after,
.gf-widget-wrap h2::after,
.gf-widget-wrap h3::after {
    left: auto;
    right: 0;
}

/* View all link — arrow already handled by global .bi-arrow-right flip */
.gf-view-all-link {
    flex-direction: row-reverse;
}

/* Socials — align to right side */
.gf-socials {
    justify-content: flex-start;
}

.gf-social-links {
    justify-content: flex-start;
}

/* Branch cards */
.gf-branch-card {
    text-align: right;
}

.gf-branch-header {
    flex-direction: row-reverse;
}

.gf-branch-actions {
    margin-right: auto;
    margin-left: 0;
}

/* Branch details list items — icon on right */
.gf-branch-details li {
    flex-direction: row-reverse;
    text-align: right;
}

/* Service highlights list items */
.gf-services-highlights li {
    flex-direction: row-reverse;
    text-align: right;
}

/* Copyright — center stays center, nothing to flip */

.footer-widget ul {
    text-align: right;
    padding-right: 0;
}

/* ── 9. Doctors page ──────────────────────────────────────────────────────── */

.doctors-search-wrap .search-icon {
    left: auto;
    right: 14px;
}

.doctors-search-input {
    padding-left:  42px !important;
    padding-right: 44px !important;
}

/* ── 10. General content ──────────────────────────────────────────────────── */

.page-title .theme-breadcrumb-box {
    text-align: right;
}

.section-title,
.section-title h2,
.section-title p {
    text-align: right;
}

/* Arrow icons — flip direction in RTL */
.bi-arrow-right::before { content: "\f12f"; } /* becomes arrow-left */
.bi-arrow-left::before  { content: "\f138"; } /* becomes arrow-right */
.bi-chevron-right::before { content: "\f284"; }
.bi-chevron-left::before  { content: "\f285"; }

/* ── 11. Elementor RTL overrides ──────────────────────────────────────────── */
/*
 * NOTE: Elementor already handles RTL via body.rtl selectors in its generated CSS.
 * We only override specific cases where Elementor's built-in RTL is insufficient.
 */

/* Fix icon list items that contain directional icons */
.elementor-widget-icon-list .elementor-icon-list-item {
    flex-direction: row-reverse;
}

.elementor-widget-icon-list .elementor-icon-list-item .elementor-icon-list-icon {
    margin-left: 10px;
    margin-right: 0;
}

/* ── 12. Mega Menu RTL ────────────────────────────────────────────────────── */

/* Flip the two-column layout: nav sidebar moves to the RIGHT */
.mega-layout {
    flex-direction: row-reverse !important;
}

/* Sidebar right border becomes left border */
.mega-nav {
    border-right: none !important;
    border-left: 1px solid rgba(0,0,0,0.07) !important;
    text-align: right;
}

/* Nav item active indicator: flip left border to right */
.mega-nav-item {
    border-left: none !important;
    border-right: 3px solid transparent !important;
    flex-direction: row-reverse !important;
    text-align: right;
}

.mega-nav-item:hover,
.mega-nav-item.is-active {
    border-right-color: var(--themeht-primary-color) !important;
    border-left-color: transparent !important;
}

/* Arrow points left in RTL */
.mega-nav-arrow {
    transform: scaleX(-1);
}

/* Pane header: flip to RTL */
.mega-pane-header {
    flex-direction: row-reverse !important;
    text-align: right;
}

/* Service links: flip icon direction */
.mega-service-link {
    flex-direction: row-reverse !important;
}

.mega-service-link:hover i {
    transform: translateX(-3px) !important;
}

/* Regular nav dropdown submenus */
.navbar-nav .dropdown-menu {
    right: 0 !important;
    left: auto !important;
    text-align: right;
}

/* Mobile drill-down: slide in from LEFT in RTL */
.mdp-panel {
    right: auto !important;
    left: 0 !important;
    transform: translateX(-101%) !important;
    box-shadow: 4px 0 24px rgba(0,0,0,0.15) !important;
}

.mdp-bg {
    right: auto !important;
    left: 0 !important;
}

.mdp-panel.is-open    { transform: translateX(0) !important; }
.mdp-panel.is-closing { transform: translateX(-101%) !important; }

/* Mobile header: flip */
.mdp-header {
    flex-direction: row-reverse !important;
}

/* Mobile cat buttons: flip */
.mdp-list > li > button.mdp-cat-btn {
    flex-direction: row-reverse !important;
    text-align: right;
}

/* Mobile chevron: flip */
.mdp-arrow {
    transform: scaleX(-1);
}
