```php
<?php get_header(); ?>


<?php
/*
 * تبدیل تاریخ میلادی به شمسی
 */
function havin_gregorian_to_jalali($gy, $gm, $gd) {

    $g_days_in_month = array(
        31, 28, 31, 30, 31, 30,
        31, 31, 30, 31, 30, 31
    );

    $j_days_in_month = array(
        31, 31, 31, 31, 31, 31,
        30, 30, 30, 30, 30, 29
    );

    $gy -= 1600;
    $gm -= 1;
    $gd -= 1;

    $g_day_no = 365 * $gy
        + intdiv($gy + 3, 4)
        - intdiv($gy + 99, 100)
        + intdiv($gy + 399, 400);

    for ($i = 0; $i < $gm; ++$i) {
        $g_day_no += $g_days_in_month[$i];
    }

    if (
        $gm > 1 &&
        (
            ($gy + 1600) % 4 == 0 &&
            (
                ($gy + 1600) % 100 != 0 ||
                ($gy + 1600) % 400 == 0
            )
        )
    ) {
        $g_day_no++;
    }

    $g_day_no += $gd;

    $j_day_no = $g_day_no - 79;

    $j_np = intdiv($j_day_no, 12053);
    $j_day_no %= 12053;

    $jy = 979
        + 33 * $j_np
        + 4 * intdiv($j_day_no, 1461);

    $j_day_no %= 1461;

    if ($j_day_no >= 366) {

        $jy += intdiv(
            $j_day_no - 1,
            365
        );

        $j_day_no =
            ($j_day_no - 1) % 365;
    }

    for (
        $i = 0;
        $i < 11 &&
        $j_day_no >= $j_days_in_month[$i];
        ++$i
    ) {
        $j_day_no -= $j_days_in_month[$i];
    }

    $jm = $i + 1;
    $jd = $j_day_no + 1;

    return array(
        $jy,
        $jm,
        $jd
    );
}


/*
 * گرفتن تاریخ واقعی نوشته
 */
$post_datetime = get_post_datetime(
    null,
    false
);

$gregorian_year =
    (int) $post_datetime->format('Y');

$gregorian_month =
    (int) $post_datetime->format('m');

$gregorian_day =
    (int) $post_datetime->format('d');


list(
    $jalali_year,
    $jalali_month,
    $jalali_day
) = havin_gregorian_to_jalali(
    $gregorian_year,
    $gregorian_month,
    $gregorian_day
);


/*
 * نام ماه‌های شمسی
 */
$jalali_months = array(

    1  => 'فروردین',
    2  => 'اردیبهشت',
    3  => 'خرداد',
    4  => 'تیر',
    5  => 'مرداد',
    6  => 'شهریور',
    7  => 'مهر',
    8  => 'آبان',
    9  => 'آذر',
    10 => 'دی',
    11 => 'بهمن',
    12 => 'اسفند'

);


$jalali_date =
    $jalali_day . ' ' .
    $jalali_months[$jalali_month] . ' ' .
    $jalali_year;


/*
 * تبدیل اعداد انگلیسی به فارسی
 */
$jalali_date = strtr(

    $jalali_date,

    array(

        '0' => '۰',
        '1' => '۱',
        '2' => '۲',
        '3' => '۳',
        '4' => '۴',
        '5' => '۵',
        '6' => '۶',
        '7' => '۷',
        '8' => '۸',
        '9' => '۹'

    )

);
?>


<main class="single-post-page">


    <!-- =========================
         Page Hero
         ========================= -->

    <section class="page-hero">

        <div class="container">

            <h1>
                <?php the_title(); ?>
            </h1>


            <div class="post-meta">

                <span>
                    <?php
                    echo esc_html(
                        $jalali_date
                    );
                    ?>
                </span>

            </div>

        </div>

    </section>


    <!-- =========================
         Article
         ========================= -->

    <section class="section">

        <div class="container">


            <?php
            while ( have_posts() ) :

                the_post();
            ?>


                <article class="single-article">


                    <!-- =========================
                         Article Content
                         ========================= -->

                    <div class="single-content">

                        <?php the_content(); ?>

                    </div>


                    <!-- =========================
                         Category
                         ========================= -->

                    <div class="post-category">

                        <?php
                        the_category(' ، ');
                        ?>

                    </div>


                </article>


            <?php
            endwhile;
            ?>


        </div>

    </section>


</main>


<?php get_footer(); ?>
```
/* =========================================================
   HAVIN VOCABULARY FLASHCARDS
   ========================================================= */

