/* ===================================================================
   RazTheme — Comments (Container + Form + Items + Meta + Actions)
   =================================================================== */

/* Container */
.comments{direction:rtl;text-align:right;margin:0;padding:0;background:transparent}

/* Form */
.raz-comment-form{
  margin:0 0 18px;padding:18px;
  border:1px solid var(--border);border-radius:16px;
  background:var(--glass-bg);
  -webkit-backdrop-filter:saturate(140%) blur(6px);
          backdrop-filter:saturate(140%) blur(6px);
  box-shadow:var(--card-shadow);
}
.raz-comment-form .comment-form-url,
.raz-comment-form .comment-notes,
.raz-comment-form .logged-in-as{display:none}
.raz-comment-form input[type="text"],
.raz-comment-form input[type="email"],
.raz-comment-form textarea{
  width:100%;padding:12px 14px;border:1px solid var(--border);
  border-radius:12px;background:transparent;color:var(--text);
  font:inherit;box-sizing:border-box;
}
.raz-comment-form input::placeholder,
.raz-comment-form textarea::placeholder{color:var(--text-dim);opacity:.72}
.raz-comment-form textarea{min-height:140px;resize:vertical}
.raz-comment-form .comment-form-author,
.raz-comment-form .comment-form-email{display:inline-block;width:calc(50% - 8px)}
.raz-comment-form .comment-form-email{margin-inline-start:8px}
@media (max-width:640px){
  .raz-comment-form .comment-form-author,
  .raz-comment-form .comment-form-email{display:block;width:100%;margin:0 0 10px}
}

/* Buttons */
#respond .form-submit .submit,
.raz-btn{
  display:inline-flex;align-items:center;justify-content:center;
  padding:10px 18px;border:1px solid var(--border);border-radius:10px;
  background:var(--glass-bg);
  font:inherit;font-size:14px;font-weight:700;line-height:1.6;color:var(--text);
  cursor:pointer;transition:transform .12s,box-shadow .12s,border-color .12s;
}
#respond .form-submit .submit:hover,
.raz-btn:hover{transform:translateY(-1px);box-shadow:0 6px 14px rgba(0,0,0,.12);border-color:var(--accent)}

/* Cancel reply */
.raz-cancel{display:none;margin:0 0 8px;justify-content:flex-end}
.raz-cancel.is-visible{display:flex}
.raz-cancel #cancel-comment-reply-link{
  display:inline-flex;align-items:center;gap:6px;padding:8px 14px;
  border:1px solid var(--border);border-radius:10px;background:var(--glass-bg);
  font:inherit;font-size:13px;font-weight:700;color:var(--text-dim);text-decoration:none;
  transition:transform .12s,box-shadow .12s,border-color .12s,color .12s;
}
.raz-cancel #cancel-comment-reply-link::before{content:"✕";font-size:13px;line-height:1}
.raz-cancel #cancel-comment-reply-link:hover{color:var(--text);border-color:var(--accent);box-shadow:0 4px 10px rgba(0,0,0,.1);transform:translateY(-1px)}

/* Totals + list */
.comments__total{margin:8px 0 14px;padding-right:6px;color:var(--text);font-weight:400;line-height:1.7}
.raz-cmt-list{list-style:none;margin:0;padding:0}

/* Single comment item */
.raz-cmt-item{
  margin:0 0 16px;padding:16px;border:1px solid var(--border);
  border-radius:16px;background:var(--glass-bg);
  -webkit-backdrop-filter:saturate(140%) blur(6px);
          backdrop-filter:saturate(140%) blur(6px);
  box-shadow:var(--card-shadow);
}
.raz-cmt__content{
  font-size:14px;line-height:1.9;color:var(--text);
  text-align:justify;text-justify:inter-word;
}
.raz-cmt__content p{margin:0 0 10px}
.raz-cmt__pending{display:block;margin-bottom:6px;color:var(--text-dim)}

