/* ============================================================
   PADiR Canva Theme — RTL Overrides (Arabic)
   Loaded only when is_rtl() is true
   ============================================================ */

/* ── Typography — Cairo on all RTL text ─────────────────────── */
/*
 * Canvas CSS and Bootstrap set font-family as literal values on many
 * elements, bypassing our CSS variable switch. The rules below use
 * html[dir="rtl"] prefix + !important to win over those explicit
 * declarations on every text-bearing element.
 * <i>, <code>, <pre>, <kbd>, <svg> are intentionally excluded to
 * preserve icon-font and monospace rendering.
 */
html[dir="rtl"] body,
html[dir="rtl"] h1, html[dir="rtl"] h2, html[dir="rtl"] h3,
html[dir="rtl"] h4, html[dir="rtl"] h5, html[dir="rtl"] h6,
html[dir="rtl"] p, html[dir="rtl"] a, html[dir="rtl"] span,
html[dir="rtl"] li, html[dir="rtl"] ul, html[dir="rtl"] ol,
html[dir="rtl"] td, html[dir="rtl"] th, html[dir="rtl"] caption,
html[dir="rtl"] label, html[dir="rtl"] legend, html[dir="rtl"] abbr,
html[dir="rtl"] input:not([type="hidden"]),
html[dir="rtl"] textarea, html[dir="rtl"] select,
html[dir="rtl"] button, html[dir="rtl"] nav,
html[dir="rtl"] blockquote, html[dir="rtl"] cite, html[dir="rtl"] q,
html[dir="rtl"] figcaption, html[dir="rtl"] address, html[dir="rtl"] time,
html[dir="rtl"] summary, html[dir="rtl"] details,
/* Canvas: buttons, nav, headings, slider, badges */
html[dir="rtl"] .button, html[dir="rtl"] .btn,
html[dir="rtl"] .menu-link, html[dir="rtl"] .menu-item > a,
html[dir="rtl"] .menu-container a, html[dir="rtl"] .sub-menu a,
html[dir="rtl"] .heading-block, html[dir="rtl"] .heading-block *,
html[dir="rtl"] .slider-caption, html[dir="rtl"] .slider-caption *,
html[dir="rtl"] .before-heading,
/* Bootstrap: badges, dropdowns, cards, breadcrumbs */
html[dir="rtl"] .badge,
html[dir="rtl"] .dropdown-item, html[dir="rtl"] .dropdown-menu,
html[dir="rtl"] .card-title, html[dir="rtl"] .card-text,
html[dir="rtl"] .card-body, html[dir="rtl"] .card-header,
html[dir="rtl"] .card-footer, html[dir="rtl"] .list-group-item,
html[dir="rtl"] .breadcrumb-item, html[dir="rtl"] .alert,
/* Theme: hero, sections, journal, vision, footer, header */
html[dir="rtl"] .section-title, html[dir="rtl"] .section-subtitle,
html[dir="rtl"] .section-badge,
html[dir="rtl"] .hero-title, html[dir="rtl"] .hero-subtitle,
html[dir="rtl"] .hero-badge,
html[dir="rtl"] .page-title-bar h1, html[dir="rtl"] .page-title-bar p,
html[dir="rtl"] .vision-card, html[dir="rtl"] .vision-card-badge,
html[dir="rtl"] .journal-title, html[dir="rtl"] .journal-desc,
html[dir="rtl"] .journal-issn, html[dir="rtl"] .journal-highlight-badge,
html[dir="rtl"] .journal-availability, html[dir="rtl"] .lang-switcher {
    font-family: 'Cairo', sans-serif !important;
    letter-spacing: 0 !important;
}

/* Bootstrap variable override — ensure Bootstrap components pick up Cairo */
html[dir="rtl"] {
    --bs-body-font-family: 'Cairo', sans-serif;
    --bs-font-sans-serif:  'Cairo', sans-serif;
}

/* ── Layout direction ───────────────────────────────────────── */
.section-title,
.section-subtitle,
.hero-title,
.hero-subtitle {
    text-align: start;
}
.section-heading-center .section-title,
.section-heading-center .section-subtitle {
    text-align: center;
}

/* ── Header RTL ─────────────────────────────────────────────── */
/* No auto margins needed — flex layout is handled via theme.css:
 * #logo { flex: 0 0 auto }, .primary-menu { flex-grow: 1 }, .header-misc { flex: 0 0 auto } */

/* Canvas menu items: remove uppercase text-transform and letter-spacing for Arabic.
 * Canvas sets --cnvs-primary-menu-tt: uppercase and --cnvs-primary-menu-ls: 1px.
 * Arabic has no case distinction and 1px letter-spacing breaks script connections. */
html[dir="rtl"] .menu-link,
html[dir="rtl"] .menu-container > .menu-item > a,
html[dir="rtl"] .sub-menu-container .menu-link {
    text-transform: none !important;
    letter-spacing: 0 !important;
}

/* ── Footer nav list RTL ────────────────────────────────────── */
.footer-links a {
    text-align: start;
}

/* ── Breadcrumbs ────────────────────────────────────────────── */
.breadcrumb-item + .breadcrumb-item::before {
    content: '\2039';
    padding-right: 0.5rem;
    padding-left: 0.5rem;
}

/* ── Goal item hover ────────────────────────────────────────── */
.goal-item:hover { transform: translateX(-4px); }

/* ── Blockquote ─────────────────────────────────────────────── */
.entry-content blockquote {
    border-left: none;
    border-right: 4px solid var(--pader-primary);
    border-radius: var(--pader-radius) 0 0 var(--pader-radius);
    padding-right: 1.5rem;
    padding-left: 1rem;
}

/* ── Journal availability bar ──────────────────────────────── */
.journal-availability {
    border-left: none;
    border-right: 3px solid var(--pader-primary);
    border-radius: var(--pader-radius-sm) 0 0 var(--pader-radius-sm);
}

/* ── Form controls ──────────────────────────────────────────── */
.form-control,
input[type="text"],
input[type="email"],
input[type="tel"],
input[type="password"],
textarea,
select {
    text-align: start;
    direction: rtl;
}

/* ── Swiper RTL ─────────────────────────────────────────────── */
.swiper { direction: rtl; }

/* ── Mobile nav ─────────────────────────────────────────────── */
@media (max-width: 991.98px) {
    #header .primary-menu .menu-container { text-align: start; }
    #header .primary-menu .menu-item a { text-align: start; }
}

/* ── Dropdown in RTL ────────────────────────────────────────── */
.dropdown-menu {
    text-align: start;
}

/* ── Bootstrap grid RTL ─────────────────────────────────────── */
/* Bootstrap RTL CSS handles most of this — these are supplements */
.text-start { text-align: right !important; }
.text-end   { text-align: left  !important; }