/* صفحهٔ تک‌مقاله و تک‌شماره
   سیستم طراحی: design-system/nariman-yadollahi/MASTER.md */

.page-head {
  padding: var(--space-2xl) 0 var(--space-lg);
  border-block-end: 1px solid var(--color-border);
}
.article-hl {
  font-size: var(--text-h1);
  font-weight: var(--weight-display);
  line-height: 1.45;
  max-width: 24ch;
  margin-bottom: var(--space-sm);
}
.article-meta {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  color: var(--color-fg-subtle);
  font-size: var(--text-small);
}

/* ══ PROSE ══════════════════════════════════════════════════════════ */
.prose { max-width: 68ch; padding-block: var(--space-2xl); }
.prose h2 {
  font-size: var(--text-h2);
  font-weight: bold;
  line-height: 1.45;
  margin-block: var(--space-xl) var(--space-sm);
}
.prose h2:first-child { margin-block-start: 0; }
.prose h3 { font-size: var(--text-h3); font-weight: bold; margin-block: var(--space-lg) var(--space-xs); }
.prose p { color: var(--color-fg-muted); margin-bottom: var(--space-sm); }
.prose ul, .prose ol { display: grid; gap: 10px; margin-bottom: var(--space-sm); }
.prose ul { list-style: none; }
.prose ul li { position: relative; padding-inline-start: 22px; color: var(--color-fg-muted); }
.prose ul li::before {
  content: "";
  position: absolute;
  inset-inline-start: 0;
  inset-block-start: 0.85em;
  width: 6px; height: 6px;
  border-radius: 50%;
  background: var(--color-accent);
}
.prose ol { padding-inline-start: 22px; color: var(--color-fg-muted); }
.prose a { color: var(--color-accent); border-block-end: 1px solid transparent; transition: border-color .2s ease-out; }
.prose a:hover { border-block-end-color: var(--color-accent); }
.prose strong { color: var(--color-fg); font-weight: bold; }
.prose img { border-radius: 14px; margin-block: var(--space-md); }

.prose blockquote {
  border-inline-start: 2px solid var(--color-accent);
  padding-inline-start: var(--space-md);
  margin-block: var(--space-md);
}
.prose blockquote p:last-child { margin-bottom: 0; }

.prose code {
  font-family: ui-monospace, SFMono-Regular, Menlo, monospace;
  font-size: 0.875em;
  background: var(--color-surface-3);
  border: 1px solid var(--color-border);
  border-radius: 6px;
  padding: 2px 6px;
  direction: ltr;
  display: inline-block;
}
.prose pre {
  background: var(--color-surface-2);
  border: 1px solid var(--color-border);
  border-radius: 14px;
  padding: var(--space-sm) var(--space-md);
  overflow-x: auto;          /* بلوک کد باید داخل خودش اسکرول شود */
  direction: ltr;
  text-align: left;
  margin-block: var(--space-md);
}
.prose pre code { background: none; border: none; padding: 0; }

.prose table { width: 100%; border-collapse: collapse; margin-block: var(--space-md); }
.prose th, .prose td {
  border: 1px solid var(--color-border);
  padding: 10px var(--space-sm);
  text-align: start;
}
.prose th { background: var(--color-surface-2); font-weight: var(--weight-label); }
.prose td { color: var(--color-fg-muted); }

.article-tags { margin-bottom: var(--space-2xl); }

/* ══ ARCHIVE LIST ═══════════════════════════════════════════════════ */
.archive { display: grid; gap: 12px; }
.entry {
  display: flex;
  align-items: baseline;
  gap: var(--space-sm);
  flex-wrap: wrap;
  padding: var(--space-sm) var(--space-md);
  background: var(--color-surface-2);
  border: 1px solid var(--color-border);
  border-radius: 14px;
  transition: border-color .25s ease-out;
}
.entry:hover { border-color: var(--color-accent); }
.entry-date { color: var(--color-fg-subtle); font-size: var(--text-small); min-width: 108px; }
.entry-title { font-weight: bold; flex: 1 1 260px; }
.entry-time { color: var(--color-fg-subtle); font-size: var(--text-small); }
.entry-badge {
  font-size: 0.75rem;
  font-weight: var(--weight-label);
  padding: 2px 10px;
  border-radius: 40px;
  background: var(--color-accent);
  color: var(--color-on-accent);
}

.empty-note {
  color: var(--color-fg-subtle);
  border: 1px dashed var(--color-border-strong);
  border-radius: 14px;
  padding: var(--space-md);
}