/* ===================================================================
   Meta (2-row layout: line 1 = name/date, line 2 = parent reply)
   =================================================================== */
@property --ang {
  syntax: '<angle>';
  inherits: false;
  initial-value: 0deg;
}

/* ظرف متای دیدگاه: دو سطر */
.raz-meta{
  position:relative;
  padding:12px 16px;
  margin:0 0 12px;
  border-radius:14px;
  display:grid;
  grid-template-columns:1fr auto;
  grid-template-areas:
    "name  date"
    "parent parent";
  row-gap:6px;
  column-gap:12px;
  /* Light */
  background:color-mix(in srgb, #ffffff 96%, #10b981 4%);
  border:1px solid #34d399; /* emerald-400 */
  color:#111;
}

/* اگر داخل meta یک رپر میانی داری، شفافش کن تا بچه‌ها عضو گرید شوند */
.raz-meta__row{display:contents}

/* Dark + حلقه‌ی سبز */
html[data-theme="dark"] .raz-meta{
  background:rgba(16,185,129,.10);
  border:none;
  -webkit-backdrop-filter:saturate(140%) blur(6px);
          backdrop-filter:saturate(140%) blur(6px);
  color:#fff;
}
html[data-theme="dark"] .raz-meta::after{
  content:"";position:absolute;inset:0;border-radius:inherit;
  padding:2px;
  background:conic-gradient(from var(--ang),
    transparent 0 312deg,
    rgba(16,185,129,0)   312deg,
    rgba(16,185,129,.85) 330deg,
    rgba(16,185,129,0)   348deg,
    transparent          360deg);
  -webkit-mask:linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0);
  -webkit-mask-composite:xor;mask-composite:exclude;
  animation:meta-spin 6s linear infinite;
  z-index:0;
}
@keyframes meta-spin{to{--ang:360deg}}
.raz-meta>*{position:relative;z-index:1}

