/* ===== TOC (Bootstrap 4 friendly) ===== */
.toc-nav {
    direction: rtl; /* اگر سایتت RTL نیست این خط رو بردار */
    background: #fff;
    border: 1px solid #e9ecef;
    border-radius: .5rem;
    box-shadow: 0 .125rem .25rem rgba(0,0,0,.075);
    padding: .75rem .75rem .5rem;
    margin: 1rem 0;
}

    .toc-nav .toc-title {
        font-weight: 700;
        font-size: 1rem;
        margin-bottom: .5rem;
        padding-bottom: .5rem;
        border-bottom: 1px solid #e9ecef;
        color: #212529;
    }

    .toc-nav .toc-list {
        list-style: none;
        padding: 0;
        margin: 0;
    }

.toc-item::marker {
    font-size: 16px;
}

.toc-nav .toc-item {
    margin: 0;
    list-style: decimal;
    margin-right: 52px;
}

    .toc-nav .toc-item + .toc-item {
        margin-top: .25rem;
    }

    .toc-nav .toc-item a {
        display: block;
        padding: .375rem .5rem;
        border-radius: .25rem;
        text-decoration: none;
        color: #495057; /* text-secondary */
        transition: background-color .15s ease, color .15s ease;
    }

        .toc-nav .toc-item a:hover,
        .toc-nav .toc-item a:focus {
            background: #f8f9fa; /* bg-light */
            color: #212529;
            text-decoration: none;
        }

    /* حالت Active (اختیاری: با JS یا وقتی hash برابر شد این کلاس رو بده) */
    .toc-nav .toc-item.active > a {
        background: #e9ecef; /* bg-light تر */
        color: #212529;
        font-weight: 600;
    }

    /* فرو رفتگی سطوح زیرمجموعه (h3,h4...) */
    .toc-nav .toc-item.toc-h3 a {
        padding-right: 1.5rem;
        position: relative;
    }

        .toc-nav .toc-item.toc-h3 a::before {
            content: '';
            position: absolute;
            right: .5rem;
            top: 50%;
            width: .5rem;
            height: .5rem;
            background: #dee2e6;
            border-radius: 50%;
            transform: translateY(-50%);
        }

    .toc-nav .toc-item.toc-h4 a {
        padding-right: 2rem;
    }

/* اگر صفحه LTR بود: */
[dir="ltr"] .toc-nav .toc-item.toc-h3 a {
    padding-left: 1.5rem;
    padding-right: .5rem;
}

    [dir="ltr"] .toc-nav .toc-item.toc-h3 a::before {
        left: .5rem;
        right: auto;
    }

[dir="ltr"] .toc-nav .toc-item.toc-h4 a {
    padding-left: 2rem;
    padding-right: .5rem;
}