@keyframes fadeInUp {
    0% {
        opacity: 0;
        transform: translateY(20px)
    }

    to {
        opacity: 1;
        transform: translateY(0)
    }
}

@keyframes fadeInDownBig {
    0% {
        opacity: 0;
        transform: translateY(-64px) scale(.93)
    }

    to {
        opacity: 1;
        transform: none
    }
}

@keyframes gradientShift {
    0%,to {
        background-position: 0 50%
    }

    50% {
        background-position: 100% 50%
    }
}

@keyframes pulse {
    0%,to {
        transform: translateX(-50%) scale(1);
        opacity: 1
    }

    50% {
        transform: translateX(-50%) scale(1.3);
        opacity: .8
    }
}

@font-face {
}

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

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

.ss01 {
    -moz-font-feature-settings: "ss01";
    -webkit-font-feature-settings: "ss01";
    font-feature-settings: "ss01"
}

:root {
    --primary-color: #9c27b0;
    --primary-color-light: rgba(156, 39, 176, 0.15);
    --text-color: #f3e5f5;
    --text-color-muted: #d1c4e9;
    --text-color-light: #b39ddb;
    --link-color: #ba68c8;
    --link-hover: #ab47bc;
    --background: #121012;
    --card-bg: #1e1a1e;
    --code-bg: #2d2d2d;
    --success-color: #4caf50;
    --footer-bg: #1e1a1e;
    --footer-color: #f3e5f5;
    --input-border: #3e2a3e;
    --border-color: #3e2a3e;
    --button-download-bg: #7b1fa2;
    --button-download-hover: #6a1b9a;
    --button-preview-bg: #9c27b0;
    --button-preview-hover: #8e24aa;
    --danger-color: #e91e63;
    --heading-color: #ffffff;
    --heading-muted: #f3e5f5;
    --heading-subtle: #d1c4e9;
    --heading-light: #b39ddb;
    --placeholder-color: #b39ddb;
    --tag-bg: rgba(156, 39, 176, 0.12);
    --tag-hover-color: rgba(233, 30, 99, 0.3);
    --nav-hover-bg: rgba(156, 39, 176, 0.1);
    --nav-current-bg: rgba(123, 31, 162, 0.15);
    --highlight-bg: rgba(123, 31, 162, 0.15);
    --shadow-primary: 0 4px 8px rgba(156, 39, 176, 0.15);
    --gradient: linear-gradient(99deg, #7b1fa2 10%, #311b92 90%);
    --gradient-light: linear-gradient(97deg, #ad35e090 40%, #fff1 100%)
}

html {
    box-sizing: border-box;
    direction: rtl;
    text-align: right
}

*,:after,:before {
    box-sizing: inherit
}

.wrapper,body {
    display: flex;
    flex-direction: column
}

body,html {
    height: 100%
}

body {
    background-color: var(--background);
    color: var(--text-color);
    font-family: "Vazirmatn",sans-serif;
    font-optical-sizing: auto;
    font-weight: 400;
    font-style: normal;
    min-height: 100vh;
    margin: 0;
    padding: 0
}

img {
    max-width: 100%;
    height: auto;
    display: block;
    margin: auto
}

#body,.wrapper {
    flex: 1
}

main#main-content {
    flex: 1;
    padding: 20px;
    background-image: url(./assets/img/texture.png);
    background-repeat: repeat;
    background-size: cover
}

::selection {
    background: var(--highlight-bg)
}

.container,blockquote {
    color: var(--text-color)
}

.container {
    margin: 2rem auto;
    width: 100%;
    box-sizing: border-box;
    max-width: 1200px;
    padding: 20px;
    background-color: transparent;
    border-radius: 8px;
    display: flex;
    flex-direction: column;
    align-items: center
}

code,h1,h2,h3,pre {
    font-optical-sizing: auto
}

.title {
    text-align: center;
    margin-top: 10px;
    color: var(--placeholder-color);
    font-weight: 700;
    font-size: 2em
}

.description {
    position: relative;
    top: -1.2em;
    margin: .4em 0 0;
    color: var(--text-color-light);
    text-align: center;
    font-size: 1em
}

.post-content {
    line-height: 1.8;
    font-size: 1.1rem;
    width: 100%
}

.post-content h1,.post-content h2,.post-content h3 {
    position: relative;
    margin: 1.5em 0 .8em;
    padding: 0 0 10px;
    color: var(--heading-color);
    font-weight: 600;
    line-height: 1.3;
    text-align: right;
    border: 0
}

.post-content h1 {
    font-size: 1.8rem
}

.post-content h2 {
    font-size: 1.5rem
}

.post-content h3 {
    font-size: 1.3rem
}

.post-content h4 {
    font-size: 1.1rem;
    color: var(--heading-muted)
}

.post-content h5 {
    font-size: 1rem;
    color: var(--heading-subtle)
}

.post-content h6 {
    font-size: .95rem;
    color: var(--heading-light)
}

.post-content h1::after,.post-content h2::after,.post-content h3::after {
    content: "";
    display: block;
    width: 50px;
    height: 3px;
    background: var(--primary-color);
    margin: 10px 0 15px auto;
    transition: width .3s ease
}

.post-content h1:hover::after,.post-content h2:hover::after,.post-content h3:hover::after {
    width: 80px
}

blockquote {
    margin: 1.5em 0;
    padding: 1.2em 1.5em;
    border-right: 5px solid var(--primary-color);
    background-color: rgba(156,39,176,.05);
    font-style: normal;
    border-radius: 0 6px 6px 0;
    line-height: 1.7;
    position: relative
}

blockquote::before {
    content: """;
    position: absolute;right:15px;top:5px;font-size:3em;color:var(--primary-color-light);opacity:.3;font-family:Georgia,serif;line-height:1}blockquote p{margin:.5em 0;position:relative;z-index:1}blockquote blockquote{background-color:rgba(123,31,162,.03);border-right-color:var(--border-color);margin:1em 0 0;padding:1em 1.2em}blockquote blockquote::before{content:""";
    right: 10px;
    top: 0;
    font-size: 2.5em
}

a {
    color: var(--link-color);
    transition: color .2s ease
}

.btn,a,a:hover {
    text-decoration: none
}

a:hover {
    color: var(--primary-color)
}

a:active {
    text-decoration: underline
}

.btn {
    transition: all .3s ease;
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 10px 25px;
    font-size: 14px;
    font-weight: 600;
    border-radius: 10px;
    cursor: pointer;
    user-select: none;
    border: 0;
    box-shadow: var(--shadow-primary)
}

code,pre {
    background: var(--code-bg);
    font-size: .92857em;
    font-family: "Fira Code",monospace;
    font-weight: 300;
    border-radius: 4px;
    direction: ltr;
    text-align: left;
    padding: 2px 4px;
    color: var(--danger-color)
}

pre {
    color: var(--text-color-muted);
    overflow: auto;
    padding: 12px;
    max-height: 400px;
    position: relative
}

input[type=email],input[type=password],input[type=text],input[type=url],textarea {
    box-sizing: border-box;
    padding: 10px;
    width: 100%;
    border: 1px solid var(--input-border);
    border-radius: 4px;
    direction: rtl;
    background-color: var(--background);
    color: var(--text-color)
}

textarea {
    resize: vertical
}

::-webkit-input-placeholder {
    color: var(--placeholder-color)
}

ul {
    list-style: none;
    padding-right: 0;
    margin: 2em 0
}

ul li {
    position: relative;
    padding-right: 22px;
    margin-bottom: 12px;
    line-height: 1.8
}

ul li::before {
    content: "";
    position: absolute;
    right: 0;
    top: .68em;
    width: 10px;
    height: 10px;
    background: var(--primary-color);
    border-radius: 50%;
    display: inline-block
}

#header {
    width: 100%;
    background-color: var(--card-bg);
    box-shadow: 0 2px 10px rgba(0,0,0,.05);
    padding: 10px 0;
    position: sticky;
    top: 0;
    z-index: 999
}

nav.main-nav {
    width: 100%;
    max-width: 1200px;
    display: flex;
    align-items: center;
    padding: 0 20px;
    justify-content: space-between;
    min-height: 50px;
    box-sizing: border-box
}

/* گروه لوگو + دکمه همبرگری — سمت راست (در RTL) */
.nav-brand-group {
    display: flex;
    align-items: center;
    gap: 12px;
    flex-shrink: 0;
    order: 1
}

/* منوهای اصلی — وسط چین */
.nav-menu-center {
    display: flex;
    align-items: center;
    justify-content: center;
    flex: 1 1 auto;
    order: 2;
    min-width: 0
}

/* اکشن‌ها (جستجو و ...) — سمت چپ */
.nav-actions {
    display: flex;
    align-items: center;
    gap: 12px;
    flex-shrink: 0;
    order: 3
}

/* پشتیبان برای کلاس‌های قدیمی nav-group-left/right */
.nav-group-left,.nav-group-right {
    display: flex;
    align-items: center;
    gap: 15px
}

nav.main-nav .menu-links {
    display: flex;
    align-items: center;
    width: auto
}

nav.main-nav ul {
    margin: 0;
    padding: 0;
    list-style-type: none;
    display: flex
}

nav.main-nav ul li {
    padding: 0;
    margin: 0;
    line-height: normal;
    position: relative
}

nav.main-nav ul li::before {
    content: none!important
}

nav.main-nav a {
    color: var(--text-color);
    font-size: 1em;
    border-radius: 6px;
    text-decoration: none;
    transition: background-color .25s ease,color .25s ease
}

#fullscreen-search-container,#header,.search-open-button,ul li::before {
    display: flex;
    justify-content: center;
    align-items: center
}

.search-open-button {
    background: 0 0;
    border: 0;
    cursor: pointer;
    color: var(--text-color);
    padding: 8px;
    border-radius: 50%;
    transition: background-color .2s ease
}

.search-open-button svg {
    width: 22px;
    height: 22px
}

.search-open-button:hover {
    background-color: var(--nav-hover-bg)
}

#fullscreen-search-container {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100vh;
    background: linear-gradient(135deg, rgba(18,16,18,.97), rgba(30,26,30,.97));
    z-index: 9999;
    visibility: hidden;
    opacity: 0;
    transition: opacity .3s ease,visibility .3s ease;
    -webkit-backdrop-filter: blur(8px);
    backdrop-filter: blur(8px);
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 20px
}

#fullscreen-search-container.active {
    visibility: visible;
    opacity: 1
}

#fullscreen-search-container .search-form {
    width: 100%;
    max-width: 680px;
    position: relative;
}

#fullscreen-search-container .search-input-wrapper {
    position: relative;
    display: flex;
    align-items: center;
    gap: 14px;
    padding: 18px 22px;
    background: var(--card-bg);
    border: 1px solid var(--border-color);
    border-radius: var(--radius-lg, 14px);
    transition: border-color .25s ease, box-shadow .25s ease;
}

#fullscreen-search-container .search-input-wrapper:focus-within {
    border-color: var(--primary-color);
    box-shadow: 0 0 0 4px rgba(156, 39, 176, .15);
}

#fullscreen-search-container .search-input {
    width: 100%;
    padding: 0;
    background: transparent;
    border: 0;
    color: var(--heading-color);
    font-size: 1.2rem;
    font-family: "Vazirmatn",sans-serif;
    outline: 0;
    box-sizing: border-box;
    min-width: 0;
}

#fullscreen-search-container .search-input::placeholder {
    color: var(--text-color-muted);
    opacity: .85;
}

.search-submit-button {
    flex-shrink: 0;
    background: 0 0;
    border: 0;
    cursor: pointer;
    color: var(--text-color-muted);
    padding: 6px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
    transition: color .2s ease, background-color .2s ease;
}

.search-submit-button:hover {
    color: var(--link-color);
    background: var(--nav-hover-bg);
}

.search-close-button {
    position: absolute;
    top: 24px;
    left: 24px;
    width: 44px;
    height: 44px;
    background: rgba(255,255,255,.05);
    border: 1px solid var(--border-color);
    border-radius: 50%;
    cursor: pointer;
    color: var(--heading-color);
    font-size: 24px;
    line-height: 1;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: all .2s ease;
}

.search-close-button:hover {
    background: var(--nav-hover-bg);
    border-color: var(--primary-color);
    transform: rotate(90deg);
}

/* راهنمای کوچک زیر فیلد جستجو */
.search-form::after {
    content: "ESC برای بستن";
    display: block;
    margin-top: 16px;
    text-align: center;
    font-size: .8rem;
    color: var(--text-color-muted);
    opacity: .7;
    letter-spacing: .03em;
}

article.post,article.post-single {
    max-width: 800px;
    min-width: 40vw;
    margin: 0 auto;
    padding: 30px;
    background-color: var(--card-bg);
    border-radius: 8px;
    border-bottom: 10px solid var(--border-color);
    color: var(--text-color);
    box-sizing: border-box;
    width: 100%
}

@media (max-width:900px) {
    article.post,article.post-single {
        max-width: 100%;
        min-width: 0;
        padding: 16px;
        border-radius: 0
    }
}

.post-title {
    font-size: 2rem;
    margin-bottom: 20px;
    text-align: center
}

.author-info p,.post-meta {
    color: var(--text-color-muted)
}

.post-meta {
    margin-bottom: 30px;
    font-size: .9rem;
    text-align: center
}

.post-footer {
    padding-top: 30px
}

.post-tags {
    margin-bottom: 30px
}

.page-navigator a,.post-tags a {
    display: inline-block;
    color: var(--text-color);
    text-decoration: none
}

.post-tags a {
    padding: 4px 28px 4px 12px;
    background: var(--tag-bg);
    border-radius: 8px;
    margin: 0 0 6px 6px;
    font-size: .85rem;
    position: relative;
    direction: rtl
}

.post-tags a:hover {
    text-decoration: none;
    background-color: var(--tag-hover-color)
}

.post-author-box {
    display: flex;
    align-items: flex-start;
    gap: 20px;
    background-color: var(--background);
    border-radius: 10px;
    padding: 25px;
    margin: 30px 0;
    box-shadow: var(--shadow-primary);
    border: 1px solid var(--border-color)
}

/* در نسخهٔ ۱٫۶ این قانون بازنویسی شد تا با سایدبار هماهنگ باشد.
   این قانون قدیمی فقط برای پشتیبانی از استایل‌های قدیمی نگه داشته شده. */
.author-avatar {
    border-radius: 50%;
    flex-shrink: 0;
}

.author-info h3 {
    margin: 0 0 10px;
    color: var(--heading-color);
    font-size: 1.2em
}

.author-info p {
    margin: 0;
    line-height: 1.6
}

.archive-header {
    text-align: center;
    margin: 40px 0
}

.archive-header h1 {
    font-size: 2rem;
    color: var(--heading-color)
}

.archive-list {
    max-width: 800px;
    margin: 0 auto;
    padding: 0 20px
}

.archive-item {
    margin-bottom: 30px;
    padding-bottom: 30px;
    border-bottom: 1px solid var(--border-color)
}

.archive-item h2 {
    font-size: 1.5rem;
    margin-bottom: 10px
}

.archive-item time,.no-results {
    color: var(--text-color-muted);
    font-size: .9rem
}

.no-results {
    text-align: center;
    font-size: 1.2rem;
    padding: 50px 0
}

.page-navigator {
    margin: 25px 0;
    padding: 0;
    list-style: none;
    text-align: center
}

.page-navigator a {
    padding: 0 10px;
    height: 30px;
    line-height: 30px;
    background: var(--border-color);
    border-radius: 4px;
    font-weight: 600;
    transition: background-color .3s ease;
    margin: 0 5px
}

.page-navigator li {
    display: inline-block;
    margin: 0 4px
}

.page-navigator .current a,.page-navigator a:hover {
    background: var(--primary-color);
    color: var(--heading-color)
}

.page-navigator a:hover {
    text-decoration: none
}

.page-navigator .current a {
    cursor: default
}

.polaroid-grid {
    margin: 0 auto;
    width: 100%;
    box-sizing: border-box;
    padding: 20px;
    display: grid;
    grid-template-columns: repeat(auto-fill,minmax(300px,1fr));
    gap: 30px;
    max-width: 100%
}

.polaroid-card {
    background: var(--card-bg);
    border-radius: 8px;
    overflow: hidden;
    display: flex;
    flex-direction: column;
    height: 100%;
    margin: 0;
    box-sizing: border-box;
    border: 1px solid var(--border-color)
}

.polaroid-card:hover {
    box-shadow: var(--shadow-primary)
}

.polaroid-image {
    height: 200px;
    border-bottom: 1px solid var(--border-color);
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat
}

.polaroid-footer {
    padding: 20px;
    flex: 1;
    display: flex;
    flex-direction: column
}

.polaroid-title {
    margin: 0 0 10px;
    font-size: 1.1rem;
    color: var(--heading-color);
    text-align: right
}

.polaroid-excerpt {
    color: var(--text-color-muted);
    font-size: .9rem;
    line-height: 1.5;
    margin-bottom: 15px;
    text-align: right;
    flex: 1
}

.polaroid-link {
    color: var(--text-color);
    display: block;
    padding: 8px 15px;
    background: var(--background);
    border-radius: 4px;
    text-align: center;
    transition: all .3s ease;
    font-size: .9rem;
    border: 1px solid var(--border-color);
    width: 100%;
    margin-top: auto
}

.polaroid-link:hover {
    background: var(--primary-color);
    color: var(--heading-color);
    text-decoration: none;
    border-color: var(--primary-color)
}

