/* =========================
   RTL — PERSIAN OVERRIDES
   Import after style.css
========================= */

/* =========================
   FONTS
========================= */

@font-face {
    font-family: "Vazirmatn";
    src: url("../fonts/Vazir-Light.woff2") format("woff2");
    font-weight: 300;
    font-style: normal;
}

@font-face {
    font-family: "Vazirmatn";
    src: url("../fonts/Vazir.woff2") format("woff2");
    font-weight: 400;
    font-style: normal;
}

@font-face {
    font-family: "Vazirmatn";
    src: url("../fonts/Vazir-Medium.woff2") format("woff2");
    font-weight: 500;
    font-style: normal;
}

@font-face {
    font-family: "Vazirmatn";
    src: url("../fonts/Vazir-Bold.woff2") format("woff2");
    font-weight: 700;
    font-style: normal;
}

/* ── تنظیم کلی RTL ── */
html[lang="fa"],
html[lang="fa"] body {
    font-family: 'Vazir', 'Vazirmatn', sans-serif;
    direction: rtl;
    text-align: right;
}

/* ── ناوبار: لوگو سمت راست، منو وسط، دکمه‌ها سمت چپ ── */
html[lang="fa"] .navbar {
    flex-direction: row-reverse;
}

/* منو: از راست به چپ — خانه، مهارت‌ها، ... */
html[lang="fa"] .nav-menu {
    flex-direction: row-reverse;
}

/* دکمه‌های راست (theme, lang, burger) */
html[lang="fa"] .nav-actions {
    flex-direction: row-reverse;
}

/* ── موبایل دراور ── */
html[lang="fa"] .mobile-drawer ul {
    direction: rtl;
}
html[lang="fa"] .drawer-link {
    text-align: right;
}

/* ── هیرو ── */
html[lang="fa"] .hero-inner {
    direction: rtl;
}
html[lang="fa"] .hero-content {
    text-align: right;
    align-items: flex-start;
}

/* badge: پالس‌دات قبل از متن (از راست) */
html[lang="fa"] .hero-badge {
    flex-direction: row;       /* راست→چپ طبیعی در RTL */
}

/* تگ دانشجو: آیکون و متن از راست */
html[lang="fa"] .hero-roles {
    justify-content: flex-start;
    flex-direction: row;       /* در RTL خودش برمی‌گردد */
}
html[lang="fa"] .role-tag {
    flex-direction: row-reverse;
    gap: 6px;
}

/* دکمه‌ها: از راست */
html[lang="fa"] .hero-buttons {
    justify-content: flex-start;
    flex-direction: row;
}

/* نام فارسی */
html[lang="fa"] .hero-name {
    font-family: 'Vazir', 'Vazirmatn', sans-serif;
    font-weight: 700;
    font-size: 58px;
    font-style: normal;
    line-height: 1.1;
}
html[lang="fa"] .hero-name em {
    font-style: normal;
    color: var(--accent);
}

/* تایپ‌رایتر */
html[lang="fa"] .hero-role {
    direction: rtl;
    text-align: right;
}

/* ── بخش‌های عمومی ── */
html[lang="fa"] .section-header {
    direction: rtl;
}
html[lang="fa"] .skills-table {
    direction: rtl;
}

/* ── نمونه‌کارها ── */
html[lang="fa"] .works-grid {
    direction: rtl;
}

/* ── گواهینامه: نوار رنگی سمت راست ── */
html[lang="fa"] .cert-card::before {
    left: auto;
    right: 0;
    border-radius: 2px 0 0 2px;
}

/* ── تماس: فلش برعکس ── */
html[lang="fa"] .contact-arrow {
    transform: rotate(180deg);
}
html[lang="fa"] .contact-card:hover .contact-arrow {
    transform: rotate(180deg) translateX(4px);
}

/* ── شبکه اجتماعی ── */
html[lang="fa"] .social-ext {
    margin-right: auto;
    margin-left: 0;
}

/* ── فوتر ── */
html[lang="fa"] .footer {
    direction: rtl;
}

/* ── وبلاگ: لیست و پست ── */
html[lang="fa"] .blog-grid {
    direction: rtl;
}
html[lang="fa"] .page-hero {
    direction: rtl;
}
html[lang="fa"] .post-article {
    direction: rtl;
}
html[lang="fa"] .post-meta {
    direction: rtl;
}
html[lang="fa"] .post-body ul {
    padding-inline-start: 0;
    padding-inline-end: 20px;
}
html[lang="fa"] .breadcrumb-back {
    flex-direction: row-reverse;
}
html[lang="fa"] .breadcrumb-back i {
    transform: scaleX(-1);
}
html[lang="fa"] .post-nav {
    direction: rtl;
}
html[lang="fa"] .post-nav a.next {
    text-align: left;
    align-items: flex-start;
}
@media (max-width: 600px) {
    html[lang="fa"] .post-nav a.next {
        text-align: right;
        align-items: flex-end;
    }
}

/* ══════════════════════════════
   RESPONSIVE
══════════════════════════════ */
@media (max-width: 960px) {
    html[lang="fa"] .hero-content {
        align-items: center;
        text-align: center;
    }
    html[lang="fa"] .hero-roles {
        justify-content: center;
    }
    html[lang="fa"] .hero-buttons {
        justify-content: center;
    }
    html[lang="fa"] .role-tag {
        flex-direction: row;
    }
}

@media (max-width: 768px) {
    html[lang="fa"] .hero-name { font-size: 40px; }
}
@media (max-width: 420px) {
    html[lang="fa"] .hero-name { font-size: 32px; }
}