/* ===== User Comments ===== */
.uc {
    margin-block: 2.5rem;
    /* جلوگیری از اسکرول افقی ناشی از عناصر سرکش داخل سکشن */
    overflow-x: clip;
}

.uc__wrap {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 1.25rem;
    align-items: start; /* حتما start تا ارتفاع ردیف از بلندترین آیتم تبعیت نکند */
}

@media (max-width: 992px) {
    .uc__wrap {
        grid-template-columns: 1fr;
    }
}

/* --- جدید: پایه برای هم‌ارتفاع شدن کارت‌ها --- */
.uc__col {
    display: flex;
}

.uc__col .uc-card {
    display: flex;
    flex-direction: column;
    width: 100%;
}

.uc-card {
    background: #fff;
    border-radius: var(--radius-lg);
    box-shadow: var(--shadow-md);
    padding: 1rem;
}

.uc-card__head {
    margin-bottom: .75rem;
}

.uc-title {
    font-size: 1.125rem;
}

.uc-sub {
    margin: .25rem 0 .5rem;
    color: #666;
}

.uc__col--form .uc-card,
.uc__col--list .uc-card {
    background: #fff;
}

/* --- جدید: کارتِ ستون لیست ظرف ثابت اسکرول باشد --- */
.uc__col--list .uc-card {
    overflow: hidden; /* خود کارت ارتفاع ثابت می‌گیرد، اسکرول روی .uc-list انجام می‌شود */
}

/* ---------- Form ---------- */
.uc-user {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: .75rem;
    margin-bottom: .75rem;
}

@media (max-width: 640px) {
    .uc-user {
        grid-template-columns:1fr;
    }
}

.uc-user__row {
    display: flex;
    flex-direction: column;
}

.uc-user__row label {
    font-size: .875rem;
    color: #555;
    margin-bottom: .25rem;
}

.uc-in {
    border: 1px solid #e6e1d9;
    border-radius: var(--radius-sm);
    padding: .6rem .7rem;
    background: #fffaf3;
    font-family: var(--font-fa), sans-serif;
}

.uc-in:focus {
    outline: none;
    border-color: var(--color-rosegold);
    background: #fff;
}

.req-star {
    color: #d9534f;
    margin-inline-start: .25rem;
}

.uc-actions {
    display: flex;
    align-items: center;
    gap: .75rem;
    margin-top: .75rem;
    flex-wrap: wrap;
}

.uc-btn {
    background: var(--color-rosegold);
    color: #fff;
    border: 0;
    padding: .65rem 1rem;
    border-radius: var(--radius-md);
    cursor: pointer;
    transition: var(--transition);
}

.uc-btn:hover {
    background: var(--color-taupe);
}

.uc-btn--ghost {
    background: transparent;
    color: var(--color-rosegold);
    border: 1px solid var(--color-rosegold);
}

.uc-btn--ghost:hover {
    color: #fff;
    background: var(--color-rosegold);
}

/* honeypot */
.uc-hp {
    position: absolute;
    left: -9999px;
    width: 1px;
    height: 1px;
    overflow: hidden;
}

/* ---------- List ---------- */
.uc-list {
    display: grid;
    gap: .75rem;

    /* --- جدید: اسکرول داخلی ستون لیست --- */
    flex: 1; /* پر کردن فضای باقیمانده کارت */
    min-height: 0; /* اجازه به اسکرول داخل فلکس */
    overflow-y: auto; /* اسکرول عمودی داخلی */
}

.uc-item {
    border: 1px dashed #ead9cf;
    border-radius: var(--radius-md);
    padding: .9rem 1rem;
    background: #fff;
}

/* باکس پاسخ‌ها (پسندیده تم) */
.uc-item--reply {
    background: #F5F1E9; /* کرم روشن تم */
    border-color: #E6E1D9;
}

/* هدر هر نظر: عنوان + زمان جداگانه */
.uc-item__row {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: .5rem;
}

.uc-item__row--top {
    margin-bottom: .35rem;
}

.uc-item__headline {
    display: flex;
    align-items: center;
    gap: .4rem;
    font-weight: 700;
    color: #1C1C1C; /* مشکی مات تم */
}

.uc-item__id {
    background: #f1e5e0; /* تِم ملایم برای برجسته‌سازی شماره نظر */
    padding: .05rem .55rem;
    border-radius: 999px;
    font-weight: 700;
    font-size: .8rem;
}

.uc-item__sep {
    opacity: .45;
}

.uc-item__who {
    font-weight: 700;
}

.uc-item__date {
    color: #777;
    font-size: .8125rem;
    white-space: nowrap;
}

/* خط «در پاسخ به …» */
.uc-item__row--replyto {
    color: #8a7b73;
    font-size: .8125rem;
    margin-bottom: .25rem;
}

/* متن */
.uc-item__body {
    color: #222;
    line-height: 1.9;
}

/* قدیمی/سازگار: کلاس‌های قبلی که اگر جایی استفاده شده باشند، خراب نشوند */
.uc-item__meta {
    display: flex;
    align-items: center;
    gap: .5rem;
    margin-bottom: .35rem;
    flex-wrap: wrap;
}

.uc-item__name {
    font-weight: 700;
}

.uc-item__phone {
    color: #777;
    font-size: .8125rem;
}

/* ریپلای استایل قدیمی (اگر جایی باقی مانده) */
.uc-replies {
    margin-top: .5rem;
    padding-right: .75rem;
    border-right: 2px solid #f1e5e0;
    display: grid;
    gap: .5rem;
}

.uc-reply {
    background: #fffaf6;
    border: 1px solid #f0e2da;
    border-radius: var(--radius-sm);
    padding: .5rem .6rem;
}

/* Skeletons */
.uc-skeleton {
    display: grid;
    gap: .75rem;
}

.uc-skel {
    height: 84px;
    border-radius: var(--radius-md);
    background: linear-gradient(90deg, #eee 25%, #f7f4ef 37%, #eee 63%);
    background-size: 400% 100%;
    animation: ucShimmer 1.2s infinite;
}

@keyframes ucShimmer {
    0% {
        background-position: 100% 0
    }
    100% {
        background-position: 0 0
    }
}

.uc-err {
    color: #d9534f;
    font-size: .8125rem;
    margin-top: .25rem;
    display: block;
}

.uc-in.is-invalid {
    border-color: #f1b0b7;
    background: #fff5f6;
}

/* کپچا */
.uc-captcha {
    display: flex;
    align-items: center;
    gap: .5rem;
    flex-wrap: wrap;
}

.uc-captcha__q {
    padding: .45rem .6rem;
    background: #fff3f0;
    border: 1px dashed #f0c9c0;
    border-radius: var(--radius-sm);
    font-weight: 700;
    min-width: 90px;
    text-align: center;
}

/* حذف وابستگی‌های Swiper که باعث اورفلو می‌شد */
.uc-swiper, .uc-swiper .swiper-slide {
    all: unset;
}

/* ریسپانسیو: زمان بیفتد زیر تیتر در موبایل */
@media (max-width: 640px) {
    .uc-item__row {
        flex-direction: column;
        align-items: flex-start;
    }

    .uc-item__date {
        margin-top: .15rem;
    }
}

/* --- ریسپانسیو: در حالت تک‌ستونه، محدودیت اسکرول داخلی برداشته شود --- */
@media (max-width: 992px) {
    .uc__col--list .uc-card,
    .uc__col--list .uc-list {
        overflow: visible;
        max-height: none;
    }
}