.polaroid-card::after {
    content: "";
    position: absolute;
    top: 10px;
    left: 10px;
    right: 10px;
    bottom: 10px;
    border: 1px solid rgba(255,255,255,.3);
    pointer-events: none;
    z-index: 1;
    border-radius: 4px;
    opacity: .5
}

.polaroid-image {
    transition: all .4s cubic-bezier(.4,0,.2,1);
    transform-origin: center;
    overflow: hidden;
    position: relative
}

.polaroid-card {
    background: rgba(30,30,30,.85);
    border: 1px solid #444;
    border-bottom: 10px solid #333;
    padding: 15px 15px 25px;
    position: relative;
    transition: all .3s ease;
    box-shadow: 0 2px 5px rgba(0,0,0,.3)
}

.polaroid-card:hover .polaroid-image {
    transform: scale(1.03)
}

.default-image-overlay,.polaroid-image::before {
    position: absolute;
    left: 0;
    right: 0;
    bottom: 0;
    transition: opacity .3s ease
}

.polaroid-image::before {
    content: "";
    height: 40%;
    background: linear-gradient(to top,rgba(0,0,0,.5)0,transparent 100%);
    opacity: 0;
    z-index: 1
}

.custom-gallery.gallery-grid-fade a:hover::after,.polaroid-card:hover .polaroid-image::before {
    opacity: 1
}

.default-image-overlay {
    top: 0;
    background: var(--primary-color-light);
    display: flex;
    align-items: center;
    justify-content: center;
    opacity: .7
}

.polaroid-card {
    animation: fadeInUp .6s ease forwards;
    opacity: 0
}

.polaroid-card:nth-child(1) {
    animation-delay: .1s
}

.polaroid-card:nth-child(2) {
    animation-delay: .2s
}

.polaroid-card:nth-child(3) {
    animation-delay: .3s
}

.polaroid-card:nth-child(4) {
    animation-delay: .4s
}

.polaroid-card:nth-child(5) {
    animation-delay: .5s
}

.polaroid-card:nth-child(n+6) {
    animation-delay: .6s
}

#footer {
    text-align: center;
    padding: 3em 0;
    line-height: 1.5;
    background-color: var(--footer-bg);
    color: var(--footer-color);
    margin-top: auto;
    font-size: 14px
}

@media (min-width:993px) {
    .menu-toggle {
        display: none!important
    }

    .menu-links ul {
        display: flex;
        justify-content: center;
        flex-wrap: wrap;
        align-items: center;
        gap: 8px
    }

    .menu-links a {
        padding: 10px 18px;
        color: var(--text-color);
        font-weight: 500;
        border-radius: 6px;
        text-decoration: none;
        transition: background-color .25s ease,color .25s ease;
        white-space: nowrap;
        margin: 0 5px;
        display: inline-block
    }

    .menu-links .current>a,.menu-links a:hover {
        color: var(--link-color)
    }

    .menu-links a:hover {
        background-color: var(--nav-hover-bg)
    }

    .menu-links .current>a {
        font-weight: 600;
        background-color: var(--nav-current-bg)
    }
}

@media (min-width:992px) {
    .menu-toggle {
        display: none!important;
        flex-direction: column;
        justify-content: center;
        align-items: center;
        width: 44px;
        height: 44px;
        background: 0 0;
        border: 0;
        cursor: pointer;
        z-index: 1001;
        padding: 0;
        position: relative
    }

    .menu-links {
        display: none
    }
}

@media (max-width:991px) {
    .menu-toggle {
        display: flex;
        flex-direction: column;
        justify-content: center;
        align-items: center;
        width: 44px;
        height: 44px;
        background: 0 0;
        border: 0;
        cursor: pointer;
        z-index: 1001;
        padding: 0;
        position: relative
    }

    .menu-toggle span {
        display: block;
        width: 26px;
        height: 2px;
        margin: 4px 0;
        background: var(--text-color);
        border-radius: 2px;
        transition: all .3s ease;
        transform-origin: center
    }

    .menu-toggle.open span:nth-child(1) {
        transform: translateY(6px) rotate(45deg)
    }

    .menu-toggle.open span:nth-child(2) {
        opacity: 0;
        transform: scaleX(0)
    }

    .menu-toggle.open span:nth-child(3) {
        transform: translateY(-6px) rotate(-45deg)
    }

    .menu-links {
        display: flex;
        flex-direction: column;
        position: fixed;
        top: 0;
        right: -100%;
        width: 90vw;
        height: 100vh;
        background: var(--card-bg);
        padding: 300px 20px 40px!important;
        z-index: 1000;
        overflow-y: auto;
        box-shadow: -5px 0 20px rgba(0,0,0,.2);
        transition: right .4s ease;
        align-items: stretch
    }

    .menu-links ul {
        flex-direction: column;
        width: 100%;
        gap: 10px
    }

    .menu-links ul li {
        width: 100%
    }

    .menu-links.open {
        right: 0
    }

    .menu-links a {
        display: block;
        padding: 14px 18px;
        margin: 2px 0;
        font-size: 1.1rem;
        text-align: right;
        border-radius: 8px;
        color: var(--text-color);
        text-decoration: none;
        background-color: transparent;
        transition: all .2s ease;
        width: 100%
    }

    .menu-links .current>a,.menu-links a:hover {
        background-color: var(--nav-hover-bg);
        color: var(--link-color)
    }

    body.menu-open {
        overflow: hidden
    }

    nav.main-nav .menu-links {
        display: flex;
        align-items: revert;
        width: 300px
    }
}

@media (max-width:768px) {
    #header {
        padding: 0 10px
    }

    main#main-content {
        padding: 10px
    }

    .container {
        padding: 15px
    }

    article.post,article.post-single {
        padding: 20px
    }

    .post-title {
        font-size: 1.5rem
    }

    .post-content h1 {
        font-size: 1.8rem
    }

    .post-content h2 {
        font-size: 1.6rem
    }

    .post-content h3 {
        font-size: 1.4rem
    }

    .post-author-box {
        flex-direction: column;
        align-items: center;
        text-align: center
    }

    .polaroid-grid {
        grid-template-columns: 1fr;
        gap: 20px;
        padding: 0 10px
    }
}

.avatar-wrapper {
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: column;
    width: 100%;
    text-align: center;
    background-color: var(--card-bg);
    padding: 20px 0
}

.avatar-container {
    position: relative;
    width: 120px;
    height: 120px;
    border-radius: 50%;
    border: 4px solid var(--primary-color);
    box-shadow: var(--shadow-primary)
}

.avatar-container img.site-logo,.post-banner img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
    border-radius: 50%
}

.post-banner img {
    object-position: center;
    border-radius: 8px;
    border: 1px solid var(--border-color)
}

.site-info {
    text-align: center;
    margin-top: 15px
}

.site-title {
    margin: 0;
    font-size: 1.5em;
    font-weight: 700;
    color: var(--heading-color)
}

.site-description {
    margin-top: 5px;
    font-size: .9em;
    color: var(--heading-light)
}

.post-banner {
    width: 100%;
    max-height: 400px;
    margin: 0 auto 2rem;
    overflow: hidden;
    position: relative;
    aspect-ratio: 16/9;
    border-radius: 8px
}

.simple-lightbox-modal {
    display: none;
    position: fixed;
    z-index: 10000;
    left: 0;
    top: 0;
    width: 100vw;
    height: 100vh;
    background: var(--background);
    justify-content: center;
    align-items: center
}

.simple-lightbox-modal.active {
    display: flex
}

.simple-lightbox-modal img {
    max-width: 90vw;
    max-height: 85vh;
    box-shadow: 0 0 20px var(--background);
    border-radius: 8px
}

.simple-lightbox-close {
    position: absolute;
    top: 15px;
    right: 35px;
    color: var(--heading-color);
    font-size: 45px;
    font-weight: 700;
    transition: color .3s ease;
    cursor: pointer;
    z-index: 1001
}

.simple-lightbox-close:focus,.simple-lightbox-close:hover {
    color: var(--text-color-muted);
    text-decoration: none
}

.simple-lightbox-next,.simple-lightbox-prev {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    color: var(--heading-color);
    font-size: 2rem;
    cursor: pointer;
    z-index: 1001;
    background-color: rgba(30,30,30,.5);
    border-radius: 50%;
    width: 50px;
    height: 50px;
    display: flex;
    align-items: center;
    justify-content: center;
    line-height: 1;
    user-select: none;
    transition: background-color .3s ease
}

.simple-lightbox-prev {
    right: 20px;
    left: auto
}

.simple-lightbox-next {
    left: 20px;
    right: auto
}

.simple-lightbox-next:hover,.simple-lightbox-prev:hover {
    background-color: rgba(0,0,0,.8)
}

.post-gallery-section {
    margin: 40px 0;
    padding-top: 25px
}

.post-gallery-section h3 {
    margin-bottom: 20px;
    font-size: 1.5rem;
    color: var(--heading-color)
}

.custom-gallery {
    display: grid;
    grid-template-columns: repeat(3,1fr);
    gap: 15px
}

.custom-gallery a {
    display: block;
    overflow: hidden;
    border-radius: 8px;
    position: relative;
    box-shadow: 0 4px 10px rgba(0,0,0,.08);
    transition: all .35s ease
}

.custom-gallery a:hover {
    transform: translateY(-5px);
    box-shadow: 0 8px 20px rgba(0,0,0,.15)
}

.custom-gallery img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
    transition: all .4s cubic-bezier(.25,.46,.45,.94)
}

.custom-gallery.gallery-grid-zoom a:hover img {
    transform: scale(1.1)
}

.custom-gallery.gallery-grid-fade a::after {
    content: "";
    position: absolute;
    inset: 0;
    background: rgba(0,0,0,.5);
    opacity: 0;
    transition: opacity .4s ease
}

.custom-gallery.gallery-grid-slide a::after {
    content: "";
    position: absolute;
    inset: 0;
    background: linear-gradient(to top,rgba(0,0,0,.7)0,transparent 60%);
    transform: translateY(100%);
    transition: transform .4s cubic-bezier(.25,.46,.45,.94)
}

.custom-gallery.gallery-grid-slide a:hover::after {
    transform: translateY(0)
}

.custom-gallery.gallery-grid-focus a:hover {
    z-index: 10
}

.custom-gallery.gallery-grid-focus:hover a img {
    filter: blur(3px) grayscale(80%) brightness(.8);
    transform: scale(.98)
}

.custom-gallery.gallery-grid-focus a:hover img {
    filter: none;
    transform: scale(1.1)
}

@media (max-width:992px) {
    .custom-gallery {
        grid-template-columns: repeat(2,1fr)
    }
}

@media (max-width:576px) {
    .custom-gallery {
        grid-template-columns: 1fr
    }
}

#comments {
    font-family: "Vazirmatn",sans-serif
}

.styled-heading {
    display: flex;
    align-items: center;
    font-size: 1.5rem;
    color: #2c3e50;
    margin: 40px 0 20px;
    padding-bottom: 10px;
    border-bottom: 2px solid #3498db
}

.styled-heading .heading-icon {
    width: 26px;
    height: 26px;
    color: #3498db;
    margin-left: 12px
}

.styled-heading span {
    line-height: 1.5
}

@media (min-width:900px) {
    .post-page-container {
        display: flex;
        flex-direction: row;
        align-items: flex-start;
        gap: 32px
    }

    .post-page-container .content-area {
        flex: 1 1 0;
        min-width: 0
    }

    .post-page-container .site-sidebar {
        flex: 0 0 320px;
        max-width: 95vw
    }
}

@media (max-width:899px) {
    .post-page-container {
        flex-direction: column;
        align-items: center;
        gap: 0
    }
}

.latest-comments ul,.latest-posts ul {
    list-style: none;
    padding: 0;
    margin: 0
}

.latest-comments li,.latest-posts li {
    margin-bottom: 13px;
    line-height: 1.7;
    position: relative
}

.latest-comments li::before,.latest-posts li::before {
    content: "•";
    color: var(--primary-color);
    margin-left: 8px;
    font-weight: 700
}

.latest-comments a,.latest-posts a {
    color: var(--link-color);
    text-decoration: none;
    transition: color .2s;
    font-size: 1em
}

.custom-links-list a:hover,.latest-comments a:hover,.latest-posts a:hover {
    color: var(--primary-color);
    text-decoration: underline
}

#comments {
    margin: 2rem 0
}

.comments-title {
    font-size: 1.5rem;
    margin-bottom: 1.5rem
}

.comment-children,.comment-list {
    list-style: none!important;
    padding: 0!important;
    margin: 0!important
}

.comment-children li,.comment-list li {
    list-style-type: none!important;
    list-style-image: none!important;
    list-style-position: outside!important
}

.comment-item {
    display: flex;
    gap: 1rem;
    margin-bottom: 1.5rem;
    padding: 1rem;
    background: var(--card-bg);
    border-radius: 8px;
    border: 1px solid var(--border-color);
    position: relative
}

.comment-children li::after,.comment-children li::before,.comment-item::after,.comment-item::before,.comment-list li::after,.comment-list li::before {
    content: none!important;
    display: none!important
}

.comment-avatar {
    flex-shrink: 0
}

.comment-avatar img {
    width: 56px;
    height: 56px;
    border-radius: 50%;
    object-fit: cover;
    border: 2px solid var(--primary-color-light)
}

.comment-body {
    flex: 1
}

.comment-meta {
    display: flex;
    align-items: center;
    gap: 1rem;
    margin-bottom: .5rem;
    flex-wrap: wrap
}

.comment-author {
    font-weight: 600;
    color: var(--heading-color)
}

.comment-author a {
    color: inherit;
    text-decoration: none
}

#comment-form label {
    color: var(--text-color-muted);
    display: block;
    margin-bottom: .5rem;
    font-size: .9rem
}

.comment-date {
    font-size: .85rem;
    color: var(--text-color-muted)
}

.comment-reply a {
    font-size: .85rem;
    color: var(--link-color);
    text-decoration: none
}

.comment-content {
    line-height: 1.6;
    font-size: .95rem
}

.comment-children {
    padding-right: 2rem;
    margin-top: 1rem
}

.respond {
    margin-top: 2rem;
    padding: 1.5rem;
    background: var(--card-bg);
    border-radius: 8px;
    border: 1px solid var(--border-color);
    border-bottom: 10px solid var(--border-color)
}

.comment-reply-title {
    font-size: 1.25rem;
    margin-bottom: 1rem;
    color: var(--heading-color)
}

.comment-fields-row {
    display: flex;
    gap: 1rem;
    margin-bottom: 1rem;
    flex-wrap: wrap
}

.comment-fields-row>div {
    flex: 1;
    min-width: 150px
}

.comment-textarea-row {
    margin-bottom: 1rem
}

#comment-form input,#comment-form textarea {
    width: 100%;
    padding: .75rem;
    background: var(--background);
    border: 1px solid var(--input-border);
    border-radius: 4px;
    color: var(--text-color);
    font-family: inherit
}

#comment-form textarea {
    min-height: 120px
}

#misubmit {
    background: var(--primary-color);
    color: var(--heading-color);
    border: 0;
    padding: .75rem 1.5rem;
    border-radius: 4px;
    cursor: pointer;
    transition: background .2s
}

#misubmit:hover {
    background: var(--button-download-hover)
}

@media (max-width:768px) {
    .comment-fields-row>div {
        flex: 100%
    }

    .comment-item {
        flex-direction: column
    }

    .comment-avatar {
        margin-bottom: 1rem
    }

    .comment-children {
        padding-right: 1rem
    }
}

.back-to-top,.copy-code-btn {
    color: var(--heading-color);
    border: 0;
    cursor: pointer;
    opacity: 0;
    transition: all .3s ease
}

.copy-code-btn {
    position: absolute;
    top: 8px;
    right: 8px;
    left: auto;
    padding: 4px 12px;
    background: var(--card-bg);
    border-radius: 4px;
    font-size: .8em;
    font-family: "Vazirmatn",sans-serif;
    z-index: 1;
    direction: rtl
}

pre:hover .copy-code-btn {
    opacity: 1
}

.copy-code-btn:hover {
    background: var(--background);
    transform: translateY(-2px)
}

.copy-code-btn.copied {
    background: var(--success-color)
}

.back-to-top {
    position: fixed;
    bottom: 30px;
    right: 30px;
    width: 50px;
    height: 50px;
    background-color: var(--primary-color);
    border-radius: 50%;
    font-size: 20px;
    visibility: hidden;
    z-index: 99;
    display: flex;
    align-items: center;
    justify-content: center;
    box-shadow: 0 2px 10px rgba(0,0,0,.2)
}

.back-to-top.show {
    opacity: 1;
    visibility: visible
}

.back-to-top:hover {
    background-color: var(--button-download-hover);
    transform: translateY(-3px)
}

@media (max-width:768px) {
    .back-to-top {
        width: 40px;
        height: 40px;
        font-size: 16px;
        bottom: 20px;
        left: 20px
    }
}

/* ---------- صفحهٔ جستجو: فرم جستجوی یکپارچه با پوسته ---------- */
.shabnam-search-form {
    max-width: 720px;
    margin: 0 auto 32px;
}

.shabnam-search-input-wrapper {
    position: relative;
    display: flex;
    align-items: stretch;
    background: var(--card-bg);
    border: 1px solid var(--border-color);
    border-radius: var(--radius-lg, 14px);
    overflow: hidden;
    transition: border-color .25s ease, box-shadow .25s ease;
}

