/* ==========================================================================
   52 · Engagement — کارت اعتبار علمی، اشتراک‌گذاری، نظرات و امتیاز
   ========================================================================== */

/* نشان (badge) */
.wm-badge { display: inline-flex; align-items: center; gap: var(--sp-1); padding: 0 var(--sp-3); border-radius: var(--r-full); font-size: var(--fs-xs); font-weight: var(--fw-semibold); line-height: 1.9; }
.wm-badge svg { width: var(--icon-xs); height: var(--icon-xs); stroke-width: 2.4; }
.wm-badge--ok { background: var(--c-success-50); color: var(--c-success); }
.wm-badge--brand { background: var(--c-primary-50); color: var(--c-primary-700); }

/* ستاره‌ها */
.wm-stars { display: inline-flex; gap: 2px; color: var(--c-border); }
.wm-stars svg { width: var(--icon-sm); height: var(--icon-sm); fill: currentColor; stroke: none; }
.wm-stars .is-on, .wm-stars .is-half { color: var(--c-warning); }
.wm-stars .is-half svg { opacity: .55; }

/* ---------- کارت اعتبار علمی ---------- */
.wm-cred { margin: 0; padding: var(--card-pad); border: 1px solid var(--c-line); border-radius: var(--r-lg); background: var(--c-surface); box-shadow: var(--shadow-sm); }
.wm-cred__head { display: flex; align-items: center; justify-content: space-between; gap: var(--sp-3); margin-bottom: var(--sp-4); }
.wm-cred__head h2 { display: flex; align-items: center; gap: var(--sp-3); margin: 0; font-size: var(--fs-lg); }
.wm-cred__ico { display: grid; place-items: center; width: var(--control-md); height: var(--control-md); border-radius: var(--r-md); background: var(--c-primary-50); color: var(--c-primary-600); }
.wm-cred__ico svg { width: var(--icon-md); height: var(--icon-md); }
.wm-cred__stats { display: grid; grid-template-columns: repeat(2, 1fr); gap: var(--sp-2); margin: 0 0 var(--sp-4); padding: 0; list-style: none; }
.wm-stat { display: grid; grid-template-columns: 1fr; justify-items: start; gap: var(--sp-1); padding: var(--sp-3); border-radius: var(--r-md); background: var(--c-surface-soft); }
.wm-stat__ico { display: grid; place-items: center; width: var(--control-md); height: var(--control-md); border-radius: 50%; background: var(--c-white); color: var(--c-primary-600); box-shadow: var(--shadow-sm); }
.wm-stat__ico svg { width: var(--icon-md); height: var(--icon-md); }
.wm-stat__label { color: var(--c-ink-500); font-size: var(--fs-xs); }
.wm-stat strong { color: var(--c-ink-900); font-size: var(--fs-base); line-height: var(--lh-snug); }
.wm-stat strong small { color: var(--c-ink-500); font-size: var(--fs-2xs); font-weight: var(--fw-regular); }
.wm-cred__row { display: grid; gap: var(--sp-3); }
.wm-cred__box { padding: var(--sp-4); border: 1px solid var(--c-line); border-radius: var(--r-md); }
.wm-reviewer { display: flex; align-items: center; gap: var(--sp-3); }
.wm-reviewer__avatar { position: relative; display: grid; flex: none; place-items: center; width: 4rem; height: 4rem; border-radius: 50%; background: var(--g-brand); color: var(--c-white); box-shadow: 0 0 0 4px var(--c-primary-50); }
.wm-reviewer__avatar svg { width: var(--icon-xl); height: var(--icon-xl); stroke: var(--c-white); stroke-width: 1.6; }
.wm-reviewer__avatar::after { content: ""; position: absolute; inset-block-end: 0; inset-inline-end: 0; width: var(--sp-5); height: var(--sp-5); border: 2px solid var(--c-white); border-radius: 50%; background: var(--c-success) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23fff' stroke-width='3.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m5 12.5 4.500 4.500L19 7.500'/%3E%3C/svg%3E") center / 70% no-repeat; }
.wm-reviewer small { display: block; color: var(--c-ink-500); font-size: var(--fs-xs); }
.wm-reviewer strong { display: block; color: var(--c-ink-900); line-height: var(--lh-snug); }
.wm-reviewer div > span { color: var(--c-ink-700); font-size: var(--fs-sm); }
.wm-sources h3 { display: flex; align-items: center; gap: var(--sp-2); margin-bottom: var(--sp-2); font-size: var(--fs-sm); }
.wm-sources h3 svg { width: var(--icon-sm); height: var(--icon-sm); color: var(--c-primary-600); }
.wm-sources ul { display: grid; gap: var(--sp-1); margin: 0; padding: 0; list-style: none; }
.wm-sources li a, .wm-sources__plain { display: flex; align-items: center; gap: var(--sp-3); padding: var(--sp-2) var(--sp-3); border-radius: var(--r-sm); color: var(--c-ink-900); font-size: var(--fs-sm); }
.wm-sources li a:hover { background: var(--c-surface-soft); color: var(--c-primary-700); }
.wm-sources li svg { flex: none; width: var(--icon-sm); height: var(--icon-sm); color: var(--c-primary-600); }
.wm-sources li small { display: block; color: var(--c-ink-500); font-size: var(--fs-2xs); direction: ltr; text-align: start; unicode-bidi: plaintext; }

/* ---------- اشتراک‌گذاری ---------- */
.wm-share { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: var(--sp-4); margin: 0; padding: var(--sp-4) var(--card-pad); border-radius: var(--r-lg); background: var(--g-page-head); }
.wm-share__text { display: flex; align-items: center; gap: var(--sp-3); }
.wm-share__text strong { display: block; color: var(--c-ink-900); font-size: var(--fs-base); }
.wm-share__text small { color: var(--c-ink-500); font-size: var(--fs-xs); }
.wm-share__ico { display: grid; place-items: center; width: var(--control-md); height: var(--control-md); border-radius: 50%; background: var(--c-white); color: var(--c-primary-600); box-shadow: var(--shadow-sm); }
.wm-share__ico svg { width: var(--icon-md); height: var(--icon-md); }
.wm-share__btns { display: flex; flex-wrap: wrap; gap: var(--sp-2); }
.wm-share__btn { display: inline-flex; align-items: center; justify-content: center; gap: var(--sp-2); min-width: var(--control-md); height: var(--control-md); padding: 0; border: 0; border-radius: var(--r-full); background: var(--c-white); color: var(--c-primary-600); font-family: inherit; font-size: var(--fs-xs); font-weight: var(--fw-semibold); box-shadow: var(--shadow-sm); cursor: pointer; transition: background var(--dur-fast) var(--ease), color var(--dur-fast) var(--ease), transform var(--dur-fast) var(--ease); }
.wm-share__btn:hover { background: var(--c-primary-600); color: var(--c-white); transform: translateY(-2px); }
.wm-share__btn svg { width: var(--icon-md); height: var(--icon-md); }
.wm-share__btn--copy { padding: 0 var(--sp-4); }
.wm-share__btn.is-done { background: var(--c-success); color: var(--c-white); }
.wm-share__btn[hidden] { display: none; }

/* ---------- نظرات ---------- */
.wm-comments { padding-top: var(--sp-8); border-top: 1px solid var(--c-line); }
.wm-comments__more { justify-self: center; margin: var(--sp-5) auto 0; display: flex; }
.wm-comments__head { display: flex; align-items: center; justify-content: space-between; gap: var(--sp-3); margin-bottom: var(--sp-5); }
.wm-comments__head h2 { display: flex; align-items: center; gap: var(--sp-2); margin: 0; font-size: var(--fs-xl); }
.wm-comments__head h2 svg { width: var(--icon-lg); height: var(--icon-lg); color: var(--c-primary-600); }
.wm-comments__head h2 span { display: inline-grid; place-items: center; min-width: var(--control-sm); height: var(--sp-8); padding: 0 var(--sp-2); border-radius: var(--r-full); background: var(--c-primary-50); color: var(--c-primary-700); font-size: var(--fs-sm); }

.wm-ratesum { display: grid; grid-template-columns: 11rem 1fr; align-items: center; gap: var(--sp-8); margin-bottom: var(--sp-6); padding: var(--card-pad); border-radius: var(--r-lg); background: var(--c-surface-soft); }
.wm-ratesum__score { display: grid; justify-items: center; gap: var(--sp-1); text-align: center; }
.wm-ratesum__score strong { color: var(--c-ink-900); font-size: var(--fs-4xl); font-weight: var(--fw-extrabold); line-height: 1.2; }
.wm-ratesum__score small { color: var(--c-ink-500); font-size: var(--fs-xs); }
.wm-ratesum__bars { display: grid; gap: var(--sp-2); margin: 0; padding: 0; list-style: none; }
.wm-ratesum__bars li { display: grid; grid-template-columns: 2.75rem 1fr 2.75rem; align-items: center; gap: var(--sp-3); color: var(--c-ink-700); font-size: var(--fs-xs); }
.wm-ratesum__bars span { display: inline-flex; align-items: center; gap: var(--sp-1); }
.wm-ratesum__bars svg { width: var(--icon-xs); height: var(--icon-xs); color: var(--c-warning); fill: currentColor; stroke: none; }
.wm-ratesum__bars i { display: block; height: var(--sp-2); overflow: hidden; border-radius: var(--r-full); background: var(--c-white); }
.wm-ratesum__bars b { display: block; height: 100%; border-radius: var(--r-full); background: var(--c-warning); }
.wm-ratesum__bars em { color: var(--c-ink-500); font-style: normal; text-align: end; }

.wm-commentlist, .wm-commentlist .children { display: grid; gap: var(--sp-3); margin: 0; padding: 0; list-style: none; }
.wm-commentlist .children { margin-top: var(--sp-3); padding-inline-start: var(--sp-8); border-inline-start: 2px solid var(--c-primary-100); }
.wm-comment__card { padding: var(--sp-4) var(--card-pad); border: 1px solid var(--c-line); border-radius: var(--r-lg); background: var(--c-surface); }
.wm-comment--staff > .wm-comment__card { border-color: var(--c-primary-100); background: var(--c-surface-soft); }
.wm-comment__head { display: flex; align-items: center; gap: var(--sp-3); margin-bottom: var(--sp-2); }
.wm-comment__avatar { display: grid; flex: none; place-items: center; width: var(--control-md); height: var(--control-md); border-radius: 50%; color: var(--c-white); font-weight: var(--fw-bold); }
.wm-comment__avatar svg { width: var(--icon-md); height: var(--icon-md); }
.wm-comment__avatar--0 { background: var(--c-primary-500); }
.wm-comment__avatar--1 { background: var(--c-success); }
.wm-comment__avatar--2 { background: var(--c-ink-700); }
.wm-comment__avatar--3 { background: var(--c-primary-800); }
.wm-comment--staff .wm-comment__avatar { background: var(--g-brand); }
.wm-comment__who { display: flex; flex: 1; flex-wrap: wrap; align-items: center; gap: 0 var(--sp-2); min-width: 0; }
.wm-comment__who strong { color: var(--c-ink-900); }
.wm-comment__who time { flex-basis: 100%; color: var(--c-ink-500); font-size: var(--fs-xs); }
.wm-comment__text { color: var(--c-ink-700); font-size: var(--fs-sm); line-height: var(--lh-body); }
.wm-comment__text p { margin: 0; }
.wm-comment__pending { margin: 0 0 var(--sp-2); padding: var(--sp-2) var(--sp-3); border-radius: var(--r-sm); background: var(--c-warning-50, var(--c-surface-soft)); font-size: var(--fs-xs); }
.wm-comment__foot { margin-top: var(--sp-2); }
.wm-comment__foot a { display: inline-flex; align-items: center; gap: var(--sp-1); color: var(--c-primary-600); font-size: var(--fs-xs); font-weight: var(--fw-semibold); }
.wm-comment__foot svg { width: var(--icon-xs); height: var(--icon-xs); }

/* فرم نظر */
.wm-commentform { margin-top: var(--sp-6); }
.comment-respond .comment-reply-title { margin: 0 0 var(--sp-1); font-size: var(--fs-lg); font-weight: var(--fw-extrabold); }
.comment-respond .comment-reply-title small { margin-inline-start: var(--sp-3); font-size: var(--fs-xs); font-weight: var(--fw-regular); }
.wm-form__hint { margin: 0; color: var(--c-ink-500); font-size: var(--fs-xs); }
.wm-commentform p { margin: 0; }
.wm-form__field { display: grid; gap: var(--sp-2); }
.wm-commentform .wm-form__field label { display: block; font-size: var(--fs-sm); font-weight: var(--fw-semibold); }
.wm-commentform .wm-form__field label span { margin-inline-start: var(--sp-1); color: var(--c-primary-600); }
.wm-commentform .wm-form__hint { order: -3; }
.wm-commentform .wm-rating-field { order: -2; }
.wm-commentform .wm-form__row { order: -1; }
.wm-rating-field { margin: 0; padding: 0; border: 0; }
.wm-rating-field legend { margin-bottom: var(--sp-2); padding: 0; font-size: var(--fs-sm); font-weight: var(--fw-semibold); }
.wm-rate-input { display: inline-flex; flex-direction: row-reverse; gap: var(--sp-1); direction: ltr; }
.wm-rate-input input { position: absolute; opacity: 0; pointer-events: none; }
.wm-rate-input label { display: grid; place-items: center; width: var(--control-sm); height: var(--control-sm); color: var(--c-border); cursor: pointer; transition: color var(--dur-fast) var(--ease), transform var(--dur-fast) var(--ease); }
.wm-rate-input label svg { width: var(--icon-lg); height: var(--icon-lg); fill: currentColor; stroke: none; }
.wm-rate-input input:checked ~ label, .wm-rate-input label:hover, .wm-rate-input label:hover ~ label { color: var(--c-warning); }
.wm-rate-input label:hover { transform: scale(1.12); }
.wm-rate-input input:focus-visible + label { outline: 3px solid var(--c-focus); border-radius: var(--r-sm); }
.wm-comment .wm-rating-field { display: none; }
@media (min-width: 641px) { .wm-commentform .wm-form__row { display: grid; grid-template-columns: 1fr 1fr; gap: var(--sp-4); } }
.wm-commentform .wm-form__row { display: grid; gap: var(--sp-4); }

@media (max-width: 960px) {
}
@media (max-width: 640px) {
	.wm-ratesum { grid-template-columns: 1fr; gap: var(--sp-5); }
	.wm-commentlist .children { padding-inline-start: var(--sp-4); }
	.wm-share { flex-direction: column; align-items: flex-start; }
	.wm-comments__head .wm-btn { display: none; }
}
