/* Public blog + staff manage pages (palette-44 tokens, RTL, Vazirmatn). The
   editor page uses rich_editor.css instead. */
:root {
  color-scheme: light;
  --ground:#FCFBF8; --surface:#FFFFFF; --surface-2:#F5F4EF; --ink:#1A1A1A;
  --body:#55555C; --muted:#8B8B93; --line:#EAE9E3; --line-strong:#DEDCD3;
  --accent:#2E718F; --accent-tint:#E7F6FE; --yellow:#FFDD00; --yellow-deep:#F1CE00;
  --green-tint:#E4F8EC; --green-ink:#1B793D; --danger:#C23636; --danger-tint:#FFE9E9;
  --focus:#2E718F; --font:'Vazirmatn','Segoe UI',Tahoma,system-ui,sans-serif;
}
@media (prefers-color-scheme: dark) { :root:not([data-theme="light"]) {
  color-scheme: dark;
  --ground:#131311; --surface:#1D1D1A; --surface-2:#242420; --ink:#F4F3EE;
  --body:#C6C5BD; --muted:#8E8D84; --line:#2D2D29; --line-strong:#3A3934;
  --accent:#7FC7E6; --accent-tint:rgba(79,195,247,.14);
  --green-tint:rgba(47,209,106,.15); --green-ink:#74E29E;
  --danger:#F6A1A1; --danger-tint:rgba(194,54,54,.16); --focus:#7FC7E6;
}}
:root[data-theme="dark"] {
  color-scheme: dark;
  --ground:#131311; --surface:#1D1D1A; --surface-2:#242420; --ink:#F4F3EE;
  --body:#C6C5BD; --muted:#8E8D84; --line:#2D2D29; --line-strong:#3A3934;
  --accent:#7FC7E6; --accent-tint:rgba(79,195,247,.14);
  --green-tint:rgba(47,209,106,.15); --green-ink:#74E29E;
  --danger:#F6A1A1; --danger-tint:rgba(194,54,54,.16); --focus:#7FC7E6;
}
* { box-sizing:border-box; }
body { margin:0; background:var(--ground); color:var(--body); font-family:var(--font); line-height:2; }
a { color:var(--accent); }
:where(a,button):focus-visible { outline:2px solid var(--focus); outline-offset:2px; border-radius:6px; }
.wrap { max-width:920px; margin-inline:auto; padding:28px 22px 80px; }
.head { display:flex; align-items:baseline; gap:12px; margin:6px 0 26px; flex-wrap:wrap; }
.head h1 { color:var(--ink); font-size:1.7rem; font-weight:800; margin:0; }
.head .grow { flex:1; }
.back { display:inline-block; color:var(--accent); font-weight:700; font-size:.92rem; text-decoration:none; margin-bottom:22px; }
.back:hover { text-decoration:underline; }
.btn { display:inline-flex; align-items:center; gap:7px; font-family:inherit; font-weight:700; font-size:.9rem; text-decoration:none; cursor:pointer; padding:9px 15px; border-radius:10px; border:1.5px solid transparent; }
.btn-primary { background:var(--yellow); color:#1A1A1A; } .btn-primary:hover { background:var(--yellow-deep); }
.btn-ghost { background:transparent; color:var(--ink); border-color:var(--line-strong); } .btn-ghost:hover { background:var(--surface-2); }
.btn-danger { background:var(--danger-tint); color:var(--danger); }

/* ---- list ---- */
.grid { display:grid; grid-template-columns:repeat(auto-fill,minmax(260px,1fr)); gap:18px; }
.card { display:flex; flex-direction:column; background:var(--surface); border:1px solid var(--line); border-radius:16px; overflow:hidden; text-decoration:none; color:inherit; transition:border-color .15s, transform .12s; }
.card:hover { border-color:var(--line-strong); transform:translateY(-2px); }
.card .cover { aspect-ratio:16/9; background:var(--surface-2) center/cover no-repeat; }
.card .body { padding:15px 17px; display:flex; flex-direction:column; gap:8px; }
.card h3 { margin:0; font-size:1.08rem; font-weight:700; color:var(--ink); }
.card .meta { font-size:.78rem; color:var(--muted); }
.card .exc { font-size:.86rem; margin:0; }
.empty { text-align:center; color:var(--muted); padding:60px 0; }

/* ---- single post ---- */
.post { max-width:760px; margin-inline:auto; }
.post .cover { width:100%; aspect-ratio:16/9; object-fit:cover; border-radius:14px; margin-bottom:22px; }
.post h1 { color:var(--ink); font-size:2rem; font-weight:800; line-height:1.4; margin:0 0 8px; }
.post .meta { color:var(--muted); font-size:.9rem; margin-bottom:24px; }
.draft-flag { display:inline-block; background:var(--danger-tint); color:var(--danger); font-weight:700; font-size:.78rem; padding:3px 10px; border-radius:999px; margin-inline-start:8px; }
.doc-body { font-size:1.05rem; color:var(--body); }
.doc-body :first-child { margin-top:0; }
.doc-body h1{font-size:1.7rem} .doc-body h2{font-size:1.4rem} .doc-body h3{font-size:1.18rem}
.doc-body h1,.doc-body h2,.doc-body h3 { color:var(--ink); font-weight:800; line-height:1.4; margin:1.2em 0 .5em; }
.doc-body p { margin:0 0 1em; }
.doc-body ul,.doc-body ol { padding-inline-start:1.6em; margin:0 0 1em; }
.doc-body blockquote { margin:1em 0; padding:.6em 1.1em; border-inline-start:4px solid var(--accent); background:var(--surface-2); border-radius:0 10px 10px 0; }
.doc-body pre { background:var(--surface-2); border:1px solid var(--line); border-radius:12px; padding:14px 16px; font-family:ui-monospace,Consolas,monospace; direction:ltr; overflow-x:auto; }
.doc-body a { text-decoration:underline; }
.doc-body img { max-width:100%; height:auto; border-radius:8px; }
.doc-body table { border-collapse:collapse; width:100%; margin:1em 0; }
.doc-body td,.doc-body th { border:1px solid var(--line-strong); padding:8px 10px; }
.doc-body hr { border:0; border-top:2px solid var(--line); margin:1.4em 0; }

/* ---- manage table ---- */
.tbl { width:100%; border-collapse:collapse; background:var(--surface); border:1px solid var(--line); border-radius:14px; overflow:hidden; }
.tbl th,.tbl td { text-align:start; padding:12px 14px; border-bottom:1px solid var(--line); font-size:.9rem; }
.tbl th { color:var(--muted); font-weight:700; font-size:.8rem; }
.tbl tr:last-child td { border-bottom:0; }
.pill { display:inline-block; font-weight:700; font-size:.76rem; padding:3px 10px; border-radius:999px; }
.pill.published { background:var(--green-tint); color:var(--green-ink); }
.pill.draft { background:var(--surface-2); color:var(--muted); }
.row-actions { display:flex; gap:6px; flex-wrap:wrap; }
.row-actions form { display:inline; }
.linkbtn { font-family:inherit; font-weight:700; font-size:.82rem; cursor:pointer; background:transparent; border:1px solid var(--line-strong); color:var(--ink); padding:6px 11px; border-radius:8px; }
.linkbtn.danger { color:var(--danger); border-color:var(--danger-tint); }
@media (max-width:560px){ .head h1{font-size:1.4rem} .tbl th:nth-child(3),.tbl td:nth-child(3){display:none} }