.shabnam-search-input-wrapper:focus-within {
    border-color: var(--primary-color);
    box-shadow: 0 0 0 3px rgba(156, 39, 176, .15);
}

.shabnam-search-icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 56px;
    flex-shrink: 0;
    color: var(--text-color-muted);
    background: transparent;
}

.shabnam-search-input {
    flex: 1;
    border: 0;
    outline: 0;
    background: transparent;
    color: var(--text-color);
    padding: 18px 8px;
    font-size: 1rem;
    font-family: inherit;
    min-width: 0;
}

.shabnam-search-input::placeholder {
    color: var(--text-color-light);
    opacity: .9;
}

.shabnam-search-submit {
    border: 0;
    background: var(--gradient);
    color: #fff;
    padding: 0 28px;
    font-size: .95rem;
    font-weight: 600;
    font-family: inherit;
    cursor: pointer;
    transition: opacity .2s ease;
    flex-shrink: 0;
}

.shabnam-search-submit:hover {
    opacity: .9;
}

.shabnam-search-submit:active {
    opacity: 1;
}

/* استیت خالیِ صفحهٔ جستجو */
.empty-state-search {
    padding: 80px 20px;
}

.empty-state-search .empty-ornament {
    color: var(--text-color-muted);
    margin-bottom: 16px;
}

.empty-state-search .empty-ornament svg {
    margin: 0 auto;
    opacity: .4;
}

.empty-state-search .empty-title {
    font-size: 1.3rem;
    margin: 0 0 8px;
    color: var(--heading-color);
}

.empty-state-search .empty-desc {
    font-size: .95rem;
    color: var(--text-color-muted);
    line-height: 1.8;
    max-width: 460px;
    margin: 0 auto;
}

@media (max-width: 700px) {
    .shabnam-search-form {
        margin-bottom: 24px;
    }

    .shabnam-search-input {
        padding: 14px 6px;
    }

    .shabnam-search-icon {
        width: 44px;
    }

    .shabnam-search-submit {
        padding: 0 18px;
        font-size: .9rem;
    }

    .empty-state-search {
        padding: 60px 16px;
    }
}

.site-sidebar {
    background: var(--card-bg);
    border-radius: 10px;
    padding: 28px 22px;
    color: var(--text-color);
    border-bottom: 10px solid var(--border-color);
    margin-bottom: 30px;
    width: 100%;
    max-width: 95vw;
    font-family: inherit
}

.sidebar-section {
    margin-bottom: 32px
}

.sidebar-section:last-child {
    margin-bottom: 0
}

.comments-title,.sidebar-section h3 {
    color: var(--heading-color);
    text-align: right;
    padding-right: 1rem
}

.sidebar-section h3 {
    font-size: 1.15em;
    border-bottom: 1.5px solid var(--primary-color);
    padding-bottom: 8px;
    margin-bottom: 18px;
    font-weight: 700
}

.compact-comments-list,.compact-posts-list {
    padding: 0;
    margin: 0;
    display: flex;
    flex-direction: column;
    gap: 12px;
    width: 100%
}

.compact-comment-item,.compact-post-item {
    background: var(--card-bg);
    border-radius: 8px;
    overflow: hidden;
    border: 1px solid var(--border-color);
    transition: all .3s ease;
    position: relative
}

.compact-comment-item:hover,.compact-post-item:hover {
    transform: translateY(-3px);
    box-shadow: 0 4px 12px rgba(0,0,0,.08)
}

.compact-comment-link,.compact-post-link {
    display: flex;
    align-items: flex-start;
    gap: 12px;
    text-decoration: none!important;
    color: inherit;
    padding: 12px;
    width: 100%;
    box-sizing: border-box
}

.compact-comment-avatar,.compact-post-image {
    flex-shrink: 0;
    border: 1px solid var(--border-color)
}

.compact-post-image {
    width: 50px;
    height: 50px;
    min-width: 50px;
    border-radius: 6px;
    background-size: cover;
    background-position: center;
    position: relative;
    margin-top: 3px
}

.compact-comment-avatar {
    width: 40px;
    height: 40px;
    min-width: 40px;
    border-radius: 50%;
    overflow: hidden
}

.compact-comment-avatar img {
    width: 100%;
    height: 100%;
    object-fit: cover
}

.compact-comment-content,.compact-post-content {
    flex: 1;
    overflow: hidden;
    min-width: 0
}

.compact-comment-author,.compact-post-title {
    margin: 0;
    font-size: .85rem;
    color: var(--heading-color);
    line-height: 1.4;
    font-weight: 500;
    transition: color .2s ease
}

.compact-post-title {
    width: 100%;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
    text-overflow: ellipsis;
    max-height: 2.8em
}

.compact-comment-author {
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis
}

.compact-comment-item:hover .compact-comment-author,.compact-post-item:hover .compact-post-title {
    color: var(--link-color)
}

.compact-comment-excerpt,table {
    color: var(--text-color);
    overflow: hidden
}

.compact-comment-excerpt {
    margin: 5px 0 0;
    font-size: .8rem;
    line-height: 1.4;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    text-overflow: ellipsis;
    max-height: 2.8em
}

.compact-comment-meta,.compact-post-meta {
    display: flex;
    gap: 8px;
    margin-top: 6px;
    font-size: .7rem;
    color: var(--text-color-muted);
    flex-wrap: wrap
}

@media (max-width:768px) {
    .compact-comment-link,.compact-post-link {
        padding: 10px
    }

    .compact-post-image {
        width: 45px;
        height: 45px;
        min-width: 45px
    }

    .compact-post-title {
        font-size: .82rem
    }

    .compact-comment-avatar {
        width: 36px;
        height: 36px;
        min-width: 36px
    }

    .compact-comment-excerpt {
        font-size: .78rem
    }

    .compact-comment-item:hover,.compact-post-item:hover {
        transform: translateY(-2px);
        box-shadow: 0 3px 8px rgba(0,0,0,.08)
    }
}

hr {
    border: 0;
    height: 2px;
    margin: 2.5rem auto;
    max-width: 80%;
    background: var(--gradient);
    background-size: 200% 200%;
    border-radius: 50px;
    box-shadow: 0 2px 8px rgba(156,39,176,.3);
    position: relative;
    overflow: visible;
    animation: gradientShift 4s ease infinite
}

hr::after,hr::before {
    content: "";
    position: absolute
}

hr::before {
    top: -5px;
    left: 50%;
    transform: translateX(-50%);
    width: 12px;
    height: 12px;
    background: var(--primary-color);
    border-radius: 50%;
    box-shadow: 0 0 10px var(--primary-color);
    animation: pulse 2s ease infinite
}

hr::after {
    top: -1px;
    left: 0;
    width: 100%;
    height: 100%;
    background: linear-gradient(90deg,transparent,rgba(255,255,255,.2),transparent);
    border-radius: 50px
}

@media (max-width:768px) {
    hr {
        max-width: 90%;
        margin: 1.8rem auto
    }

    code,pre {
        white-space: pre-wrap;
        word-break: break-all;
        overflow-wrap: anywhere
    }
}

table {
    width: 100%;
    max-width: 700px;
    border-collapse: separate;
    border-spacing: 0;
    direction: rtl;
    margin: 2em auto;
    box-shadow: 0 4px 24px rgba(156,39,176,.1);
    overflow-x: auto;
    border-radius: 12px
}

thead {
    background: linear-gradient(90deg,var(--primary-color-light),transparent)
}

td,th {
    padding: 16px 18px;
    font-family: inherit;
    font-size: 1.12em;
    transition: background .2s
}

table,th {
    background: var(--card-bg)
}

th {
    color: var(--primary-color);
    font-weight: 800;
    letter-spacing: 1.5px;
    position: relative;
    border-bottom: 2.5px solid var(--primary-color)
}

td {
    border-bottom: 1.5px solid var(--border-color)
}

tbody tr:hover {
    background: var(--primary-color-light);
    transition: background .25s
}

tbody tr:last-child td {
    border-bottom: none
}

@media (max-width:700px) {
    table,tbody,td,th,thead,tr {
        display: block;
        width: 100%
    }

    tr {
        margin-bottom: 14px;
        box-shadow: 0 2px 7px rgba(156,39,176,.07);
        border-radius: 8px;
        background: var(--background)
    }

    thead {
        background: 0 0!important
    }

    td,th {
        font-size: 1em
    }

    th {
        background: var(--primary-color-light);
        text-align: center;
        border-bottom: none;
        color: var(--primary-color)
    }

    td {
        border: 0;
        border-bottom: 1px solid var(--border-color);
        text-align: right!important;
        position: relative;
        padding-right: 45%;
        background: 0 0
    }

    td:before {
        position: absolute;
        right: 15px;
        top: 12px;
        content: attr(data-label);
        color: var(--heading-light);
        font-weight: 700;
        text-align: right;
        font-size: .93em
    }
}

nav.main-nav ul li a[target=_blank]::after {
    content: "";
    display: inline-block;
    width: 14px;
    height: 14px;
    margin-right: 6px;
    margin-left: 2px;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='white' stroke-width='2' stroke-linecap='round' stroke-linejoin='round' transform='scale(-1, 1)' transform-origin='center'%3E%3Cpath d='M18 13v6a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2V8a2 2 0 0 1 2-2h6'%3E%3C/path%3E%3Cpolyline points='15 3 21 3 21 9'%3E%3C/polyline%3E%3Cline x1='10' y1='14' x2='21' y2='3'%3E%3C/line%3E%3C/svg%3E");
    background-repeat: no-repeat;
    background-position: center;
    vertical-align: middle;
    filter: brightness(.9)
}

.custom-links-list {
    padding: 0;
    margin: 0;
    list-style: none
}

.custom-links-list li {
    position: relative;
    padding-right: 22px;
    margin-bottom: 12px;
    line-height: 1.8
}

.custom-links-list li::before {
    content: "";
    position: absolute;
    right: 0;
    top: .68em;
    width: 10px;
    height: 10px;
    background: var(--primary-color);
    border-radius: 50%;
    display: inline-block
}

.custom-links-list a {
    color: var(--link-color);
    text-decoration: none;
    transition: color .2s ease;
    font-size: .95em
}

/* ================================================================
 *  لایهٔ مدرن‌سازی شبنم — v1.0.0
 *  این بخش روی استایل پایهٔ پوستهٔ «زیبا» سوار می‌شود و ظاهر آن را
 *  بدون تغییر هویت بنفش تیره، مدرن و یکدست می‌کند.
 * ================================================================ */

/* ---------- توکن‌ها و پایه ---------- */
:root {
    --radius-lg: 16px;
    --radius-md: 12px;
    --radius-sm: 8px;
    --shadow-soft: 0 2px 12px rgba(0, 0, 0, .25);
    --shadow-lift: 0 12px 32px rgba(0, 0, 0, .38), 0 0 0 1px rgba(156, 39, 176, .25);
    --glass-bg: rgba(30, 26, 30, .72);
    --header-h: 64px;
    --transition: .3s cubic-bezier(.4, 0, .2, 1);
}

::selection {
    background: var(--primary-color);
    color: #fff;
}

html {
    scroll-behavior: smooth;
}

/* اسکرول‌بار مدرن */
* {
    scrollbar-width: thin;
    scrollbar-color: #5a3a5a var(--background);
}

::-webkit-scrollbar {
    width: 10px;
    height: 10px;
}

::-webkit-scrollbar-track {
    background: var(--background);
}

::-webkit-scrollbar-thumb {
    background: #5a3a5a;
    border-radius: 8px;
    border: 2px solid var(--background);
}

::-webkit-scrollbar-thumb:hover {
    background: var(--primary-color);
}

/* حلقهٔ فوکوس دسترس‌پذیر */
a:focus-visible,
button:focus-visible,
input:focus-visible,
textarea:focus-visible {
    outline: 2px solid var(--primary-color);
    outline-offset: 2px;
    border-radius: 4px;
}

/* ---------- هدر شیشه‌ای چسبان ---------- */
#header {
    background: var(--glass-bg);
    -webkit-backdrop-filter: blur(14px) saturate(1.4);
    backdrop-filter: blur(14px) saturate(1.4);
    border-bottom: 1px solid rgba(156, 39, 176, .16);
    padding: 0;
    min-height: var(--header-h);
}

#header::after {
    content: "";
    position: absolute;
    inset: auto 0 -1px 0;
    height: 1px;
    background: linear-gradient(90deg, transparent, var(--primary-color), transparent);
    opacity: .5;
    pointer-events: none;
}

nav.main-nav {
    min-height: var(--header-h);
    padding: 0 20px;
}

.nav-brand {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    flex-shrink: 0;
    text-decoration: none !important;
}

/* لوگوی ناوبری — بدون قاب/حلقه، کاملاً خالص */
.nav-brand-logo {
    height: 38px;
    width: auto;
    display: block;
    border-radius: 0;
    border: 0;
    padding: 0;
    background: transparent;
    transition: opacity .25s ease;
}

.nav-brand:hover .nav-brand-logo {
    opacity: .85;
    transform: none;
    border-color: transparent;
}

/* آیکون پیش‌فرض لوگو (SVG) — کنار متن در حالت text-only */
.nav-brand-icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    line-height: 0;
    transition: transform .25s ease;
}

.nav-brand:hover .nav-brand-icon {
    transform: scale(1.05);
}

.nav-brand-text {
    font-size: 1rem;
    font-weight: 700;
    color: var(--heading-color);
    line-height: 1.3;
    text-decoration: none;
}

.nav-brand:hover .nav-brand-text {
    color: var(--link-color);
}

.search-open-button {
    width: 42px;
    height: 42px;
    border-radius: 50%;
    transition: background-color .25s ease, color .25s ease, transform .25s ease;
}

.search-open-button:hover {
    background: var(--nav-hover-bg);
    color: var(--link-color);
    transform: translateY(-1px);
}

/* ---------- بنر لوگو (جایگزین avatar-wrapper) ---------- */
.avatar-wrapper {
    display: none;
}

.site-hero {
    position: relative;
    padding: 44px 20px 40px;
    text-align: center;
    background:
        radial-gradient(ellipse 60% 70% at 50% -10%, rgba(156, 39, 176, .16), transparent 70%),
        var(--card-bg);
    border-bottom: 1px solid var(--border-color);
    overflow: hidden;
}

.site-hero::before {
    content: "";
    position: absolute;
    inset: -40% -20% auto;
    height: 200px;
    background: radial-gradient(ellipse at center, rgba(156, 39, 176, .1), transparent 65%);
    pointer-events: none;
}

.site-hero-link {
    position: relative;
    display: inline-flex;
    flex-direction: column;
    align-items: center;
    gap: 12px;
    text-decoration: none;
}

.site-hero-logo-ring,
.site-hero-avatar-wrap {
    display: inline-flex;
    align-items: center;
    justify-content: center;
}

.site-hero-logo {
    width: 110px;
    height: 110px;
    border-radius: 50%;
    object-fit: cover;
    background: var(--background);
    /* بدون قاب/حلقه/درخشش؛ آواتار خالص نمایش داده می‌شود */
}

@keyframes heroRingGlow {
    /* animation قدیمی دیگر استفاده نمی‌شود، اما برای جلوگیری از خطای CSS نگه داشته شد */
    0%, 100% { box-shadow: none; }
    50% { box-shadow: none; }
}

.site-hero-title {
    font-size: 1.35rem;
    font-weight: 700;
    color: var(--heading-color);
    line-height: 1.6;
}

.site-hero-desc {
    max-width: 560px;
    font-size: .92rem;
    color: var(--text-color-muted);
    line-height: 1.9;
}

/* ---------- کارت‌های پولاروید — یکدست‌سازی مدرن ---------- */
.polaroid-card {
    background: var(--card-bg);
    border: 1px solid var(--border-color);
    border-radius: var(--radius-lg);
    padding: 0;
    overflow: hidden;
    transition: transform var(--transition), box-shadow var(--transition), border-color var(--transition);
    animation: fadeInUp .55s ease forwards;
}

.polaroid-card:hover {
    transform: translateY(-4px);
    border-color: rgba(156, 39, 176, .45);
    box-shadow: var(--shadow-lift);
}

.polaroid-card::after {
    display: none;
}

/* لینک روی تصویر کارت */
.polaroid-image-link {
    display: block;
    width: 100%;
    text-decoration: none;
}

.polaroid-image {
    height: 170px;
    border-bottom: 1px solid var(--border-color);
    background-size: cover;
    background-position: center;
    transition: transform .45s cubic-bezier(.4, 0, .2, 1), filter .45s ease;
    filter: saturate(.96);
}

.polaroid-card:hover .polaroid-image {
    transform: scale(1.04);
    filter: saturate(1.08);
}