.havin-vocabulary-section {
    margin: 70px 0;
}

.havin-vocabulary-heading {
    text-align: center;
    margin-bottom: 35px;
}

.havin-vocabulary-heading h2 {
    margin: 0 0 10px;
    font-size: 30px;
    font-weight: 800;
    color: #172554;
}

.havin-vocabulary-heading p {
    margin: 0;
    color: #64748b;
    font-size: 15px;
}


/* =========================
   Cards Grid
   ========================= */

.havin-vocabulary-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 24px;
}


/* =========================
   Card
   ========================= */

.havin-vocabulary-card {
    background: #ffffff;
    border: 1px solid #e2e8f0;
    border-radius: 24px;
    overflow: hidden;
    box-shadow: 0 12px 35px rgba(15, 23, 42, 0.08);
    transition:
        transform 0.25s ease,
        box-shadow 0.25s ease;
}

.havin-vocabulary-card:hover {
    transform: translateY(-5px);
    box-shadow: 0 18px 45px rgba(37, 99, 235, 0.14);
}


/* =========================
   Vocabulary Image
   ========================= */

.havin-vocabulary-image {
    width: 100%;
    height: 230px;
    overflow: hidden;
    background: #eff6ff;
}

.havin-vocabulary-image img {
    width: 100%;
    height: 100%;
    display: block;
    object-fit: cover;
}


/* =========================
   Card Body
   ========================= */

.havin-vocabulary-body {
    padding: 24px;
}


/* =========================
   Word + Pronunciation Button
   ========================= */

.havin-vocabulary-word-row {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 15px;
    margin-bottom: 5px;
}

.havin-vocabulary-word-row h3 {
    margin: 0;
    font-size: 28px;
    font-weight: 800;
    color: #1d4ed8;
    direction: ltr;
    text-align: left;
}


/* =========================
   Speaker Button
   ========================= */

.havin-pronunciation {
    width: 42px;
    height: 42px;
    border: none;
    border-radius: 50%;
    background: #2563eb;
    color: #ffffff;
    font-size: 18px;
    cursor: pointer;

    display: flex;
    align-items: center;
    justify-content: center;

    transition:
        transform 0.2s ease,
        background 0.2s ease;
}

.havin-pronunciation:hover {
    background: #1d4ed8;
    transform: scale(1.08);
}

.havin-pronunciation:active {
    transform: scale(0.95);
}


/* =========================
   Pronunciation
   ========================= */

.havin-vocabulary-pronunciation {
    direction: ltr;
    text-align: left;
    color: #64748b;
    font-size: 14px;
    margin-bottom: 18px;
}


/* =========================
   Meaning
   ========================= */

.havin-vocabulary-meaning {
    background: #eff6ff;
    border-right: 4px solid #2563eb;
    border-radius: 12px;
    padding: 13px 16px;
    margin-bottom: 18px;

    color: #1e3a8a;
    font-size: 16px;
    font-weight: 700;
}


/* =========================
   Example
   ========================= */

.havin-vocabulary-example {
    background: #f8fafc;
    border: 1px solid #e2e8f0;
    border-radius: 14px;
    padding: 16px 18px;
}

.havin-vocabulary-example strong {
    display: block;
    margin-bottom: 8px;

    color: #2563eb;
    font-size: 14px;
}

.havin-vocabulary-example p {
    margin: 0 0 8px;

    color: #334155;
    font-size: 15px;
    line-height: 1.8;

    direction: ltr;
    text-align: left;
}

.havin-vocabulary-example span {
    display: block;

    color: #64748b;
    font-size: 14px;
    line-height: 1.8;

    direction: rtl;
    text-align: right;
}


/* =========================
   Mobile
   ========================= */

@media (max-width: 1024px) {

    .havin-vocabulary-section {
        margin: 50px 0;
    }

    .havin-vocabulary-grid {
        grid-template-columns: 1fr;
        gap: 22px;
    }

    .havin-vocabulary-heading h2 {
        font-size: 25px;
    }

    .havin-vocabulary-image {
        height: 210px;
    }

    .havin-vocabulary-body {
        padding: 20px;
    }

    .havin-vocabulary-word-row h3 {
        font-size: 24px;
    }

}