/* سطر اول: نام */
.raz-meta__name{grid-area:name;min-width:0}
.raz-author{
  font-size:13px;font-weight:500;color:inherit;
  overflow:hidden;text-overflow:ellipsis;white-space:nowrap;
}
.raz-author--staff{font-weight:600;color:#064e3b}
html[data-theme="dark"] .raz-author--staff{color:#fff}

/* سطر اول: تاریخ (چسبیده به انتهای سطر) */
.raz-meta__date{
  grid-area:date;justify-self:end;
  display:inline-flex;align-items:center;gap:6px;
  font-size:12px;font-weight:400;
  color:color-mix(in oklab, var(--text), black 0%);
}
.raz-meta__date .raz-ic{
  width:14px;height:14px;stroke:currentColor;fill:none;stroke-width:1.8;
  flex-shrink:0;align-self:center;
}

/* سطر دوم: «در پاسخ به …» */
.raz-parent-line{
  grid-area:parent;margin:0;font-size:13px;color:var(--text-dim);
  display:inline-flex;align-items:center;flex-wrap:wrap;
}
.raz-parent-line b{color:var(--text);font-weight:500;margin-inline-start:.35em}
.raz-parent-arrow::before{content:"↩";color:var(--text-dim);margin-inline-end:.35em}

/* ===================================================================
   Actions + Votes
   =================================================================== */
.raz-actions{display:flex;align-items:center;gap:10px;margin-top:12px}
.raz-actions .raz-votes{display:flex;gap:8px}
.raz-vote{
  display:inline-flex;align-items:center;gap:6px;padding:6px 10px;
  border:1px solid var(--border);border-radius:10px;background:transparent;cursor:pointer;
  font:inherit;font-size:13px;font-weight:700;line-height:1;
  transition:border-color .12s,color .12s,transform .12s;
}
.raz-vote:hover{transform:translateY(-1px)}
.raz-vote svg{width:16px;height:16px;stroke:currentColor;fill:none;stroke-width:1.8}
.raz-vote span{font-variant-numeric:tabular-nums;-moz-font-feature-settings:"tnum";font-feature-settings:"tnum"}
.raz-vote--like.is-active{border-color:var(--accent);color:var(--accent)}
.raz-vote--dislike.is-active{border-color:crimson;color:crimson}

/* Reply link */
.raz-reply-link{margin-inline-start:auto}
.raz-reply-link a{
  display:inline-flex;align-items:center;gap:6px;color:var(--accent);
  font-weight:700;font-size:13px;text-decoration:none;
  transition:opacity .12s,transform .12s;
}
.raz-reply-link a::before{content:'↩';font-size:14px;opacity:.85}
.raz-reply-link a:hover{opacity:.95;transform:translateY(-1px)}

/* Children */
.raz-cmt-item>.children{
  list-style:none;margin:14px 0 0;padding:12px 0 0;border-top:1px dashed var(--border);
}
.raz-cmt-item>.children>.raz-cmt-item{margin-top:12px}

/* Inline reply area */
.raz-cmt #respond{
  margin-top:14px;padding:14px;border:1px solid var(--border);
  border-radius:12px;background:var(--glass-bg);
}

/* Pagination */
.raz-cmt-pager{display:flex;gap:12px;row-gap:12px;flex-wrap:wrap;justify-content:center;margin-top:20px}
.raz-page-nums{display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.raz-page-btn{
  display:inline-flex;align-items:center;justify-content:center;
  min-width:40px;min-height:36px;padding:8px 12px;
  border:1px solid var(--border);border-radius:10px;background:var(--glass-bg);
  cursor:pointer;font:inherit;font-size:13px;font-weight:500;line-height:1;
  font-variant-numeric:tabular-nums;
  transition:transform .12s,box-shadow .12s,border-color .12s;
}
.raz-page-btn:hover{transform:translateY(-1px);box-shadow:0 6px 12px rgba(0,0,0,.08)}
.raz-page-btn.is-active{border-color:var(--accent);color:var(--accent)}
.raz-ellip{padding:0 4px;line-height:1;opacity:.6}
@media (max-width:480px){
  .raz-page-btn{min-width:34px;min-height:34px;padding:8px 10px}
}

/* A11y helper */
.sr-only{
  position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;
  clip:rect(0,0,0,0);white-space:nowrap;border:0;
}

/* Reply header */
.raz-cmt #respond #reply-title{
  margin:0 0 12px;padding:10px 12px;display:flex;align-items:center;gap:10px;
  border:1px solid var(--border);border-radius:12px;background:var(--glass-bg);
  -webkit-backdrop-filter:saturate(140%) blur(6px);
          backdrop-filter:saturate(140%) blur(6px);
  color:var(--text);font-weight:400;font-size:13px;line-height:1.6;
}
.raz-cmt #respond #reply-title cite,
.raz-cmt #respond #reply-title .fn,
.raz-cmt #respond #reply-title b{
  font-weight:700;font-size:.92em;color:var(--text);margin-inline:.35em .15em;white-space:nowrap;
}
.raz-cmt #respond #reply-title small{margin-inline-start:auto}
.raz-cmt #respond #reply-title #cancel-comment-reply-link{
  display:inline-flex;align-items:center;gap:6px;padding:6px 10px;
  border:1px solid var(--border);border-radius:10px;background:var(--glass-bg);
  color:var(--text-dim);font:inherit;font-size:12.5px;font-weight:700;text-decoration:none;
  transition:transform .12s,box-shadow .12s,border-color .12s,color .12s;
}
.raz-cmt #respond #reply-title #cancel-comment-reply-link::before{content:"✕";font-size:12px;line-height:1}
.raz-cmt #respond #reply-title #cancel-comment-reply-link:hover{
  color:var(--text);border-color:var(--accent);box-shadow:0 4px 10px rgba(0,0,0,.1);transform:translateY(-1px);
}

/* Cookies consent */
p.comment-form-cookies-consent{padding-top:20px;padding-bottom:20px;padding-right:4px;font-size:14px}