.polaroid-footer {
    padding: 14px 16px 16px;
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.polaroid-title {
    margin: 0;
    font-size: .98rem;
    font-weight: 600;
    line-height: 1.6;
}

.polaroid-title a {
    color: var(--heading-color);
    text-decoration: none;
    transition: color .25s ease;
    display: inline-block;
}

.polaroid-title a:hover {
    color: var(--link-color);
}

/* چکیده ۱۰۰ کاراکتری */
.polaroid-excerpt {
    margin: 0;
    font-size: .82rem;
    line-height: 1.7;
    color: var(--text-color-muted);
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

.polaroid-meta {
    display: flex;
    align-items: center;
    gap: 10px;
    margin-top: 2px;
}

.polaroid-date {
    font-size: .76rem;
    color: var(--text-color-light);
    line-height: 1;
}

/* دکمه polaroid-link قدیمی حذف شد — اکنون کل کارت قابل کلیک است */

/* چیپ‌های متا (تاریخ/بازدید) */
.polaroid-meta,
.post-meta {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    align-items: center;
}

.post-meta {
    margin-top: 4px;
    margin-bottom: 8px;
}

.meta-item {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 5px 12px;
    border-radius: 999px;
    background: rgba(156, 39, 176, .1);
    border: 1px solid rgba(156, 39, 176, .22);
    color: var(--text-color-muted);
    font-size: .82rem;
    line-height: 1.8;
}

.meta-item svg {
    flex-shrink: 0;
    opacity: .8;
}

.meta-item:hover {
    color: var(--text-color);
    border-color: rgba(156, 39, 176, .45);
}

.meta-views {
    color: var(--text-color);
}

/* سرتیتر آرشیو */
.archive-header {
    position: relative;
    margin: 36px 0 28px;
    padding: 0 12px;
}

.archive-header h1::after {
    content: "";
    display: block;
    width: 72px;
    height: 3px;
    margin: 14px auto 0;
    border-radius: 3px;
    background: linear-gradient(90deg, var(--primary-color), transparent);
}

.archive-count {
    margin-top: 12px;
    color: var(--text-color-muted);
    font-size: .92rem;
    letter-spacing: .3px;
}

/* آیتم‌های آرشیو متنی */
.archive-item {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 14px;
    padding: 16px 20px;
    margin-bottom: 14px;
    border: 1px solid var(--border-color);
    border-radius: var(--radius-md);
    background: var(--card-bg);
    transition: var(--transition);
}

.archive-item h2 {
    font-size: 1.12rem;
    margin: 0;
}

.archive-item h2 a {
    color: var(--heading-color);
    text-decoration: none;
    transition: color .25s ease;
}

.archive-item h2 a:hover {
    color: var(--link-color);
}

.archive-item-meta time {
    flex-shrink: 0;
    padding: 5px 12px;
    border-radius: 999px;
    background: rgba(156, 39, 176, .1);
    border: 1px solid rgba(156, 39, 176, .22);
    color: var(--text-color-muted);
    font-size: .8rem;
    white-space: nowrap;
}

/* ---------- صفحهٔ نوشته ---------- */
.post-page-container .post-container {
    flex: 1 1 0;
    min-width: 0;
}

article.post,
article.post-single {
    border-radius: var(--radius-lg);
    border-bottom: 1px solid var(--border-color);
    box-shadow: var(--shadow-soft);
}

.post-title {
    margin-bottom: 12px;
}

.post-header {
    margin-bottom: 18px;
    padding-bottom: 16px;
    border-bottom: 1px solid var(--border-color);
}

.author-label {
    display: inline-block;
    margin-bottom: 4px;
    padding: 2px 10px;
    border-radius: 999px;
    background: var(--primary-color-light);
    border: 1px solid rgba(156, 39, 176, .25);
    color: var(--link-color);
    font-size: .72rem;
    font-weight: 600;
    letter-spacing: .4px;
}

/* در نسخهٔ ۱٫۶+ باکس نویسنده پایین پست بازطراحی شد؛ این قانون قدیمی جای خود را به
   قواعد جدید در بخش «نسخهٔ ۱٫۵» داد. اینجا فقط اصلاح آواتار نگه داشته شده. */
.author-avatar img,
.author-avatar .avatar {
    border-radius: 50%;
    border: 2px solid rgba(156, 39, 176, .4);
}

/* تصاویر درون متن */
.lightbox-link {
    display: block;
    border-radius: var(--radius-md);
    overflow: hidden;
}

.lightbox-link img {
    border-radius: var(--radius-md);
    transition: transform .45s ease, filter .45s ease;
}

.lightbox-link:hover img {
    transform: scale(1.015);
    filter: brightness(1.05);
}

/* ---------- جستجوی تمام‌صفحه ---------- */
#fullscreen-search-container {
    background: rgba(16, 13, 16, .78);
    -webkit-backdrop-filter: blur(16px) saturate(1.3);
    backdrop-filter: blur(16px) saturate(1.3);
}

#fullscreen-search-container .search-form {
    animation: searchIn .45s cubic-bezier(.2, .9, .3, 1.2) both;
}

@keyframes searchIn {
    from { opacity: 0; transform: translateY(26px) scale(.97); }
    to { opacity: 1; transform: none; }
}

/* صفحهٔ جستجو */
.search-page .archive-header {
    margin-top: 28px;
}

/* ---------- ۴۰۴ مدرن (جایگزین استایل درون‌خطی خراب) ---------- */
.error-page-container {
    min-height: 62vh;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    text-align: center;
    padding: 40px 16px;
}

.error-code {
    font-size: clamp(5rem, 18vw, 8.5rem);
    font-weight: 900;
    line-height: 1.1;
    letter-spacing: 6px;
    background: linear-gradient(125deg, #ba68c8 15%, #7b1fa2 50%, #311b92 85%);
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
    user-select: none;
    animation: shabnamWave 2s ease-in-out infinite;
}

@keyframes shabnamWave {
    0%, 100% { transform: scale(1) rotate(-2deg); }
    25% { transform: scale(1.05, .95) rotate(2deg); }
    50% { transform: scale(.97, 1.04) rotate(-1deg); }
    75% { transform: scale(1.03) rotate(1deg); }
}

.error-message {
    margin: 18px 0 8px;
    font-size: 1.35rem;
    color: var(--heading-color);
    font-weight: 700;
}

.error-hint {
    max-width: 520px;
    color: var(--text-color-muted);
    line-height: 2;
    font-size: .95rem;
}

.error-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 12px;
    justify-content: center;
    margin-top: 28px;
}

.error-home-link,
.error-search-link {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 12px 24px;
    border-radius: 999px;
    font-size: .95rem;
    font-weight: 600;
    text-decoration: none;
    cursor: pointer;
    transition: var(--transition);
}

.error-home-link {
    color: #fff;
    background: linear-gradient(120deg, var(--button-download-bg), var(--button-preview-bg));
    box-shadow: 0 8px 24px rgba(156, 39, 176, .35);
}

.error-home-link:hover {
    transform: translateY(-2px);
    box-shadow: 0 12px 30px rgba(156, 39, 176, .5);
    color: #fff;
}

.error-search-link {
    color: var(--text-color);
    background: var(--primary-color-light);
    border: 1px solid rgba(156, 39, 176, .35);
    font-family: inherit;
}

.error-search-link:hover {
    color: var(--link-color);
    border-color: var(--primary-color);
    background: rgba(156, 39, 176, .18);
}

/* ---------- فوتر مدرن ---------- */
#footer {
    padding: 0;
    background:
        radial-gradient(ellipse 70% 120% at 50% 130%, rgba(156, 39, 176, .12), transparent 65%),
        var(--footer-bg);
    border-top: 1px solid var(--border-color);
}

#footer .container {
    padding: 30px 20px 26px;
}

.footer-social {
    display: flex;
    justify-content: center;
    flex-wrap: wrap;
    gap: 12px;
}

.footer-social a {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 44px;
    height: 44px;
    border-radius: 50%;
    color: var(--text-color-muted);
    background: rgba(156, 39, 176, .08);
    border: 1px solid rgba(156, 39, 176, .22);
    transition: var(--transition);
}

.footer-social a:hover {
    color: #fff;
    background: linear-gradient(130deg, var(--button-download-bg), var(--button-preview-bg));
    border-color: transparent;
    transform: translateY(-3px);
    box-shadow: 0 10px 22px rgba(156, 39, 176, .4);
}

.footer-divider {
    height: 1px;
    margin: 22px 0;
    background: linear-gradient(90deg, transparent, rgba(156, 39, 176, .45), transparent);
}

.footer-copyright {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    align-items: center;
    gap: 8px;
    color: var(--text-color-muted);
    line-height: 2;
}

.footer-copyright a {
    color: var(--link-color);
    text-decoration: none;
    font-weight: 600;
}

.footer-copyright a:hover {
    text-decoration: underline;
}

.footer-dot {
    display: inline-block;
    width: 4px;
    height: 4px;
    border-radius: 50%;
    background: var(--primary-color);
    opacity: .7;
}

/* ---------- دیدگاه‌ها ---------- */
.comment-meta-side {
    margin-right: auto;
    display: flex;
    align-items: center;
    gap: 10px;
}

.comment-parent {
    display: inline-block;
    padding: 1px 9px;
    border-radius: 999px;
    background: var(--primary-color-light);
    border: 1px solid rgba(156, 39, 176, .3);
    color: var(--link-color);
    font-size: .78rem;
    text-decoration: none;
}

.comment-parent:hover {
    color: var(--text-color);
    border-color: var(--primary-color);
}

.comment-logged-in {
    padding: 12px 16px;
    border-radius: var(--radius-sm);
    background: var(--primary-color-light);
    border: 1px solid rgba(156, 39, 176, .25);
    color: var(--text-color);
    line-height: 2;
}

.comment-logged-in a {
    color: var(--link-color);
    font-weight: 600;
}

.comments-closed {
    text-align: center;
    color: var(--text-color-muted);
    padding: 24px 0;
}

#misubmit {
    border-radius: var(--radius-sm);
    transition: var(--transition);
}

#misubmit:hover {
    transform: translateY(-1px);
    box-shadow: 0 8px 20px rgba(156, 39, 176, .4);
}

/* ---------- نوار کناری ---------- */
.site-sidebar {
    border-radius: var(--radius-lg);
    border: 1px solid var(--border-color);
    border-bottom: 1px solid var(--border-color);
    box-shadow: var(--shadow-soft);
}