body,
.havin-vocabulary-section,
.havin-vocabulary-card {
    font-family: "Vazirmatn", sans-serif;
}
/* =========================================
   Mngsk Recent Content List - Premium Blue Box Design
   ========================================= */

/* --- ۱. کادر آبی اصلی (دور همه چیز) --- */
.mngsk-recent-content {
    direction: rtl;
    text-align: right;
    background: linear-gradient(135deg, #eff6ff 0%, #dbeafe 100%);
    border: 2px solid #2563eb;
    border-radius: 16px;
    padding: 20px;
    margin: 0;
    box-shadow: 0 10px 30px rgba(37, 99, 235, 0.15);
    position: relative;
    overflow: hidden;
}

/* نوار تزئینی بالای کادر */
.mngsk-recent-content::before {
    content: '';
    position: absolute;
    top: 0;
    right: 0;
    left: 0;
    height: 4px;
    background: linear-gradient(90deg, #2563eb, #3b82f6, #60a5fa);
}

/* --- ۲. عنوان "تازه‌ترین مقالات را بخوانید" --- */
.mngsk-recent-content > h3,
.mngsk-recent-content .mngsk-title {
    font-size: 16px;
    font-weight: 800;
    color: #1e3a8a;
    margin: 0 0 18px 0;
    padding: 0 0 12px 0;
    text-align: center;
    position: relative;
}

/* --- ۳. حذف hr --- */
.mngsk-recent-content > hr {
    display: none;
}

/* --- ۴. هر آیتم (کارت مقاله) --- */
.mngsk-recent-content__item {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    text-decoration: none;
    background: #ffffff;
    border: 1px solid #bfdbfe;
    border-radius: 12px;
    padding: 12px 14px;
    margin-bottom: 10px;
    transition: all 0.3s ease;
    position: relative;
    overflow: hidden;
    color: inherit;
}

.mngsk-recent-content__item:hover {
    background: #ffffff;
    border-color: #2563eb;
    box-shadow: 0 8px 20px rgba(37, 99, 235, 0.2);
    transform: translateY(-3px);
}

/* --- ۵. تصویر شاخص (سمت راست) --- */
.mngsk-recent-content__item img,
.mngsk-recent-content__item .mngsk-recent-content__thumbnail,
.mngsk-recent-content__item .mngsk-recent-content__image {
    width: 70px;
    height: 70px;
    object-fit: cover;
    border-radius: 10px;
    flex-shrink: 0;
    order: 1;
    border: 2px solid #dbeafe;
}

/* --- ۶. ساختار dl --- */
.mngsk-recent-content__item dl {
    display: flex;
    align-items: center;
    flex: 1;
    margin: 0;
    padding: 0;
    gap: 10px;
    order: 2;
}

/* --- ۷. عنوان مقاله --- */
.mngsk-recent-content__item-title {
    flex: 1;
    font-size: 14px;
    font-weight: 700;
    color: #1e293b;
    line-height: 1.7;
    margin: 0;
    padding: 0;
    transition: color 0.3s ease;
    order: 1;
}

.mngsk-recent-content__item:hover .mngsk-recent-content__item-title {
    color: #2563eb;
}

/* --- ۸. دسته‌بندی --- */
.mngsk-recent-content__category {
    display: inline-block;
    font-size: 11px;
    color: #2563eb;
    background: #eff6ff;
    padding: 4px 12px;
    border-radius: 20px;
    margin: 0;
    order: 3;
    flex-shrink: 0;
    border: 1px solid #bfdbfe;
}

/* --- ۹. نوع محتوا (Post) --- */
.mngsk-recent-content__type {
    display: none;
}

/* --- ۱۰. تاریخ (سمت چپ کادر) --- */
.mngsk-recent-content__date,
.mngsk-recent-content__item time,
.mngsk-recent-content__item .mngsk-recent-content__date {
    display: inline-flex;
    align-items: center;
    font-size: 11px;
    color: #64748b;
    background: #f1f5f9;
    padding: 5px 10px;
    border-radius: 8px;
    order: 0;
    flex-shrink: 0;
    white-space: nowrap;
}

.mngsk-recent-content__date::before,
.mngsk-recent-content__item time::before {
    content: '📅';
    margin-left: 4px;
    font-size: 10px;
}

/* --- ۱۱. صفحه‌بندی --- */
.mngsk-recent-content__pagination {
    display: flex !important;
    justify-content: center;
    align-items: center;
    gap: 6px;
    margin-top: 18px;
    padding-top: 15px;
    border-top: 1px solid #bfdbfe;
    flex-wrap: wrap;
}

.mngsk-recent-content__pagination a,
.mngsk-recent-content__pagination span {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 34px;
    height: 34px;
    padding: 0 10px;
    font-size: 13px;
    font-weight: 600;
    color: #475569;
    background: #ffffff;
    border: 1px solid #bfdbfe;
    border-radius: 8px;
    text-decoration: none;
    transition: all 0.25s ease;
}

.mngsk-recent-content__pagination a:hover {
    background: #2563eb;
    color: #ffffff;
    border-color: #2563eb;
    transform: translateY(-2px);
    box-shadow: 0 4px 10px rgba(37, 99, 235, 0.3);
}

.mngsk-recent-content__pagination .current,
.mngsk-recent-content__pagination .page-numbers.current {
    background: #2563eb;
    color: #ffffff;
    border-color: #2563eb;
    box-shadow: 0 4px 10px rgba(37, 99, 235, 0.3);
}

/* --- ۱۲. ریسپانسیو --- */
@media (max-width: 768px) {
    .mngsk-recent-content {
        padding: 15px;
    }
    .mngsk-recent-content__item {
        padding: 10px;
        gap: 10px;
    }
    .mngsk-recent-content__item img,
    .mngsk-recent-content__item .mngsk-recent-content__thumbnail {
        width: 55px;
        height: 55px;
    }
    .mngsk-recent-content__item dl {
        flex-direction: column;
        align-items: flex-start;
        gap: 6px;
    }
    .mngsk-recent-content__item-title {
        font-size: 13px;
    }
    .mngsk-recent-content__date {
        font-size: 10px;
        padding: 3px 8px;
    }
}

/* =========================================
   Havin Rating (1-5 Buttons) + Post Navigation
   Blue Premium Design - Complete Replacement
   ========================================= */

/* --- ۱. کانتینر اصلی بخش امتیازدهی --- */
.havin-rating {
    background: linear-gradient(135deg, #f0f7ff 0%, #e0efff 100%);
    border: 2px solid #2563eb;
    border-radius: 16px;
    padding: 25px 20px;
    margin: 30px 0;
    text-align: center;
    direction: rtl;
    box-shadow: 0 10px 30px rgba(37, 99, 235, 0.12);
    position: relative;
    overflow: hidden;
}

/* نوار تزئینی بالای کادر */
.havin-rating::before {
    content: '';
    position: absolute;
    top: 0;
    right: 0;
    left: 0;
    height: 4px;
    background: linear-gradient(90deg, #2563eb, #3b82f6, #60a5fa);
}

/* --- ۲. عنوان "این مقاله چقدر برایت مفید بود؟" --- */
.havin-rating h3,
.havin-rating .havin-rating__title {
    font-size: 18px;
    font-weight: 800;
    color: #1e3a8a;
    margin: 0 0 15px 0;
    padding-bottom: 12px;
    border-bottom: 2px dashed #93c5fd;
    text-align: center;
}

/* --- ۳. متن توضیحی --- */
.havin-rating p,
.havin-rating .havin-rating__description {
    font-size: 13px;
    color: #475569;
    margin: 0 0 18px 0;
    text-align: center;
    line-height: 1.8;
}

/* --- ۴. کانتینر دکمه‌های عددی 1 تا 5 --- */
.havin-rating .havin-rating__stars,
.havin-rating .stars,
.havin-rating .rating-stars,
.havin-rating .rating-buttons,
.havin-rating .havin-rating__buttons {
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 10px;
    margin: 20px 0;
    flex-direction: row;
}

/* --- ۵. دکمه‌های عددی (1 تا 5) --- */
.havin-rating .havin-rating__star,
.havin-rating .star,
.havin-rating .rating-star,
.havin-rating .rating-btn,
.havin-rating .havin-rating__btn,
.havin-rating button[data-value],
.havin-rating button[data-rating],
.havin-rating .havin-rating__number {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 52px;
    height: 52px;
    font-size: 20px;
    font-weight: 800;
    color: #1e3a8a;
    background: #ffffff;
    border: 2px solid #bfdbfe;
    border-radius: 12px;
    cursor: pointer;
    transition: all 0.25s ease;
    text-decoration: none;
    line-height: 1;
    box-shadow: 0 2px 6px rgba(37, 99, 235, 0.08);
    font-family: inherit;
    padding: 0;
}

/* --- ۶. افکت هاور روی دکمه‌ها --- */
.havin-rating .havin-rating__star:hover,
.havin-rating .star:hover,
.havin-rating .rating-star:hover,
.havin-rating .rating-btn:hover,
.havin-rating .havin-rating__btn:hover,
.havin-rating button[data-value]:hover,
.havin-rating button[data-rating]:hover,
.havin-rating .havin-rating__number:hover {
    background: #2563eb;
    color: #ffffff;
    border-color: #2563eb;
    transform: translateY(-4px) scale(1.05);
    box-shadow: 0 8px 20px rgba(37, 99, 235, 0.35);
}

/* --- ۷. دکمه فعال (امتیاز انتخاب شده) --- */
.havin-rating .havin-rating__star.active,
.havin-rating .havin-rating__star.selected,
.havin-rating .havin-rating__star.filled,
.havin-rating .star.active,
.havin-rating .star.selected,
.havin-rating .star.filled,
.havin-rating .rating-btn.active,
.havin-rating .rating-btn.selected,
.havin-rating .havin-rating__btn.active,
.havin-rating button[data-value].active,
.havin-rating button[data-value].selected,
.havin-rating button[data-rating].active,
.havin-rating .havin-rating__number.active {
    background: linear-gradient(135deg, #2563eb, #1d4ed8);
    color: #ffffff;
    border-color: #1d4ed8;
    box-shadow: 0 6px 16px rgba(37, 99, 235, 0.4);
    transform: translateY(-2px);
}

/* --- ۸. دکمه‌های غیرفعال --- */
.havin-rating .havin-rating__star:disabled,
.havin-rating .rating-btn:disabled,
.havin-rating button[data-value]:disabled {
    opacity: 0.5;
    cursor: not-allowed;
    transform: none;
}

/* --- ۹. امتیاز کل (0 از 5) --- */
.havin-rating .havin-rating__score,
.havin-rating .rating-score,
.havin-rating .score,
.havin-rating .havin-rating__result {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    font-size: 15px;
    font-weight: 700;
    color: #1e3a8a;
    background: #ffffff;
    padding: 10px 22px;
    border-radius: 30px;
    border: 1px solid #bfdbfe;
    margin-top: 15px;
    box-shadow: 0 2px 8px rgba(37, 99, 235, 0.1);
}

/* --- ۱۰. دکمه‌های مقاله قبلی / بعدی --- */
.post-navigation {
    display: flex;
    justify-content: space-between;
    gap: 15px;
    margin: 25px 0 0 0;
    padding: 0;
    direction: rtl;
}

.post-navigation .nav-previous,
.post-navigation .nav-next {
    flex: 1;
    max-width: 48%;
}

.post-navigation a {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 14px 18px;
    background: #ffffff;
    border: 1px solid #e2e8f0;
    border-radius: 12px;
    text-decoration: none;
    color: #1e293b;
    font-size: 13px;
    font-weight: 600;
    transition: all 0.3s ease;
    position: relative;
    overflow: hidden;
}

.post-navigation a::before {
    content: '';
    position: absolute;
    top: 0;
    right: 0;
    width: 4px;
    height: 100%;
    background: #cbd5e1;
    transition: background 0.3s ease;
}

.post-navigation .nav-previous a::before {
    right: auto;
    left: 0;
}

.post-navigation a:hover {
    background: #f0f7ff;
    border-color: #bfdbfe;
    color: #2563eb;
    transform: translateY(-3px);
    box-shadow: 0 8px 20px rgba(37, 99, 235, 0.15);
}

.post-navigation a:hover::before {
    background: #2563eb;
}

.post-navigation .nav-previous a::after {
    content: '→';
    font-size: 18px;
    color: #2563eb;
    margin-right: auto;
}

.post-navigation .nav-next a::after {
    content: '←';
    font-size: 18px;
    color: #2563eb;
    margin-right: auto;
}

/* --- ۱۱. ریسپانسیو --- */
@media (max-width: 768px) {
    .havin-rating {
        padding: 20px 15px;
    }
    .havin-rating h3 {
        font-size: 16px;
    }
    .havin-rating .havin-rating__star,
    .havin-rating .star,
    .havin-rating .rating-btn,
    .havin-rating button[data-value],
    .havin-rating button[data-rating] {
        width: 44px;
        height: 44px;
        font-size: 17px;
    }
    .havin-rating .havin-rating__stars,
    .havin-rating .rating-buttons {
        gap: 8px;
    }
    .post-navigation {
        flex-direction: column;
        gap: 10px;
    }
    .post-navigation .nav-previous,
    .post-navigation .nav-next {
        max-width: 100%;
    }
}

@media (max-width: 480px) {
    .havin-rating .havin-rating__star,
    .havin-rating .star,
    .havin-rating .rating-btn,
    .havin-rating button[data-value],
    .havin-rating button[data-rating] {
        width: 38px;
        height: 38px;
        font-size: 15px;
        border-radius: 10px;
    }
    .havin-rating .havin-rating__stars,
    .havin-rating .rating-buttons {
        gap: 6px;
    }
}
/* =========================================
   Header Title - Center, Bold, More Spacing
   ========================================= */

/* کانتینر عنوان */
.mngsk-recent-content__header {
    text-align: center !important;
    margin: 0 0 30px 0 !important;
    padding: 0 0 18px 0 !important;
    border-bottom: 2px dashed #93c5fd !important;
}

/* خود عنوان داخل هدر */
.mngsk-recent-content__header h3,
.mngsk-recent-content__header h2,
.mngsk-recent-content__header .mngsk-title,
.mngsk-recent-content__header > * {
    text-align: center !important;
    font-weight: 900 !important;
    font-size: 18px !important;
    color: #1e3a8a !important;
    margin: 0 !important;
    padding: 0 !important;
    letter-spacing: 0.3px;
    display: block;
}

/* حذف استایل قبلی که ممکن است تداخل کند */
.mngsk-recent-content > h3 {
    text-align: center !important;
    font-weight: 900 !important;
    font-size: 18px !important;
    color: #1e3a8a !important;
    margin: 0 0 30px 0 !important;
    padding: 0 0 18px 0 !important;
    border-bottom: 2px dashed #93c5fd !important;
}

.mngsk-recent-content > h3,
.mngsk-recent-content > h2,
.mngsk-recent-content > p:first-child,
.mngsk-recent-content > div:first-child {
    text-align: center !important;
    margin-left: auto !important;
    margin-right: auto !important;
    width: 100% !important;
    display: block !important;
}

.mngsk-recent-content__header,
.mngsk-recent-content__header h3,
.mngsk-recent-content__header h2,
.mngsk-recent-content__header > * {
    border: none !important;
    padding-bottom: 0 !important;
    margin-bottom: 25px !important;   /* فاصله حفظ شود */
}

/* =========================================
   Standard Content Spacing
   ========================================= */

/* کانتینر اصلی مقاله */
.single-post-page .container {
    max-width: 900px;
    margin-left: auto;
    margin-right: auto;
    padding-left: 25px;
    padding-right: 25px;
}

/* محتوای مقاله */
.single-content {
    padding-left: 20px;
    padding-right: 20px;
    line-height: 2;
    font-size: 17px;
    color: #334155;
    text-align: justify;
}

/* پاراگراف‌های داخل محتوا */
.single-content p {
    margin-bottom: 22px;
    line-height: 2;
}

/* هدینگ‌های داخل محتوا */
.single-content h2 {
    margin-top: 40px;
    margin-bottom: 20px;
    font-size: 24px;
    font-weight: 800;
    color: #1e3a8a;
}

.single-content h3 {
    margin-top: 35px;
    margin-bottom: 18px;
    font-size: 20px;
    font-weight: 700;
    color: #1e3a8a;
}

/* تصاویر داخل محتوا */
.single-content img {
    max-width: 100%;
    height: auto;
    border-radius: 12px;
    margin: 20px auto;
    display: block;
}

/* ریسپانسیو برای موبایل */
@media (max-width: 768px) {
    .single-post-page .container {
        padding-left: 18px;
        padding-right: 18px;
    }
    .single-content {
        padding-left: 10px;
        padding-right: 10px;
        font-size: 16px;
    }
    .single-content h2 {
        font-size: 21px;
    }
    .single-content h3 {
        font-size: 18px;
    }
}

@media (max-width: 480px) {
    .single-post-page .container {
        padding-left: 15px;
        padding-right: 15px;
    }
    .single-content {
        padding-left: 5px;
        padding-right: 5px;
        font-size: 15px;
        line-height: 1.9;
    }
}

/* Prevent pronunciation button from shrinking */
.pronunciation-button,
.audio-button,
.speak-button {
    flex-shrink: 0 !important;
    white-space: nowrap;
}