.compact-post-image-rank {
    background:
        radial-gradient(circle at 35% 30%, rgba(156, 39, 176, .55), transparent 60%),
        linear-gradient(145deg, #2b1f2b, #1e1a1e);
}

.rank-badge {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 34px;
    height: 34px;
    border-radius: 50%;
    color: #ffb74d;
    background: rgba(255, 152, 0, .12);
    border: 1px solid rgba(255, 152, 0, .3);
}

.compact-post-views {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    color: var(--text-color-muted);
    font-size: .78rem;
}

.compact-post-views svg {
    opacity: .75;
}

/* ---------- لایت‌باکس ---------- */
.simple-lightbox-modal.active {
    animation: lbIn .25s ease both;
}

@keyframes lbIn {
    from { opacity: 0; }
    to { opacity: 1; }
}

.simple-lightbox-modal.active img {
    animation: lbZoom .3s cubic-bezier(.2, .9, .3, 1.15) both;
}

@keyframes lbZoom {
    from { transform: scale(.92); opacity: 0; }
    to { transform: scale(1); opacity: 1; }
}

/* ---------- منوی موبایل مدرن ---------- */
.menu-overlay {
    position: fixed;
    inset: 0;
    /* z-index بالاتر از محتوا ولی پایین‌تر از خود منو تا منو تار نشود */
    z-index: 998;
    background: rgba(10, 8, 10, .55);
    /* blur فقط روی محتوای پشت overlay اعمال می‌شود، نه روی خود منو.
       برای جلوگیری از تار شدن آیتم‌های منو، blur حذف شد و به‌جای آن
       از پس‌زمینهٔ نیمه‌شفاف استفاده می‌کنیم. */
    -webkit-backdrop-filter: none;
    backdrop-filter: none;
    opacity: 0;
    pointer-events: none;
    transition: opacity .35s ease;
}

body.menu-open .menu-overlay {
    opacity: 1;
    pointer-events: auto;
}

/* منو همیشه بالاتر از overlay قرار می‌گیرد و تار نمی‌شود */
.menu-links {
    z-index: 1001;
    isolation: isolate; /* ایجاد stacking context مستقل */
}

@media (max-width: 991px) {
    .menu-links {
        padding: 92px 16px 40px !important;
        width: min(86vw, 340px) !important;
        border-right: 1px solid var(--border-color);
        background: linear-gradient(180deg, var(--card-bg) 0%, #171317 100%);
        /* اطمینان از اینکه منو خودش تار نمی‌شود */
        backdrop-filter: none !important;
        -webkit-backdrop-filter: none !important;
    }

    nav.main-nav .menu-links {
        width: min(86vw, 340px);
    }

    .menu-links a {
        border-radius: var(--radius-sm);
        margin: 3px 0;
        /* اطمینان از شفاف بودن آیتم‌ها */
        filter: none !important;
        opacity: 1 !important;
        pointer-events: auto !important;
    }

    .site-hero {
        padding: 34px 16px 30px;
    }

    .site-hero-logo {
        width: 90px;
        height: 90px;
    }
}

@media (max-width: 576px) {
    .archive-item {
        flex-direction: column;
        align-items: flex-start;
    }

    .error-actions {
        flex-direction: column;
        align-items: stretch;
    }

    .error-home-link,
    .error-search-link {
        justify-content: center;
    }

    .footer-copyright {
        font-size: .82rem;
    }
}

/* ---------- کاهش حرکت ---------- */
@media (prefers-reduced-motion: reduce) {
    *,
    *::before,
    *::after {
        animation-duration: .01ms !important;
        animation-iteration-count: 1 !important;
        transition-duration: .01ms !important;
    }

    html {
        scroll-behavior: auto;
    }

    .polaroid-card {
        opacity: 1;
        animation: none;
    }
}

/* ================================================================
 *  بخش‌های اضافه‌شده در نسخهٔ ۱٫۱ — کارت هیرو، کارت لیستی،
 *  صفحهٔ درباره، باکس درباره سایدبار، نشان هیرو، و ...
 * ================================================================ */

/* ---------- کارت هیرو (تازه‌ترین نوشته) ---------- */
.hero-card {
    display: grid;
    grid-template-columns: 1.2fr 1fr;
    gap: 0;
    background: var(--card-bg);
    border: 1px solid var(--border-color);
    border-radius: var(--radius-lg, 16px);
    overflow: hidden;
    margin: 0 0 28px;
    transition: transform .35s ease, box-shadow .35s ease, border-color .35s ease;
    animation: fadeInUp .55s ease both;
}

.hero-card:hover {
    transform: translateY(-3px);
    border-color: rgba(156, 39, 176, .55);
    box-shadow: 0 12px 32px rgba(0, 0, 0, .25);
}

.hero-cover {
    display: block;
    overflow: hidden;
    min-height: 320px;
    background: linear-gradient(135deg, #2a1a2e, #1a1520);
}

.hero-cover img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
    transition: transform .55s cubic-bezier(.4, 0, .2, 1);
}

.hero-card:hover .hero-cover img {
    transform: scale(1.05);
}

.hero-cover-fallback {
    display: block;
    width: 100%;
    height: 100%;
    background:
        radial-gradient(circle at 30% 40%, rgba(156, 39, 176, .25), transparent 50%),
        radial-gradient(circle at 70% 60%, rgba(49, 27, 146, .25), transparent 50%),
        linear-gradient(135deg, #2a1a2e, #1a1520);
}

.hero-body {
    padding: 32px 28px;
    display: flex;
    flex-direction: column;
    justify-content: center;
    gap: 12px;
}

.hero-kicker {
    display: flex;
    align-items: center;
    gap: 8px;
    flex-wrap: wrap;
}

.chip {
    display: inline-flex;
    align-items: center;
    padding: 4px 12px;
    border-radius: 999px;
    font-size: .78rem;
    font-weight: 500;
    line-height: 1.4;
    text-decoration: none;
    border: 1px solid transparent;
}

.chip-new {
    background: rgba(76, 175, 80, .15);
    color: #66bb6a;
    border-color: rgba(76, 175, 80, .3);
}

.chip-category {
    background: var(--primary-color-light);
    color: var(--link-color);
    border-color: rgba(156, 39, 176, .3);
}

.chip-category:hover {
    background: rgba(156, 39, 176, .25);
    color: var(--text-color);
}

.hero-title {
    margin: 4px 0;
    font-size: 1.6rem;
    line-height: 1.5;
    font-weight: 700;
}

.hero-title a {
    color: var(--heading-color);
    text-decoration: none;
    transition: color .25s ease;
}

.hero-title a:hover {
    color: var(--link-color);
}

.hero-excerpt {
    margin: 0;
    font-size: .96rem;
    line-height: 1.9;
    color: var(--text-color-muted);
    max-height: 6em;
    overflow: hidden;
    display: -webkit-box;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
}

.hero-meta {
    display: flex;
    flex-wrap: wrap;
    gap: 14px;
    margin-top: 6px;
    color: var(--text-color-muted);
    font-size: .86rem;
}

.hero-meta .meta-item {
    display: inline-flex;
    align-items: center;
    gap: 6px;
}

.hero-more {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    margin-top: 10px;
    align-self: flex-start;
    padding: 10px 18px;
    border-radius: var(--radius-sm, 8px);
    background: var(--gradient);
    color: #fff !important;
    font-weight: 500;
    text-decoration: none;
    transition: transform .25s ease, box-shadow .25s ease;
}

.hero-more:hover {
    transform: translateX(-4px);
    box-shadow: 0 6px 18px rgba(156, 39, 176, .35);
}

.hero-more svg {
    transition: transform .25s ease;
}

.hero-more:hover svg {
    transform: translateX(-3px);
}

/* ---------- عنوان بخش «نوشته‌های دیگر» ---------- */
.posts-heading {
    margin: 24px 0 16px;
    display: flex;
    align-items: center;
    gap: 12px;
}

.posts-heading-title {
    margin: 0;
    font-size: 1.1rem;
    font-weight: 600;
    color: var(--heading-color);
}

.posts-heading::before,
.posts-heading::after {
    content: "";
    flex: 1;
    height: 1px;
    background: linear-gradient(90deg, transparent, var(--border-color), transparent);
}

/* ---------- کارت لیستی (چیدمان list / hero-list) ---------- */
.posts-list {
    display: flex;
    flex-direction: column;
    gap: 16px;
    margin-bottom: 24px;
}

.list-card {
    display: grid;
    grid-template-columns: 220px 1fr;
    gap: 0;
    background: var(--card-bg);
    border: 1px solid var(--border-color);
    border-radius: var(--radius-lg, 14px);
    overflow: hidden;
    transition: transform .35s ease, border-color .35s ease, box-shadow .35s ease;
    animation: fadeInUp .45s ease both;
}

.list-card:hover {
    transform: translateY(-2px);
    border-color: rgba(156, 39, 176, .5);
    box-shadow: 0 8px 22px rgba(0, 0, 0, .22);
}

.list-card-cover {
    display: block;
    overflow: hidden;
    min-height: 160px;
    background: linear-gradient(135deg, #2a1a2e, #1a1520);
}

.list-card-cover img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
    transition: transform .55s ease;
}

.list-card:hover .list-card-cover img {
    transform: scale(1.05);
}

.list-card-pattern {
    display: block;
    width: 100%;
    height: 100%;
    background:
        radial-gradient(circle at 50% 50%, rgba(156, 39, 176, .2), transparent 60%),
        linear-gradient(135deg, #2a1a2e, #1a1520);
}

.list-card-body {
    padding: 18px 22px;
    display: flex;
    flex-direction: column;
    gap: 8px;
    justify-content: center;
}

.list-card-kicker {
    display: flex;
    align-items: center;
    gap: 10px;
    flex-wrap: wrap;
    font-size: .8rem;
    color: var(--text-color-muted);
}

.list-card-date {
    color: var(--text-color-muted);
}

.list-card-title {
    margin: 0;
    font-size: 1.15rem;
    font-weight: 600;
    line-height: 1.6;
}

.list-card-title a {
    color: var(--heading-color);
    text-decoration: none;
    transition: color .25s ease;
}

.list-card-title a:hover {
    color: var(--link-color);
}

.list-card-excerpt {
    margin: 0;
    font-size: .9rem;
    line-height: 1.8;
    color: var(--text-color-muted);
    max-height: 4em;
    overflow: hidden;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
}

.list-card-meta {
    display: flex;
    flex-wrap: wrap;
    gap: 12px;
    margin-top: 4px;
    color: var(--text-color-muted);
    font-size: .82rem;
}

.list-card-meta .meta-item {
    display: inline-flex;
    align-items: center;
    gap: 6px;
}

/* ---------- نشان هیرو (badge) ---------- */
.site-hero-badge {
    display: inline-block;
    padding: 4px 14px;
    border-radius: 999px;
    font-size: .8rem;
    font-weight: 500;
    color: var(--text-color);
    background: rgba(156, 39, 176, .15);
    border: 1px solid rgba(156, 39, 176, .35);
    margin-bottom: 4px;
}

/* ---------- باکس درباره در سایدبار ---------- */
.sidebar-about {
    text-align: center;
    padding: 24px 20px !important;
    background: linear-gradient(180deg, rgba(156, 39, 176, .06), transparent);
}

.about-avatar-wrap {
    display: flex;
    justify-content: center;
    margin-bottom: 12px;
}

.about-avatar {
    width: 96px;
    height: 96px;
    border-radius: 50%;
    object-fit: cover;
    border: 3px solid var(--primary-color);
    box-shadow: 0 0 22px rgba(156, 39, 176, .3);
    background: var(--background);
}

.about-name {
    margin: 6px 0 8px;
    font-size: 1.15rem;
    font-weight: 700;
    color: var(--heading-color);
}

.about-bio {
    margin: 0 0 14px;
    font-size: .88rem;
    line-height: 1.8;
    color: var(--text-color-muted);
}

.about-social {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 8px;
}

.about-social a {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 36px;
    height: 36px;
    border-radius: 50%;
    color: var(--text-color-muted);
    background: rgba(255, 255, 255, .03);
    border: 1px solid var(--border-color);
    transition: all .25s ease;
}

.about-social a:hover {
    color: #fff;
    background: var(--primary-color);
    border-color: var(--primary-color);
    transform: translateY(-2px);
}

/* ---------- صفحهٔ «درباره من» ---------- */
.about-page {
    max-width: 800px;
    margin: 0 auto;
    padding: 20px 0;
}

.about-hero {
    text-align: center;
    padding: 48px 24px 36px;
    margin-bottom: 28px;
    background:
        radial-gradient(ellipse 60% 80% at 50% 0%, rgba(156, 39, 176, .15), transparent 70%),
        radial-gradient(circle at 80% 90%, rgba(49, 27, 146, .08), transparent 50%),
        var(--card-bg);
    border: 1px solid var(--border-color);
    border-radius: var(--radius-lg, 16px);
    position: relative;
    overflow: hidden;
}

/* عناصر تزئینی شناور در پس‌زمینهٔ هیرو */
.about-hero-decor {
    position: absolute;
    border-radius: 50%;
    pointer-events: none;
    opacity: .5;
    z-index: 0;
}

.about-hero-decor-1 {
    width: 120px;
    height: 120px;
    top: -40px;
    right: -30px;
    background: radial-gradient(circle, rgba(156, 39, 176, .2), transparent 70%);
    animation: aboutFloat 8s ease-in-out infinite;
}

.about-hero-decor-2 {
    width: 80px;
    height: 80px;
    bottom: -20px;
    left: 10%;
    background: radial-gradient(circle, rgba(49, 27, 146, .15), transparent 70%);
    animation: aboutFloat 10s ease-in-out infinite reverse;
}

.about-hero-decor-3 {
    width: 60px;
    height: 60px;
    top: 30%;
    left: -20px;
    background: radial-gradient(circle, rgba(233, 30, 99, .12), transparent 70%);
    animation: aboutFloat 7s ease-in-out infinite;
    animation-delay: -3s;
}

@keyframes aboutFloat {
    0%, 100% { transform: translate(0, 0) scale(1); }
    33% { transform: translate(10px, -15px) scale(1.1); }
    66% { transform: translate(-8px, 10px) scale(.95); }
}

/* محتوای هیرو روی عناصر تزئینی */
.about-hero > *:not(.about-hero-decor) {
    position: relative;
    z-index: 1;
}

.about-hero-avatar-wrap {
    display: flex;
    justify-content: center;
    margin-bottom: 18px;
}

.about-hero-avatar {
    width: 160px;
    height: 160px;
    border-radius: 50%;
    object-fit: cover;
    background: var(--background);
    /* بدون قاب/حلقه/درخشش؛ آواتار خالص نمایش داده می‌شود */
}

.about-hero-name {
    margin: 8px 0 12px;
    font-size: 1.8rem;
    font-weight: 700;
    color: var(--heading-color);
}

.about-hero-bio {
    margin: 0 auto 22px;
    max-width: 560px;
    font-size: 1rem;
    line-height: 2;
    color: var(--text-color-muted);
}

.about-hero-social {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 10px;
}

.about-social-link {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 8px 14px;
    border-radius: 999px;
    color: var(--text-color);
    background: rgba(255, 255, 255, .04);
    border: 1px solid var(--border-color);
    text-decoration: none;
    font-size: .86rem;
    transition: all .25s ease;
}

.about-social-link:hover {
    color: #fff;
    background: var(--primary-color);
    border-color: var(--primary-color);
    transform: translateY(-2px);
}

.about-social-link svg {
    flex-shrink: 0;
}

.about-social-label {
    line-height: 1;
}

.about-content {
    margin-bottom: 28px;
    padding: 28px 24px;
    background: var(--card-bg);
    border: 1px solid var(--border-color);
    border-radius: var(--radius-lg, 14px);
    line-height: 1.9;
}

/* ---------- آمار سریع ---------- */
.about-stats {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(140px, 1fr));
    gap: 16px;
    margin-bottom: 28px;
}

.about-stat-item {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 6px;
    padding: 24px 16px;
    background: var(--card-bg);
    border: 1px solid var(--border-color);
    border-radius: var(--radius-lg, 14px);
    text-align: center;
    transition: all .25s ease;
}

.about-stat-item:hover {
    transform: translateY(-3px);
    border-color: rgba(156, 39, 176, .4);
    box-shadow: 0 8px 22px rgba(0, 0, 0, .2);
}

.about-stat-number {
    font-size: 2.2rem;
    font-weight: 800;
    line-height: 1;
    background: var(--gradient);
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
    color: var(--primary-color);
}

.about-stat-label {
    font-size: .85rem;
    color: var(--text-color-muted);
    line-height: 1.4;
}

/* ---------- بخش‌های «درباره من» (علاقه‌مندی‌ها، تخصص‌ها، تجربه‌ها) ---------- */
.about-tags-row {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
    gap: 20px;
    margin-bottom: 28px;
}

.about-tag-block {
    padding: 22px 20px;
    background: var(--card-bg);
    border: 1px solid var(--border-color);
    border-radius: var(--radius-lg, 14px);
}

.about-tag-block-likes {
    border-color: rgba(233, 30, 99, .25);
}

.about-tag-block-specialties {
    border-color: rgba(156, 39, 176, .3);
}

.about-tag-title {
    display: flex;
    align-items: center;
    gap: 10px;
    margin: 0 0 16px;
    font-size: 1.05rem;
    font-weight: 700;
    color: var(--heading-color);
}

.about-tag-icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 32px;
    height: 32px;
    border-radius: 50%;
    background: var(--primary-color-light);
    color: var(--link-color);
    flex-shrink: 0;
}

.about-tag-block-likes .about-tag-icon {
    background: rgba(233, 30, 99, .15);
    color: #ec407a;
}

.about-tag-list {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}

.about-tag {
    display: inline-block;
    padding: 6px 14px;
    border-radius: 999px;
    font-size: .85rem;
    background: rgba(255, 255, 255, .04);
    border: 1px solid var(--border-color);
    color: var(--text-color);
    transition: all .25s ease;
}

.about-tag-likes {
    background: rgba(233, 30, 99, .08);
    border-color: rgba(233, 30, 99, .25);
    color: #f48fb1;
}

.about-tag-specialties {
    background: rgba(156, 39, 176, .08);
    border-color: rgba(156, 39, 176, .3);
    color: var(--link-color);
}

.about-experience {
    margin-bottom: 28px;
    padding: 24px;
    background: var(--card-bg);
    border: 1px solid var(--border-color);
    border-radius: var(--radius-lg, 14px);
}

.about-section-title {
    display: flex;
    align-items: center;
    gap: 10px;
    margin: 0 0 20px;
    font-size: 1.05rem;
    font-weight: 700;
    color: var(--heading-color);
}

/* لیست تجربه‌ها — طراحی تایم‌لاین با عدد در دایره */
.about-experience-list {
    list-style: none;
    margin: 0;
    padding: 0;
    display: flex;
    flex-direction: column;
    gap: 12px;
}

.about-exp-item {
    position: relative;
    display: flex;
    align-items: center;
    gap: 16px;
    padding: 14px 18px;
    background: rgba(255, 255, 255, .03);
    border: 1px solid var(--border-color);
    border-right: 3px solid var(--primary-color);
    border-radius: var(--radius-sm, 10px);
    transition: all .25s ease;
}

.about-exp-item:hover {
    background: rgba(156, 39, 176, .05);
    border-color: rgba(156, 39, 176, .4);
    transform: translateX(-3px);
}

/* نشان دایره‌ای برای عدد یا آیکون */
.about-exp-badge {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 48px;
    height: 48px;
    min-width: 48px;
    border-radius: 50%;
    background: linear-gradient(135deg, var(--primary-color), #311b92);
    color: #fff;
    box-shadow: 0 4px 12px rgba(156, 39, 176, .35);
    flex-shrink: 0;
    transition: transform .25s ease, box-shadow .25s ease;
}

.about-exp-item:hover .about-exp-badge {
    transform: scale(1.08);
    box-shadow: 0 6px 18px rgba(156, 39, 176, .5);
}

.about-exp-number {
    font-size: 1.15rem;
    font-weight: 800;
    line-height: 1;
    font-family: "Vazirmatn", sans-serif;
}

.about-exp-no-number .about-exp-badge {
    background: linear-gradient(135deg, #4caf50, #2e7d32);
    box-shadow: 0 4px 12px rgba(76, 175, 80, .3);
}

.about-exp-no-number .about-exp-badge svg {
    width: 22px;
    height: 22px;
}

.about-exp-text {
    font-size: .96rem;
    line-height: 1.7;
    color: var(--text-color);
    flex: 1;
    min-width: 0;
}

.about-contact {
    margin-bottom: 28px;
    padding: 20px 24px;
    background: linear-gradient(135deg, rgba(156, 39, 176, .08), rgba(49, 27, 146, .05));
    border: 1px solid rgba(156, 39, 176, .25);
    border-radius: var(--radius-lg, 14px);
    text-align: center;
}

.about-contact p {
    margin: 0;
    font-size: 1rem;
    line-height: 1.9;
    color: var(--text-color);
}

/* ---------- برند متنی (در صورت نبود لوگو) ---------- */
.nav-brand-text {
    display: inline-flex;
    align-items: center;
    text-decoration: none !important;
}

.nav-brand-text .nav-brand-text {
    font-size: 1rem;
    font-weight: 700;
    color: var(--heading-color);
    line-height: 1;
}

/* ---------- استیت خالی ---------- */
.empty-state {
    text-align: center;
    padding: 60px 20px;
    color: var(--text-color-muted);
}

.empty-state h2 {
    margin: 0;
    font-size: 1.2rem;
    color: var(--heading-color);
}

/* ---------- رسپانسیو کارت هیرو و لیست ---------- */
@media (max-width: 991px) {
    .hero-card {
        grid-template-columns: 1fr;
    }

    .hero-cover {
        min-height: 220px;
    }

    .hero-body {
        padding: 22px 20px;
    }

    .hero-title {
        font-size: 1.35rem;
    }

    .list-card {
        grid-template-columns: 1fr;
    }

    .list-card-cover {
        min-height: 200px;
    }

    .list-card-body {
        padding: 16px 18px;
    }
}

@media (max-width: 576px) {
    .hero-card {
        margin-bottom: 18px;
    }

    .hero-cover {
        min-height: 180px;
    }

    .hero-body {
        padding: 18px 16px;
        gap: 10px;
    }

    .hero-title {
        font-size: 1.15rem;
    }

    .hero-excerpt {
        font-size: .88rem;
        -webkit-line-clamp: 2;
    }

    .hero-meta {
        font-size: .8rem;
        gap: 10px;
    }

    .list-card-body {
        padding: 14px 16px;
    }

    .list-card-title {
        font-size: 1rem;
    }

    .about-hero {
        padding: 28px 16px 24px;
    }

    .about-hero-avatar {
        width: 130px;
        height: 130px;
    }

    .about-hero-name {
        font-size: 1.4rem;
    }

    .about-social-link {
        padding: 6px 12px;
        font-size: .8rem;
    }

    .about-social-link .about-social-label {
        display: none;
    }

    .about-tags-row {
        grid-template-columns: 1fr;
        gap: 14px;
    }

    .about-tag-block {
        padding: 16px 14px;
    }

    .about-stats {
        grid-template-columns: 1fr;
        gap: 10px;
    }

    .about-stat-item {
        flex-direction: row;
        justify-content: flex-start;
        gap: 16px;
        padding: 16px 18px;
        text-align: right;
    }

    .about-stat-number {
        font-size: 1.6rem;
    }

    .about-exp-item {
        padding: 12px 14px;
        gap: 12px;
    }

    .about-exp-badge {
        width: 40px;
        height: 40px;
        min-width: 40px;
    }

    .about-exp-number {
        font-size: 1rem;
    }

    .about-exp-text {
        font-size: .9rem;
    }
}

/* ---------- صفحهٔ نخست: عرض محتوا ---------- */
.page-home .container {
    align-items: stretch;
}

/* ---------- اصلاح: فضای بیشتر برای polaroid-grid ---------- */
.polaroid-grid {
    width: 100%;
}

/* ================================================================
 *  سایدبار کلاسیک/مینیمال (نسخهٔ ۱٫۴)
 * ================================================================ */

/* بازنویسی استایل سایدبار برای حالت کلاسیک */
.site-sidebar {
    background: transparent;
    border-radius: 0;
    padding: 0;
    border: 0;
    color: var(--text-color);
    margin-bottom: 30px;
    width: 100%;
    max-width: 100%;
    font-family: inherit;
}

.site-sidebar .sidebar-section {
    margin-bottom: 28px;
    padding: 0;
    background: transparent;
    border-radius: 0;
    border: 0;
}

.site-sidebar .sidebar-section:last-child {
    margin-bottom: 0;
}

/* باکس درباره در سایدبار */
.site-sidebar .sidebar-about {
    text-align: center;
    padding: 24px 16px;
    background: var(--card-bg);
    border: 1px solid var(--border-color);
    border-radius: var(--radius-lg, 12px);
}

.site-sidebar .about-avatar {
    width: 84px;
    height: 84px;
    border-radius: 50%;
    object-fit: cover;
    background: var(--background);
}

.site-sidebar .about-name {
    margin: 10px 0 6px;
    font-size: 1.05rem;
    font-weight: 700;
    color: var(--heading-color);
}

.site-sidebar .about-bio {
    margin: 0 0 14px;
    font-size: .84rem;
    line-height: 1.8;
    color: var(--text-color-muted);
}

.site-sidebar .about-social {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 6px;
}

.site-sidebar .about-social a {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 32px;
    height: 32px;
    border-radius: 50%;
    color: var(--text-color-muted);
    background: rgba(255, 255, 255, .03);
    border: 1px solid var(--border-color);
    transition: all .25s ease;
}

.site-sidebar .about-social a:hover {
    color: #fff;
    background: var(--primary-color);
    border-color: var(--primary-color);
    transform: translateY(-2px);
}

/* عنوان بخش‌های کلاسیک */
.sidebar-title {
    margin: 0 0 14px;
    padding-bottom: 10px;
    font-size: .9rem;
    font-weight: 700;
    color: var(--heading-color);
    border-bottom: 2px solid var(--primary-color);
    letter-spacing: .02em;
}

/* لیست کلاسیک مینیمال */
.sidebar-list {
    list-style: none;
    margin: 0;
    padding: 0;
    display: flex;
    flex-direction: column;
}

.sidebar-list-item {
    margin: 0;
    padding: 0;
    border-bottom: 1px solid var(--border-color);
    transition: background-color .2s ease;
}

.sidebar-list-item:last-child {
    border-bottom: 0;
}

.sidebar-list-link {
    display: flex;
    flex-direction: column;
    gap: 3px;
    padding: 10px 6px;
    text-decoration: none !important;
    color: inherit;
    transition: padding-right .2s ease;
}

.sidebar-list-link:hover {
    padding-right: 12px;
}

.sidebar-list-title {
    font-size: .88rem;
    font-weight: 500;
    color: var(--text-color);
    line-height: 1.6;
    transition: color .2s ease;
}

.sidebar-list-link:hover .sidebar-list-title {
    color: var(--link-color);
}

.sidebar-list-meta {
    font-size: .74rem;
    color: var(--text-color-light);
    line-height: 1;
}

/* آیتم پربازدید با تصویر کوچک */
.sidebar-list-item-popular {
    /* override */
}

.sidebar-popular-link {
    flex-direction: row !important;
    align-items: center;
    gap: 12px !important;
    padding: 10px 6px !important;
}

.sidebar-popular-thumb {
    display: block;
    width: 52px;
    height: 52px;
    border-radius: var(--radius-sm, 6px);
    background-size: cover;
    background-position: center;
    flex-shrink: 0;
    background-color: var(--background);
}

.sidebar-popular-body {
    display: flex;
    flex-direction: column;
    gap: 4px;
    flex: 1;
    min-width: 0;
}

.sidebar-views {
    display: inline-flex;
    align-items: center;
    gap: 4px;
}

.sidebar-views svg {
    opacity: .7;
}

/* لیست دیدگاه‌ها */
.sidebar-comments-list {
    /* همان sidebar-list */
}

.sidebar-comment-link {
    display: flex !important;
    flex-direction: row !important;
    align-items: flex-start;
    gap: 10px !important;
    padding: 10px 6px !important;
}

.sidebar-comment-avatar {
    flex-shrink: 0;
    width: 32px;
    height: 32px;
}

.sidebar-comment-avatar img {
    width: 32px;
    height: 32px;
    border-radius: 50%;
    object-fit: cover;
    display: block;
}

.sidebar-comment-body {
    display: flex;
    flex-direction: column;
    gap: 3px;
    flex: 1;
    min-width: 0;
}

.sidebar-comment-author {
    font-size: .84rem;
    font-weight: 600;
    color: var(--heading-color);
    line-height: 1.4;
}

.sidebar-comment-excerpt {
    font-size: .78rem;
    color: var(--text-color-muted);
    line-height: 1.6;
    overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-line-clamp: 1;
    -webkit-box-orient: vertical;
}

/* برچسب‌های کلاسیک */
.sidebar-tags {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
}

.sidebar-tag {
    display: inline-block;
    padding: 4px 10px;
    font-size: .76rem;
    color: var(--text-color-muted);
    background: transparent;
    border: 1px solid var(--border-color);
    border-radius: 999px;
    text-decoration: none !important;
    transition: all .2s ease;
}

.sidebar-tag:hover {
    color: #fff;
    background: var(--primary-color);
    border-color: var(--primary-color);
}

/* ================================================================
 *  اصلاح فونت دکمه ارسال دیدگاه
 * ================================================================ */
.respond .submit,
#misubmit,
.comment-form .submit,
button[type="submit"].submit {
    font-family: "Vazirmatn", sans-serif !important;
}

/* ================================================================
 *  نسخهٔ ۱٫۵ — یکدستی کارت‌ها، بازطراحی سایدبار و یکدستی کامنت‌ها
 * ================================================================ */

/* ---------- نشانهٔ دسته روی کاور پولاروید ---------- */
.polaroid-image {
    position: relative;
}

.polaroid-cat-badge {
    position: absolute;
    top: 10px;
    inset-inline-start: 10px; /* RTL-friendly */
    z-index: 2;
    padding: 4px 12px;
    border-radius: 999px;
    font-size: .72rem;
    font-weight: 600;
    line-height: 1.4;
    color: #fff;
    background: linear-gradient(135deg, rgba(156, 39, 176, .92), rgba(49, 27, 146, .92));
    border: 1px solid rgba(255, 255, 255, .15);
    backdrop-filter: blur(6px) saturate(1.2);
    -webkit-backdrop-filter: blur(6px) saturate(1.2);
    box-shadow: 0 2px 8px rgba(0, 0, 0, .25);
    pointer-events: none;
    max-width: calc(100% - 20px);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

/* ---------- متای یکدست در پولاروید ---------- */
.polaroid-meta {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
    align-items: center;
    margin-top: 4px;
}

.polaroid-meta .meta-item {
    padding: 4px 10px;
    font-size: .76rem;
    line-height: 1.6;
}

.polaroid-meta .meta-item svg {
    width: 13px;
    height: 13px;
}

.polaroid-meta .meta-views {
    color: var(--text-color);
    background: rgba(233, 30, 99, .08);
    border-color: rgba(233, 30, 99, .25);
}

/* ---------- نشانهٔ نویسنده در لیست دیدگاه‌ها ---------- */
.comment-avatar {
    position: relative;
}

.comment-author-badge {
    position: absolute;
    bottom: -2px;
    inset-inline-end: -2px;
    width: 20px;
    height: 20px;
    border-radius: 50%;
    background: linear-gradient(135deg, var(--primary-color), #311b92);
    color: #fff;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    box-shadow: 0 2px 6px rgba(156, 39, 176, .45);
    border: 2px solid var(--card-bg);
}

.comment-author-badge svg {
    width: 12px;
    height: 12px;
}

/* نشان «نویسنده» کنار نام در دیدگاه */
.comment-owner-label {
    display: inline-flex;
    align-items: center;
    margin-inline-start: 8px;
    padding: 2px 8px;
    border-radius: 999px;
    font-size: .68rem;
    font-weight: 600;
    color: #fff;
    background: linear-gradient(135deg, var(--primary-color), #311b92);
    line-height: 1.4;
    vertical-align: middle;
}

.comment-author-owner {
    color: var(--link-color) !important;
}

.comment-author-owner a {
    color: var(--link-color) !important;
}

/* ================================================================
 *  بازطراحی سایدبار v2 — مدرن، یکدست، با رتبه‌بندی و نشان‌ها
 * ================================================================ */

.sidebar-v2 {
    display: flex;
    flex-direction: column;
    gap: 18px;
}

.sidebar-v2-card {
    background: var(--card-bg);
    border: 1px solid var(--border-color);
    border-radius: var(--radius-lg, 14px);
    padding: 18px 16px 14px;
    box-shadow: 0 4px 16px rgba(0, 0, 0, .12);
    transition: border-color .25s ease, box-shadow .25s ease;
}

.sidebar-v2-card:hover {
    border-color: rgba(156, 39, 176, .35);
    box-shadow: 0 6px 20px rgba(0, 0, 0, .2);
}

/* عنوان بخش با آیکون */
.sidebar-v2-title {
    display: flex;
    align-items: center;
    gap: 10px;
    margin: 0 0 14px;
    padding-bottom: 10px;
    font-size: .92rem;
    font-weight: 700;
    color: var(--heading-color);
    border-bottom: 2px solid rgba(156, 39, 176, .35);
    letter-spacing: .02em;
}

.sidebar-v2-title-icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 28px;
    height: 28px;
    border-radius: 8px;
    background: rgba(156, 39, 176, .14);
    color: var(--link-color);
    flex-shrink: 0;
}

.sidebar-v2-title-icon svg {
    width: 15px;
    height: 15px;
}

.sidebar-v2-title-text {
    flex: 1;
}

/* ---------- باکس دربارهٔ بازطراحی‌شده ---------- */
.sidebar-v2-about {
    position: relative;
    text-align: center;
    padding: 28px 18px 22px !important;
    background:
        radial-gradient(ellipse 80% 60% at 50% 0%, rgba(156, 39, 176, .14), transparent 70%),
        var(--card-bg) !important;
    border: 1px solid var(--border-color);
    border-radius: var(--radius-lg, 14px);
    overflow: hidden;
}

.sidebar-v2-about-decor {
    position: absolute;
    top: -30px;
    inset-inline-start: -20px;
    width: 110px;
    height: 110px;
    border-radius: 50%;
    background: radial-gradient(circle, rgba(156, 39, 176, .25), transparent 70%);
    pointer-events: none;
    z-index: 0;
}

.sidebar-v2-about > *:not(.sidebar-v2-about-decor) {
    position: relative;
    z-index: 1;
}

.sidebar-v2-about .about-avatar {
    width: 88px;
    height: 88px;
    border-radius: 50%;
    object-fit: cover;
    border: 3px solid var(--primary-color);
    box-shadow: 0 0 0 6px rgba(156, 39, 176, .12), 0 8px 22px rgba(0, 0, 0, .25);
    background: var(--background);
}

.sidebar-v2-about .about-name {
    margin: 12px 0 6px;
    font-size: 1.1rem;
    font-weight: 700;
    color: var(--heading-color);
}

.sidebar-v2-about .about-bio {
    margin: 0 0 14px;
    font-size: .84rem;
    line-height: 1.85;
    color: var(--text-color-muted);
}

.sidebar-v2-about .about-social {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 6px;
}

.sidebar-v2-about .about-social a {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 34px;
    height: 34px;
    border-radius: 50%;
    color: var(--text-color-muted);
    background: rgba(255, 255, 255, .04);
    border: 1px solid var(--border-color);
    transition: all .25s ease;
}

.sidebar-v2-about .about-social a:hover {
    color: #fff;
    background: var(--primary-color);
    border-color: var(--primary-color);
    transform: translateY(-3px);
    box-shadow: 0 6px 14px rgba(156, 39, 176, .35);
}

/* ---------- لیست با شماره رتبه ---------- */
.sidebar-v2-list {
    list-style: none;
    margin: 0;
    padding: 0;
    display: flex;
    flex-direction: column;
    gap: 4px;
}

.sidebar-v2-list-item {
    position: relative;
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 8px 4px 8px 4px;
    border-bottom: 1px solid rgba(62, 42, 62, .4);
    transition: background-color .2s ease, padding .2s ease;
}

.sidebar-v2-list-item:last-child {
    border-bottom: 0;
}

.sidebar-v2-list-item:hover {
    background: rgba(156, 39, 176, .05);
}

/* شماره رتبه */
.sidebar-v2-rank {
    flex-shrink: 0;
    width: 24px;
    height: 24px;
    border-radius: 6px;
    background: rgba(156, 39, 176, .12);
    color: var(--link-color);
    font-size: .76rem;
    font-weight: 700;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    line-height: 1;
}

.sidebar-v2-rank-hot {
    background: linear-gradient(135deg, rgba(233, 30, 99, .8), rgba(156, 39, 176, .8));
    color: #fff;
    box-shadow: 0 2px 6px rgba(233, 30, 99, .35);
}

/* لینک داخل لیست */
.sidebar-v2-list-link {
    display: flex;
    flex-direction: column;
    gap: 4px;
    flex: 1;
    min-width: 0;
    text-decoration: none !important;
    color: inherit;
    transition: padding .2s ease;
}

.sidebar-v2-list-item:hover .sidebar-v2-list-link {
    padding-inline-start: 4px;
}

.sidebar-v2-list-link .sidebar-list-title {
    font-size: .86rem;
    font-weight: 500;
    color: var(--text-color);
    line-height: 1.6;
    transition: color .2s ease;
    overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
}

.sidebar-v2-list-item:hover .sidebar-list-title {
    color: var(--link-color);
}

.sidebar-v2-list-meta {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    font-size: .72rem;
    color: var(--text-color-light);
    line-height: 1.4;
}

.sidebar-v2-list-meta svg {
    opacity: .7;
}

/* ---------- آیتم پربازدید با تصویر ---------- */
.sidebar-v2-popular {
    padding: 10px 4px;
}

.sidebar-v2-popular-link {
    display: flex !important;
    flex-direction: row !important;
    align-items: center;
    gap: 12px !important;
    padding: 0 !important;
}

.sidebar-v2-popular-thumb {
    width: 56px;
    height: 56px;
    border-radius: var(--radius-sm, 8px);
    background-size: cover;
    background-position: center;
    flex-shrink: 0;
    background-color: var(--background);
    border: 1px solid var(--border-color);
    transition: transform .25s ease;
}

.sidebar-v2-list-item:hover .sidebar-v2-popular-thumb {
    transform: scale(1.05);
}

.sidebar-v2-popular-body {
    display: flex;
    flex-direction: column;
    gap: 4px;
    flex: 1;
    min-width: 0;
}

.sidebar-v2-popular .sidebar-views {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    color: var(--text-color);
    font-size: .72rem;
}

.sidebar-v2-popular .sidebar-views svg {
    color: var(--link-color);
    opacity: 1;
}

/* ---------- لیست دیدگاه‌ها در سایدبار ---------- */
.sidebar-v2-comment-link {
    display: flex !important;
    flex-direction: row !important;
    align-items: flex-start;
    gap: 10px !important;
    padding: 0 !important;
}

.sidebar-v2-comment-avatar {
    position: relative;
    flex-shrink: 0;
    width: 38px;
    height: 38px;
}

.sidebar-v2-comment-avatar img {
    width: 38px;
    height: 38px;
    border-radius: 50%;
    object-fit: cover;
    display: block;
    border: 2px solid var(--border-color);
    transition: border-color .25s ease;
}

.sidebar-v2-list-item:hover .sidebar-v2-comment-avatar img {
    border-color: var(--primary-color);
}

.sidebar-v2-comment-badge {
    position: absolute;
    bottom: -3px;
    inset-inline-end: -3px;
    width: 16px;
    height: 16px;
    border-radius: 50%;
    background: linear-gradient(135deg, var(--primary-color), #311b92);
    color: #fff;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    box-shadow: 0 2px 6px rgba(156, 39, 176, .45);
    border: 2px solid var(--card-bg);
}

.sidebar-v2-comment-body {
    display: flex;
    flex-direction: column;
    gap: 3px;
    flex: 1;
    min-width: 0;
}

.sidebar-v2-comment-author {
    font-size: .82rem;
    font-weight: 600;
    color: var(--heading-color);
    line-height: 1.4;
}

.sidebar-v2-comment-author-owner {
    color: var(--link-color) !important;
}

.sidebar-v2-comment-excerpt,
.sidebar-comment-excerpt {
    font-size: .76rem;
    color: var(--text-color-muted);
    line-height: 1.6;
    overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-line-clamp: 1;
    -webkit-box-orient: vertical;
}

/* ---------- برچسب‌های کلاود با شمارش ---------- */
.sidebar-v2-tags {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
}

.sidebar-v2-tag {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 5px 10px 5px 8px;
    font-size: .76rem;
    color: var(--text-color-muted);
    background: rgba(255, 255, 255, .03);
    border: 1px solid var(--border-color);
    border-radius: 999px;
    text-decoration: none !important;
    transition: all .2s ease;
}

.sidebar-v2-tag:hover {
    color: #fff;
    background: var(--primary-color);
    border-color: var(--primary-color);
    transform: translateY(-1px);
}

.sidebar-v2-tag-text {
    line-height: 1.4;
}

.sidebar-v2-tag-count {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 18px;
    height: 18px;
    padding: 0 5px;
    border-radius: 999px;
    font-size: .68rem;
    font-weight: 600;
    color: var(--link-color);
    background: rgba(156, 39, 176, .18);
    line-height: 1;
}

.sidebar-v2-tag:hover .sidebar-v2-tag-count {
    color: #fff;
    background: rgba(255, 255, 255, .2);
}

/* ---------- لینک‌های مفید ---------- */
.sidebar-v2-friend-list {
    gap: 2px;
}

.sidebar-v2-friend-link {
    flex-direction: row !important;
    align-items: center;
    gap: 8px !important;
    padding: 6px 4px !important;
}

.sidebar-v2-friend-dot {
    width: 6px;
    height: 6px;
    border-radius: 50%;
    background: var(--primary-color);
    flex-shrink: 0;
    box-shadow: 0 0 0 3px rgba(156, 39, 176, .15);
    transition: transform .2s ease;
}

.sidebar-v2-list-item:hover .sidebar-v2-friend-dot {
    transform: scale(1.4);
}

.sidebar-v2-friend-link .sidebar-list-title {
    -webkit-line-clamp: 1;
    line-clamp: 1;
}

/* ---------- رسپانسیو سایدبار v2 ---------- */
@media (max-width: 991px) {
    .sidebar-v2 {
        gap: 16px;
    }

    .sidebar-v2-card {
        padding: 16px 14px 12px;
    }

    .sidebar-v2-about {
        padding: 24px 16px 18px !important;
    }
}

@media (max-width: 576px) {
    .sidebar-v2-card {
        padding: 14px 12px 10px;
    }

    .sidebar-v2-about .about-avatar {
        width: 76px;
        height: 76px;
    }

    .sidebar-v2-about .about-name {
        font-size: 1rem;
    }

    .sidebar-v2-popular-thumb {
        width: 48px;
        height: 48px;
    }

    .sidebar-v2-comment-avatar {
        width: 34px;
        height: 34px;
    }

    .sidebar-v2-comment-avatar img {
        width: 34px;
        height: 34px;
    }
}

/* ---------- اصلاح همپوشانی: footer-social تحت sidebar-v2 ---------- */
.site-sidebar.sidebar-v2 + * {
    /* بدون اثر؛ فقط برای حفظ فاصله */
}

/* ---------- انیمیشن یکدست ورود کارت‌ها ---------- */
@keyframes shabnamFadeUp {
    from {
        opacity: 0;
        transform: translateY(8px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

.sidebar-v2-card,
.sidebar-v2-about {
    animation: shabnamFadeUp .45s ease both;
}

.sidebar-v2-card:nth-child(2) { animation-delay: .05s; }
.sidebar-v2-card:nth-child(3) { animation-delay: .1s; }
.sidebar-v2-card:nth-child(4) { animation-delay: .15s; }
.sidebar-v2-card:nth-child(5) { animation-delay: .2s; }
.sidebar-v2-card:nth-child(6) { animation-delay: .25s; }

/* ---------- انیمیشن یکدست ورود polaroid-card ---------- */
.polaroid-card {
    animation: shabnamFadeUp .5s ease both;
}

.polaroid-card:nth-child(2) { animation-delay: .04s; }
.polaroid-card:nth-child(3) { animation-delay: .08s; }
.polaroid-card:nth-child(4) { animation-delay: .12s; }
.polaroid-card:nth-child(5) { animation-delay: .16s; }
.polaroid-card:nth-child(6) { animation-delay: .2s; }
.polaroid-card:nth-child(7) { animation-delay: .24s; }
.polaroid-card:nth-child(8) { animation-delay: .28s; }
.polaroid-card:nth-child(9) { animation-delay: .32s; }

/* ---------- انیمیشن ورود list-card ---------- */
.list-card {
    animation: shabnamFadeUp .45s ease both;
}

.list-card:nth-child(2) { animation-delay: .05s; }
.list-card:nth-child(3) { animation-delay: .1s; }
.list-card:nth-child(4) { animation-delay: .15s; }
.list-card:nth-child(5) { animation-delay: .2s; }
.list-card:nth-child(6) { animation-delay: .25s; }
.list-card:nth-child(7) { animation-delay: .3s; }
.list-card:nth-child(8) { animation-delay: .35s; }

/* ---------- بهبود meta-item در حالت کوچک (پولاروید) ---------- */
.polaroid-footer .meta-item {
    padding: 4px 10px;
    font-size: .76rem;
    line-height: 1.6;
    gap: 4px;
}

.polaroid-footer .meta-item svg {
    width: 13px;
    height: 13px;
}

/* ---------- هماهنگ‌سازی hero-meta با list-meta ---------- */
.hero-meta .meta-item {
    padding: 5px 12px;
    font-size: .82rem;
}

/* ---------- قاب آواتار نویسنده در باکس پایین پست ---------- */
.post-author-box {
    margin-top: 28px;
    padding: 22px 22px 22px 18px;
    background:
        radial-gradient(ellipse 70% 100% at 0% 50%, rgba(156, 39, 176, .08), transparent 70%),
        var(--card-bg);
    border: 1px solid var(--border-color);
    border-inline-start: 4px solid var(--primary-color);
    border-radius: var(--radius-lg, 14px);
    display: flex;
    align-items: center;
    gap: 16px;
    flex-wrap: wrap;
}

.post-author-box .author-avatar {
    flex-shrink: 0;
    position: relative;
}

.post-author-box .author-avatar img {
    width: 80px;
    height: 80px;
    border-radius: 50%;
    object-fit: cover;
    border: 3px solid var(--primary-color);
    box-shadow: 0 0 0 5px rgba(156, 39, 176, .12), 0 8px 22px rgba(0, 0, 0, .25);
    background: var(--background);
}

.post-author-box .author-info {
    flex: 1;
    min-width: 240px;
}

.post-author-box .author-label {
    display: inline-block;
    margin-bottom: 4px;
    padding: 2px 10px;
    border-radius: 999px;
    font-size: .72rem;
    color: var(--link-color);
    background: rgba(156, 39, 176, .12);
    border: 1px solid rgba(156, 39, 176, .25);
    line-height: 1.6;
}

.post-author-box .author-info h3 {
    margin: 4px 0 6px;
    font-size: 1.05rem;
    font-weight: 700;
    color: var(--heading-color);
}

.post-author-box .author-info p {
    margin: 0;
    font-size: .88rem;
    line-height: 1.85;
    color: var(--text-color-muted);
}

@media (max-width: 576px) {
    .post-author-box {
        padding: 16px 14px;
        gap: 12px;
    }
    .post-author-box .author-avatar img {
        width: 64px;
        height: 64px;
    }
    .post-author-box .author-info {
        min-width: 100%;
    }
}

/* ================================================================
 *  نسخهٔ ۱٫۶ — آیکون Lucide، لینک ادامه مطلب، کاور پست‌های اخیر،
 *  یکدستی باکس نویسنده با bio و سوشال، حذف بولت اختصاصی،
 *  بازطراحی خلاقانه دو باکس علاقه‌مندی‌ها و تخصص‌ها.
 * ================================================================ */

/* ---------- حذف بولت اختصاصی ul li::before در سایدبار، درباره و باکس نویسنده ---------- */
.site-sidebar ul li::before,
.site-sidebar .sidebar-v2-list li::before,
.site-sidebar .sidebar-list li::before,
.about-page ul li::before,
.about-page .about-experience-list li::before,
.about-page .about-tag-list li::before,
.post-author-box ul li::before,
.sidebar-tags li::before,
.sidebar-v2-tags li::before,
.sidebar-v2-friend-list li::before,
.comment-list li::before,
.comment-children li::before {
    content: none !important;
    display: none !important;
}

/* حذف padding-right که برای بولت‌های پیش‌فرض در نظر گرفته شده */
.site-sidebar .sidebar-list,
.site-sidebar .sidebar-v2-list,
.about-page .about-experience-list,
.about-page .about-tag-list,
.post-author-box ul {
    padding-right: 0 !important;
    margin-right: 0 !important;
}

/* ---------- لینک «ادامه مطلب» در کارت‌ها ---------- */
.card-continue-link {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    margin-top: 12px;
    align-self: flex-start;
    padding: 7px 16px;
    border-radius: 999px;
    background: linear-gradient(135deg, rgba(156, 39, 176, .15), rgba(49, 27, 146, .15));
    color: var(--link-color) !important;
    font-size: .82rem;
    font-weight: 600;
    text-decoration: none !important;
    border: 1px solid rgba(156, 39, 176, .35);
    transition: all .25s ease;
    line-height: 1.4;
}

.card-continue-link span {
    line-height: 1;
}

.card-continue-link svg {
    width: 15px;
    height: 15px;
    transition: transform .25s ease;
}

.card-continue-link:hover {
    background: linear-gradient(135deg, var(--primary-color), #311b92);
    color: #fff !important;
    border-color: transparent;
    box-shadow: 0 6px 16px rgba(156, 39, 176, .35);
}

.card-continue-link:hover svg {
    transform: translateX(-3px);
}

/* کارت پولاروید — لینک ادامه مطلب در عرض کامل */
.card-continue-link-polaroid {
    width: 100%;
    justify-content: center;
    padding: 9px 14px;
    margin-top: 14px;
}

/* ---------- کاور برای ویجت آخرین نوشته‌های سایدبار ---------- */
.sidebar-v2-recent-item {
    padding: 8px 4px 8px 4px !important;
}

.sidebar-v2-recent-link {
    flex-direction: row !important;
    align-items: center;
    gap: 10px !important;
    padding: 0 !important;
}

.sidebar-v2-recent-thumb {
    flex-shrink: 0;
    width: 52px;
    height: 52px;
    border-radius: var(--radius-sm, 8px);
    background-size: cover;
    background-position: center;
    background-color: var(--background);
    border: 1px solid var(--border-color);
    transition: transform .25s ease, border-color .25s ease;
}

.sidebar-v2-list-item:hover .sidebar-v2-recent-thumb {
    transform: scale(1.06);
    border-color: var(--primary-color);
}

.sidebar-v2-recent-body {
    display: flex;
    flex-direction: column;
    gap: 4px;
    flex: 1;
    min-width: 0;
}

.sidebar-v2-recent-link .sidebar-list-title {
    -webkit-line-clamp: 2;
    line-clamp: 2;
    font-size: .86rem;
}

/* ---------- ویجت‌های سایدبار با استایل هماهنگ با ویجت نویسنده ---------- */
/* همهٔ sidebar-v2-card می‌توانند پس‌زمینهٔ گرادیانی ظریف هم‌رنگ باکس نویسنده داشته باشند */
.sidebar-v2-card {
    position: relative;
    background:
        radial-gradient(ellipse 80% 50% at 50% 0%, rgba(156, 39, 176, .06), transparent 70%),
        var(--card-bg);
    border: 1px solid var(--border-color);
    border-radius: var(--radius-lg, 14px);
    padding: 20px 18px 16px;
    box-shadow: 0 4px 16px rgba(0, 0, 0, .12);
    transition: border-color .25s ease, box-shadow .25s ease, transform .25s ease;
    overflow: hidden;
}

.sidebar-v2-card:hover {
    border-color: rgba(156, 39, 176, .4);
    box-shadow: 0 6px 20px rgba(0, 0, 0, .22);
    transform: translateY(-2px);
}

/* خط بالای گرادیانی برای ویجت‌ها */
.sidebar-v2-card::before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    height: 2px;
    background: linear-gradient(90deg, transparent, var(--primary-color), transparent);
    opacity: .5;
    pointer-events: none;
}

/* ---------- وسط‌چین کردن about-name در ویجت نویسنده سایدبار ---------- */
.sidebar-v2-about .about-name,
.site-sidebar .sidebar-about .about-name {
    text-align: center;
    width: 100%;
}

/* متن نام نویسنده با افکت گرادیانی در ویجت نویسنده سایدبار */
.sidebar-v2-about .about-name {
    background: linear-gradient(135deg, var(--link-color), #d1c4e9);
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
    color: var(--link-color);
}

/* ---------- باکس نویسنده پایین پست — با bio و سوشال و آواتار گرادیانی ---------- */
.post-author-box {
    margin-top: 28px;
    padding: 24px 22px;
    background:
        radial-gradient(ellipse 70% 80% at 0% 50%, rgba(156, 39, 176, .1), transparent 70%),
        radial-gradient(ellipse 50% 60% at 100% 0%, rgba(49, 27, 146, .08), transparent 60%),
        var(--card-bg);
    border: 1px solid var(--border-color);
    border-inline-start: 4px solid var(--primary-color);
    border-radius: var(--radius-lg, 14px);
    display: flex;
    align-items: flex-start;
    gap: 20px;
    flex-wrap: wrap;
    position: relative;
    overflow: hidden;
}

.post-author-box::before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    height: 2px;
    background: linear-gradient(90deg, transparent, var(--primary-color), transparent);
    opacity: .5;
    pointer-events: none;
}

.post-author-box .author-avatar {
    flex-shrink: 0;
    position: relative;
}

.post-author-box .author-avatar img {
    width: 88px;
    height: 88px;
    border-radius: 50%;
    object-fit: cover;
    border: 3px solid var(--primary-color);
    box-shadow: 0 0 0 5px rgba(156, 39, 176, .14), 0 8px 22px rgba(0, 0, 0, .25);
    background: var(--background);
}

.post-author-box .author-info {
    flex: 1;
    min-width: 240px;
}

.post-author-box .author-label {
    display: inline-block;
    margin-bottom: 6px;
    padding: 3px 12px;
    border-radius: 999px;
    font-size: .72rem;
    color: var(--link-color);
    background: rgba(156, 39, 176, .12);
    border: 1px solid rgba(156, 39, 176, .25);
    line-height: 1.6;
}

.post-author-box .author-info h3 {
    margin: 6px 0 8px;
    font-size: 1.15rem;
    font-weight: 700;
    color: var(--heading-color);
    background: linear-gradient(135deg, var(--heading-color), var(--link-color));
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
}

.post-author-box .author-bio {
    margin: 0 0 14px;
    font-size: .9rem;
    line-height: 1.95;
    color: var(--text-color-muted);
}

/* شبکه‌های اجتماعی در باکس نویسنده */
.post-author-box .author-social {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}

.post-author-box .author-social-link {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 36px;
    height: 36px;
    border-radius: 50%;
    color: var(--text-color-muted);
    background: rgba(255, 255, 255, .04);
    border: 1px solid var(--border-color);
    transition: all .25s ease;
}

.post-author-box .author-social-link:hover {
    color: #fff;
    background: var(--primary-color);
    border-color: var(--primary-color);
    transform: translateY(-3px);
    box-shadow: 0 6px 14px rgba(156, 39, 176, .35);
}

@media (max-width: 576px) {
    .post-author-box {
        padding: 18px 14px;
        gap: 14px;
    }
    .post-author-box .author-avatar img {
        width: 64px;
        height: 64px;
    }
    .post-author-box .author-info {
        min-width: 100%;
    }
}

/* ---------- بازطراحی خلاقانه دو باکس علاقه‌مندی‌ها و تخصص‌ها ---------- */
.about-tags-row {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
    gap: 20px;
    margin-bottom: 32px;
}

.about-tag-block {
    position: relative;
    padding: 24px 20px 22px;
    background: var(--card-bg);
    border: 1px solid var(--border-color);
    border-radius: var(--radius-lg, 14px);
    overflow: hidden;
    transition: all .3s ease;
}

.about-tag-block::before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    height: 3px;
    border-radius: 3px 3px 0 0;
    pointer-events: none;
    z-index: 1;
}

.about-tag-block-likes {
    border-color: rgba(233, 30, 99, .25);
    background:
        radial-gradient(ellipse 60% 60% at 100% 0%, rgba(233, 30, 99, .08), transparent 70%),
        var(--card-bg);
}

.about-tag-block-likes::before {
    background: linear-gradient(90deg, #ec407a, #e91e63, #c2185b);
}

.about-tag-block-specialties {
    border-color: rgba(156, 39, 176, .3);
    background:
        radial-gradient(ellipse 60% 60% at 0% 0%, rgba(156, 39, 176, .08), transparent 70%),
        var(--card-bg);
}

.about-tag-block-specialties::before {
    background: linear-gradient(90deg, #9c27b0, #7b1fa2, #311b92);
}

.about-tag-block:hover {
    transform: translateY(-3px);
    box-shadow: 0 12px 28px rgba(0, 0, 0, .25);
}

.about-tag-block-likes:hover {
    border-color: rgba(233, 30, 99, .5);
}

.about-tag-block-specialties:hover {
    border-color: rgba(156, 39, 176, .55);
}

/* عنوان باکس با آیکون بزرگتر و افکت */
.about-tag-title {
    display: flex;
    align-items: center;
    gap: 12px;
    margin: 0 0 18px;
    padding-bottom: 14px;
    font-size: 1.1rem;
    font-weight: 700;
    color: var(--heading-color);
    border-bottom: 1px dashed rgba(255, 255, 255, .08);
}

.about-tag-icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 38px;
    height: 38px;
    border-radius: 10px;
    flex-shrink: 0;
    transition: transform .25s ease, box-shadow .25s ease;
}

.about-tag-block:hover .about-tag-icon {
    transform: scale(1.08);
}

.about-tag-block-likes .about-tag-icon {
    background: linear-gradient(135deg, rgba(233, 30, 99, .18), rgba(233, 30, 99, .08));
    color: #f48fb1;
    box-shadow: 0 4px 12px rgba(233, 30, 99, .2);
}

.about-tag-block-specialties .about-tag-icon {
    background: linear-gradient(135deg, rgba(156, 39, 176, .18), rgba(49, 27, 146, .08));
    color: var(--link-color);
    box-shadow: 0 4px 12px rgba(156, 39, 176, .25);
}

.about-tag-icon svg {
    width: 18px;
    height: 18px;
}

/* تگ‌های علاقه‌مندی‌ها و تخصص‌ها — خلاقانه‌تر */
.about-tag-list {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}

.about-tag {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    padding: 7px 14px;
    border-radius: 999px;
    font-size: .85rem;
    background: rgba(255, 255, 255, .04);
    border: 1px solid var(--border-color);
    color: var(--text-color);
    transition: all .25s ease;
    position: relative;
    overflow: hidden;
}

.about-tag::before {
    content: "";
    width: 5px;
    height: 5px;
    border-radius: 50%;
    background: currentColor;
    opacity: .6;
    flex-shrink: 0;
}

.about-tag-likes {
    background: rgba(233, 30, 99, .08);
    border-color: rgba(233, 30, 99, .25);
    color: #f48fb1;
}

.about-tag-likes:hover {
    background: linear-gradient(135deg, #e91e63, #c2185b);
    border-color: transparent;
    color: #fff;
    transform: translateY(-2px);
    box-shadow: 0 4px 12px rgba(233, 30, 99, .35);
}

.about-tag-specialties {
    background: rgba(156, 39, 176, .08);
    border-color: rgba(156, 39, 176, .3);
    color: var(--link-color);
}

.about-tag-specialties:hover {
    background: linear-gradient(135deg, #9c27b0, #311b92);
    border-color: transparent;
    color: #fff;
    transform: translateY(-2px);
    box-shadow: 0 4px 12px rgba(156, 39, 176, .4);
}

/* ---------- نشان کامنت نویسنده با کراون ---------- */
.comment-author-badge {
    position: absolute;
    bottom: -3px;
    inset-inline-end: -3px;
    width: 22px;
    height: 22px;
    border-radius: 50%;
    background: linear-gradient(135deg, #ffd700, #ff8f00);
    color: #fff;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    box-shadow: 0 2px 8px rgba(255, 143, 0, .5);
    border: 2px solid var(--card-bg);
}

.comment-author-badge svg {
    width: 13px;
    height: 13px;
    color: #fff;
}

.sidebar-v2-comment-badge {
    background: linear-gradient(135deg, #ffd700, #ff8f00) !important;
    box-shadow: 0 2px 6px rgba(255, 143, 0, .45) !important;
}

.sidebar-v2-comment-badge svg {
    color: #fff;
}

/* ---------- یکدستی استایل h3 در باکس نویسنده با h3 در سایدبار ---------- */
.sidebar-v2-about .about-name {
    font-size: 1.15rem;
    margin: 14px 0 8px;
    font-weight: 700;
}

/* ---------- بهبود ریسپانسیو کاور پست‌های اخیر ---------- */
@media (max-width: 576px) {
    .sidebar-v2-recent-thumb {
        width: 44px;
        height: 44px;
    }
}

/* ---------- بهبود title-icon در سایدبار — گرادیانی ظریف ---------- */
.sidebar-v2-title-icon {
    background: linear-gradient(135deg, rgba(156, 39, 176, .18), rgba(49, 27, 146, .12));
    color: var(--link-color);
    box-shadow: 0 2px 6px rgba(156, 39, 176, .15);
}

/* ================================================================
 *  نسخهٔ ۱٫۶٫۱ — جداسازی کامل ویجت‌های سایدبار و اصلاح آواتار
 * ================================================================ */

/* ---------- ویجت‌های سایدبار: هم‌سبک با ویجت نویسنده، کاملاً جدا ---------- */

/* فضای بیشتر بین ویجت‌ها برای جداسازی بصری */
.sidebar-v2 {
    gap: 22px !important;
}

.sidebar-v2-card,
.sidebar-v2-about {
    /* همین استایل به هر دو نوع ویجت (نویسنده و کلاسیک) اعمال می‌شود
       تا همهٔ ویجت‌ها دقیقاً مثل ویجت نویسنده با همان دیزاین دیده شوند. */
    position: relative;
    text-align: center;
    padding: 28px 22px 22px !important;
    background:
        radial-gradient(ellipse 80% 60% at 50% 0%, rgba(156, 39, 176, .14), transparent 70%),
        var(--card-bg) !important;
    border: 1px solid var(--border-color);
    border-radius: var(--radius-lg, 14px);
    overflow: hidden;
    box-shadow: 0 4px 16px rgba(0, 0, 0, .15);
    transition: border-color .25s ease, box-shadow .25s ease, transform .25s ease;
}

.sidebar-v2-card:hover {
    border-color: rgba(156, 39, 176, .4);
    box-shadow: 0 6px 20px rgba(0, 0, 0, .25);
    transform: translateY(-2px);
}

/* خط بالای گرادیانی برای همهٔ ویجت‌ها */
.sidebar-v2-card::before,
.sidebar-v2-about::before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    height: 2px;
    background: linear-gradient(90deg, transparent, var(--primary-color), transparent);
    opacity: .55;
    pointer-events: none;
    z-index: 1;
}

/* عناصر تزئینی شناور — برای همهٔ ویجت‌ها */
.sidebar-v2-card::after {
    content: "";
    position: absolute;
    top: -30px;
    inset-inline-start: -20px;
    width: 100px;
    height: 100px;
    border-radius: 50%;
    background: radial-gradient(circle, rgba(156, 39, 176, .18), transparent 70%);
    pointer-events: none;
    z-index: 0;
    opacity: .7;
}

/* محتوای ویجت روی عناصر تزئینی */
.sidebar-v2-card > *,
.sidebar-v2-about > * {
    position: relative;
    z-index: 1;
}

/* عنوان ویجت — وسط‌چین و هماهنگ با ویجت نویسنده */
.sidebar-v2-card .sidebar-v2-title {
    justify-content: center;
    margin: 0 auto 16px;
    padding-bottom: 12px;
    font-size: 1rem;
    font-weight: 700;
    color: var(--heading-color);
    border-bottom: 2px solid rgba(156, 39, 176, .35);
    letter-spacing: .02em;
    text-align: center;
}

/* متن عنوان با افکت گرادیانی هماهنگ با نام نویسنده */
.sidebar-v2-card .sidebar-v2-title-text {
    background: linear-gradient(135deg, var(--link-color), #d1c4e9);
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
    color: var(--link-color);
}

/* آیکون عنوان ویجت — دایره‌ای با گرادیان */
.sidebar-v2-card .sidebar-v2-title-icon {
    background: linear-gradient(135deg, rgba(156, 39, 176, .22), rgba(49, 27, 146, .12));
    color: var(--link-color);
    box-shadow: 0 4px 12px rgba(156, 39, 176, .2);
    width: 32px;
    height: 32px;
    border-radius: 10px;
}

.sidebar-v2-card .sidebar-v2-title-icon svg {
    width: 16px;
    height: 16px;
}

/* ---------- آیتم‌های لیست: هم‌سبک با تراکم مناسب ---------- */

/* حذف border زیر آیتم‌ها برای استایل یکدست‌تر با ویجت نویسنده */
.sidebar-v2-card .sidebar-v2-list-item {
    border-bottom: 1px dashed rgba(255, 255, 255, .06);
    padding: 10px 4px;
    transition: background-color .2s ease;
}

.sidebar-v2-card .sidebar-v2-list-item:last-child {
    border-bottom: 0;
}

.sidebar-v2-card .sidebar-v2-list-item:hover {
    background: rgba(156, 39, 176, .06);
    border-radius: 8px;
}

/* ---------- اصلاح شکل آواتار در باکس نویسنده پایین پست ---------- */
/* مشکل: قانون قدیمی .author-avatar (width:80px;height:80px) روی wrapper
   با اندازهٔ 88x88 تصویر تداخل داشت و آواتار تخم‌مرغی می‌شد.
   راه‌حل: wrapper فقط flex-shrink:0 و overflow:hidden،
   و img دقیقاً 88x88 با aspect-ratio:1/1 و object-fit:cover. */

.post-author-box .author-avatar {
    flex-shrink: 0;
    width: 88px;
    height: 88px;
    border-radius: 50%;
    overflow: hidden;
    position: relative;
    /* حذف کامل border و box-shadow قدیمی */
    border: 0;
    box-shadow: none;
    background: transparent;
}

.post-author-box .author-avatar img {
    display: block;
    width: 88px !important;
    height: 88px !important;
    max-width: none !important;
    border-radius: 50% !important;
    object-fit: cover !important;
    aspect-ratio: 1 / 1;
    /* قاب و درخشش گرادیانی */
    border: 3px solid var(--primary-color) !important;
    box-shadow: 0 0 0 6px rgba(156, 39, 176, .14), 0 8px 22px rgba(0, 0, 0, .25) !important;
    background: var(--background);
    margin: 0 !important;
    padding: 0 !important;
}

/* ---------- تنظیم h3 و bio در باکس نویسنده (بدون badge) ---------- */
.post-author-box .author-info h3 {
    margin: 0 0 10px;
    font-size: 1.15rem;
    font-weight: 700;
    color: var(--heading-color);
    background: linear-gradient(135deg, var(--heading-color), var(--link-color));
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
    line-height: 1.5;
}

.post-author-box .author-bio {
    margin: 0 0 14px;
    font-size: .9rem;
    line-height: 1.95;
    color: var(--text-color-muted);
}

/* ---------- بهبود ریسپانسیو ---------- */
@media (max-width: 576px) {
    .sidebar-v2-card,
    .sidebar-v2-about {
        padding: 22px 16px 18px !important;
    }

    .sidebar-v2-card .sidebar-v2-title {
        font-size: .95rem;
    }

    .post-author-box .author-avatar,
    .post-author-box .author-avatar img {
        width: 72px !important;
        height: 72px !important;
    }
}

/* ---------- حذف افکت قدیمی hover روی آواتار ویجت نویسنده ---------- */
/* (هماهنگ‌سازی hover state با ویجت‌های کلاسیک) */
.sidebar-v2-about .about-avatar {
    transition: transform .35s ease, box-shadow .35s ease;
}

.sidebar-v2-about:hover .about-avatar {
    transform: scale(1.03);
    box-shadow: 0 0 0 6px rgba(156, 39, 176, .18), 0 10px 26px rgba(0, 0, 0, .3);
}

/* ---------- حذف padding-right اضافی که برای بولت‌ها بود ---------- */
.sidebar-v2-card .sidebar-v2-list,
.sidebar-v2-card .sidebar-list,
.sidebar-v2-card .sidebar-comments-list,
.sidebar-v2-card .sidebar-v2-tags {
    padding: 0 !important;
    margin: 0 !important;
    text-align: right; /* محتوای لیست راست‌چین بماند */
}

/* متن داخلی ویجت‌ها — کنار آیکون وسط‌چین نشود */
.sidebar-v2-card .sidebar-v2-list-link,
.sidebar-v2-card .sidebar-v2-popular-link,
.sidebar-v2-card .sidebar-v2-recent-link,
.sidebar-v2-card .sidebar-v2-comment-link {
    text-align: right;
}

/* عناوین لیست در ویجت‌ها — هماهنگ با font-size ویجت نویسنده */
.sidebar-v2-card .sidebar-list-title {
    font-size: .88rem;
    font-weight: 500;
    color: var(--text-color);
    line-height: 1.6;
}

/* ---------- بهبود لیست پربازدید در سایدبار ---------- */
.sidebar-v2-card .sidebar-v2-popular-thumb {
    width: 52px;
    height: 52px;
    border-radius: var(--radius-sm, 10px);
    border: 1px solid rgba(156, 39, 176, .2);
    box-shadow: 0 2px 8px rgba(0, 0, 0, .15);
}

.sidebar-v2-card .sidebar-v2-rank {
    width: 26px;
    height: 26px;
    border-radius: 8px;
    font-size: .78rem;
    font-weight: 700;
    background: linear-gradient(135deg, rgba(156, 39, 176, .18), rgba(49, 27, 146, .1));
    color: var(--link-color);
    box-shadow: 0 2px 6px rgba(156, 39, 176, .15);
}

.sidebar-v2-card .sidebar-v2-rank-hot {
    background: linear-gradient(135deg, #ec407a, #c2185b);
    color: #fff;
    box-shadow: 0 2px 8px rgba(233, 30, 99, .35);
}

/* ================================================================
 *  نسخهٔ ۱٫۶٫۲ — اصلاح سلسله‌مراتب H1، حذف badge کامنت،
 *  اصلاح فاصلهٔ آواتار در ویجت نویسنده
 * ================================================================ */

/* ---------- سلسله‌مراتب H1: site-hero-title اکنون h1 است ---------- */
.site-hero-title {
    display: block;
    font-size: 1.45rem;
    font-weight: 700;
    color: var(--heading-color);
    line-height: 1.6;
    margin: 4px 0 2px;
    /* h1 استایل پیش‌فرض مرورگر را ریست می‌کنیم */
    -webkit-margin-before: 0;
    -webkit-margin-after: 0;
    margin-block-start: 0;
    margin-block-end: 0;
    padding: 0;
}

/* ---------- هدر آرشیو: عنوان h2 اکنون هم‌سبک h1 است ---------- */
.archive-header h1,
.archive-header h2.archive-title,
.archive-header .archive-title {
    font-size: 1.6rem;
    color: var(--heading-color);
    margin: 0;
    font-weight: 700;
    line-height: 1.5;
    text-align: center;
}

.archive-header h1::after,
.archive-header h2.archive-title::after,
.archive-header .archive-title::after {
    content: "";
    display: block;
    width: 72px;
    height: 3px;
    margin: 14px auto 0;
    border-radius: 3px;
    background: linear-gradient(90deg, var(--primary-color), transparent);
}

/* ---------- حذف استایل‌های مربوط به comment-author-badge ---------- */
/* (عنصر HTML حذف شده، اینجا فقط استایل‌های مرده پاک می‌شوند) */

.comment-author-badge,
.sidebar-v2-comment-badge {
    display: none !important;
    /* در صورت وجود عنصر باقیمانده در HTML، مخفی شود */
}

/* ---------- اصلاح فاصلهٔ آواتار در ویجت نویسنده سایدبار (v1.6.3) ---------- */
/* مشکل قبلی: padding بالا 18px + حلقهٔ box-shadow با blur 18px روی آواتار
   باعث می‌شد هالهٔ تار آواتار تا نزدیک لبهٔ بالای باکس بالا برود و
   حس "فضای خالی زیاد" ایجاد شود.
   راه‌حل نهایی:
   1) کاهش چشمگیر padding بالا (18px → 10px).
   2) کوچک‌کردن blur سایهٔ آواتار (18px → 8px) و کاهش offset پایین
      (6px → 4px) تا هاله فقط به سمت پایین برود و بالا مخفی بماند.
   3) حفظ حلقهٔ نازک ۳px بیرونی برای ظاهر شیک. */

.sidebar-v2-about,
.sidebar-v2-card {
    padding: 10px 22px 22px !important;
}

/* آواتار ویجت نویسنده — فاصلهٔ منطقی با باکس */
.sidebar-v2-about .about-avatar-wrap {
    display: flex;
    justify-content: center;
    margin: 0 0 12px !important;
    padding: 0 !important;
    line-height: 0;
    /* line-height:0 باعث حذف فضای خالی زیر inline-image می‌شود */
}

.sidebar-v2-about .about-avatar {
    display: block;
    width: 84px;
    height: 84px;
    border-radius: 50%;
    object-fit: cover;
    border: 3px solid var(--primary-color);
    /* هالهٔ بالا بسیار نازک است تا حس فضای خالی ایجاد نکند؛
       با blur 8px و offset پایین 4px، سایهٔ نرم عمدتاً به سمت پایین می‌رود. */
    box-shadow: 0 0 0 3px rgba(156, 39, 176, .12), 0 4px 8px rgba(0, 0, 0, .25);
    background: var(--background);
    margin: 0 !important;
    /* حذف margin: auto سراسری */
}

/* اصلاح: روی hover، حلقه بیرونی کوچکتر بماند */
.sidebar-v2-about:hover .about-avatar {
    transform: scale(1.03);
    box-shadow: 0 0 0 4px rgba(156, 39, 176, .18), 0 6px 12px rgba(0, 0, 0, .3);
}

/* ---------- تنظیم سایر ویجت‌ها (هم‌سبک با ویجت نویسنده) ---------- */
.sidebar-v2-card .sidebar-v2-title {
    margin: 0 auto 14px;
    padding-bottom: 10px;
}

/* ---------- بهبود ریسپانسیو آواتار ---------- */
@media (max-width: 576px) {
    .sidebar-v2-about,
    .sidebar-v2-card {
        padding: 8px 16px 18px !important;
    }

    .sidebar-v2-about .about-avatar-wrap {
        margin: 0 0 10px !important;
    }

    .sidebar-v2-about .about-avatar {
        width: 76px;
        height: 76px;
    }
}

/* ---------- اصلاح avatar در باکس نویسنده پایین پست — هماهنگ با سایدبار ---------- */
.post-author-box .author-avatar {
    width: 84px;
    height: 84px;
    border-radius: 50%;
    overflow: hidden;
    flex-shrink: 0;
    position: relative;
    border: 0;
    box-shadow: none;
    background: transparent;
    line-height: 0;
}

.post-author-box .author-avatar img {
    display: block;
    width: 84px !important;
    height: 84px !important;
    max-width: none !important;
    border-radius: 50% !important;
    object-fit: cover !important;
    aspect-ratio: 1 / 1;
    border: 3px solid var(--primary-color) !important;
    box-shadow: 0 0 0 3px rgba(156, 39, 176, .12), 0 6px 18px rgba(0, 0, 0, .25) !important;
    background: var(--background);
    margin: 0 !important;
    padding: 0 !important;
}

@media (max-width: 576px) {
    .post-author-box .author-avatar,
    .post-author-box .author-avatar img {
        width: 72px !important;
        height: 72px !important;
    }
}