/* ═══════════════════════════════════════════════════════════════
   حالت مطالعه (Reading Mode) — مشترک بین صفحات CMS، مقالات و لندینگ‌ها
   کاملاً مستقل از تم سایت (متغیرهای --rm-*) تا در l.php هم که
   style.css را لود نمی‌کند درست کار کند.
   ═══════════════════════════════════════════════════════════════ */

/* ── دکمه‌ی درون‌صفحه‌ای ── */
.rm-trigger{
  display:inline-flex;align-items:center;gap:6px;
  background:transparent;color:inherit;font-family:inherit;font-size:12.5px;font-weight:700;
  border:1px solid currentColor;border-radius:99px;padding:5px 13px;cursor:pointer;
  opacity:.85;transition:opacity .15s,background .15s;line-height:1.6
}
.rm-trigger:hover,.rm-trigger:focus-visible{opacity:1;background:rgba(127,127,127,.12)}
.rm-trigger svg{width:15px;height:15px;flex-shrink:0}

/* ── دکمه‌ی شناور (بعد از کمی اسکرول ظاهر می‌شود) ── */
.rm-fab{
  position:fixed;inset-inline-start:16px;bottom:calc(76px + env(safe-area-inset-bottom,0px));z-index:55;
  display:flex;align-items:center;gap:6px;
  background:#1c1c1e;color:#fff;border:0;border-radius:99px;padding:9px 15px;
  font-family:Vazirmatn,Tahoma,sans-serif;font-size:12.5px;font-weight:700;cursor:pointer;
  box-shadow:0 6px 20px rgba(0,0,0,.28);
  opacity:0;transform:translateY(12px);pointer-events:none;transition:opacity .2s,transform .2s
}
.rm-fab.show{opacity:1;transform:none;pointer-events:auto}
.rm-fab svg{width:16px;height:16px}
/* چت پشتیبانی سمت چپ است؛ دکمه‌ی شناور سمت راست (RTL start) می‌ماند تا تداخل نکند */
@media (min-width:721px){ .rm-fab{bottom:24px} }

/* ── خودِ خواننده (overlay تمام‌صفحه) ── */
.rm-overlay{
  --rm-bg:#ffffff;--rm-fg:#1c1c1e;--rm-mute:#6b6d73;--rm-line:#e7e7e9;--rm-bar:#f6f6f7;--rm-accent:#d3121b;--rm-quote:#f3f3f4;
  --rm-size:19px;--rm-lh:2.05;--rm-width:680px;
  position:fixed;inset:0;z-index:2000;display:flex;flex-direction:column;
  background:var(--rm-bg);color:var(--rm-fg);direction:rtl;
  font-family:Vazirmatn,Tahoma,sans-serif;
  opacity:0;visibility:hidden;transition:opacity .2s,visibility .2s
}
.rm-overlay.open{opacity:1;visibility:visible}
.rm-overlay[data-theme="sepia"]{--rm-bg:#f4ecd8;--rm-fg:#433422;--rm-mute:#7a6a55;--rm-line:#dccfae;--rm-bar:#ebe1c6;--rm-accent:#a2481b;--rm-quote:#ece1c4}
.rm-overlay[data-theme="dark"]{--rm-bg:#121316;--rm-fg:#dcdde1;--rm-mute:#8c8f99;--rm-line:#2a2c33;--rm-bar:#1a1c21;--rm-accent:#ff7a5c;--rm-quote:#1c1e24}
.rm-overlay[data-width="narrow"]{--rm-width:560px}
.rm-overlay[data-width="wide"]{--rm-width:820px}

/* نوار پیشرفت */
.rm-progress{position:absolute;top:0;inset-inline:0;height:3px;background:transparent;z-index:2}
.rm-progress-bar{height:100%;width:0;background:var(--rm-accent);transform-origin:right;transition:width .08s linear}

/* نوار ابزار */
.rm-bar{
  flex-shrink:0;display:flex;align-items:center;gap:8px;
  padding:calc(10px + env(safe-area-inset-top,0px)) 14px 10px;
  background:var(--rm-bar);border-bottom:1px solid var(--rm-line)
}
.rm-bar-title{flex:1;min-width:0;font-size:13px;font-weight:700;color:var(--rm-mute);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.rm-btn{
  flex-shrink:0;display:inline-flex;align-items:center;justify-content:center;gap:4px;
  min-width:38px;height:38px;padding:0 10px;border-radius:9px;
  background:transparent;color:var(--rm-fg);border:1px solid var(--rm-line);
  font-family:inherit;font-size:13px;font-weight:700;cursor:pointer;line-height:1
}
.rm-btn:hover{border-color:var(--rm-accent);color:var(--rm-accent)}
.rm-btn:focus-visible,.rm-opt:focus-visible,.rm-toc a:focus-visible{outline:2px solid var(--rm-accent);outline-offset:2px}
.rm-btn[disabled]{opacity:.35;cursor:default;pointer-events:none}
.rm-btn.rm-active{background:var(--rm-accent);border-color:var(--rm-accent);color:#fff}
.rm-btn svg{width:18px;height:18px}

/* پنل تنظیمات */
.rm-settings{
  flex-shrink:0;display:none;flex-wrap:wrap;gap:14px 22px;align-items:center;
  padding:12px 16px;background:var(--rm-bar);border-bottom:1px solid var(--rm-line);font-size:12.5px
}
.rm-settings.open{display:flex}
.rm-group{display:flex;align-items:center;gap:8px}
.rm-group-label{color:var(--rm-mute);font-weight:700}
.rm-opts{display:flex;gap:6px}
.rm-opt{
  min-width:36px;height:34px;padding:0 11px;border-radius:8px;cursor:pointer;
  background:transparent;color:var(--rm-fg);border:1px solid var(--rm-line);
  font-family:inherit;font-size:12.5px;font-weight:700
}
.rm-opt[aria-pressed="true"]{border-color:var(--rm-accent);color:var(--rm-accent);box-shadow:inset 0 0 0 1px var(--rm-accent)}
.rm-swatch{width:34px;padding:0;position:relative}
.rm-swatch[data-t="light"]{background:#fff}
.rm-swatch[data-t="sepia"]{background:#f4ecd8}
.rm-swatch[data-t="dark"]{background:#121316}

/* ناحیه‌ی اسکرول */
.rm-scroll{flex:1;overflow-y:auto;-webkit-overflow-scrolling:touch;overscroll-behavior:contain;scroll-behavior:smooth;
  padding:0 18px calc(60px + env(safe-area-inset-bottom,0px))}
.rm-page{max-width:var(--rm-width);margin:0 auto;padding-top:34px;transition:max-width .2s}
.rm-title{font-size:calc(var(--rm-size) * 1.6);line-height:1.5;font-weight:800;margin:0 0 10px}
.rm-meta{color:var(--rm-mute);font-size:13px;margin:0 0 26px;padding-bottom:18px;border-bottom:1px solid var(--rm-line)}

/* فهرست مطالب داخل خواننده */
.rm-toc{background:var(--rm-quote);border:1px solid var(--rm-line);border-radius:10px;padding:4px 14px;margin:0 0 28px;font-size:14px}
.rm-toc summary{cursor:pointer;font-weight:800;padding:10px 0;list-style:none}
.rm-toc summary::-webkit-details-marker{display:none}
.rm-toc summary::before{content:"▸ ";color:var(--rm-accent)}
.rm-toc[open] summary::before{content:"▾ "}
.rm-toc ol{list-style:none;margin:0;padding:0 0 10px}
.rm-toc li{margin:2px 0}
.rm-toc a{display:block;padding:5px 0;color:var(--rm-fg);text-decoration:none;opacity:.85}
.rm-toc a:hover{color:var(--rm-accent);opacity:1}
.rm-toc li.l3{padding-inline-start:16px;font-size:.93em}
.rm-toc li.l4{padding-inline-start:32px;font-size:.88em}

/* متن */
.rm-content{font-size:var(--rm-size);line-height:var(--rm-lh);word-wrap:break-word;overflow-wrap:anywhere;color:var(--rm-fg)}
.rm-content > *{max-width:100%}
.rm-content p{margin:0 0 1.15em}
.rm-content h1,.rm-content h2,.rm-content h3,.rm-content h4,.rm-content h5,.rm-content h6{
  font-weight:800;line-height:1.6;margin:1.8em 0 .6em;color:var(--rm-fg);scroll-margin-top:16px}
.rm-content h1{font-size:1.5em}.rm-content h2{font-size:1.35em}.rm-content h3{font-size:1.18em}.rm-content h4,.rm-content h5,.rm-content h6{font-size:1.05em}
.rm-content a{color:var(--rm-accent);text-decoration:underline;text-underline-offset:3px}
.rm-content img,.rm-content video{max-width:100%;height:auto;border-radius:10px;margin:1em auto;display:block}
.rm-content iframe{max-width:100%;border:0;border-radius:10px}
.rm-content ul,.rm-content ol{margin:0 0 1.15em;padding-inline-start:1.6em}
.rm-content li{margin:.3em 0}
.rm-content blockquote{margin:1.2em 0;padding:.6em 1.1em;background:var(--rm-quote);border-inline-start:4px solid var(--rm-accent);border-radius:8px;color:var(--rm-fg)}
.rm-content hr{border:0;border-top:1px solid var(--rm-line);margin:2em 0}
.rm-content pre,.rm-content code{direction:ltr;text-align:left;font-size:.85em;background:var(--rm-quote);border-radius:6px}
.rm-content code{padding:2px 6px}
.rm-content pre{padding:12px;overflow-x:auto;margin:0 0 1.15em}
.rm-content pre code{padding:0;background:none}
.rm-content .rm-table-wrap{overflow-x:auto;margin:1em 0;-webkit-overflow-scrolling:touch}
.rm-content table{border-collapse:collapse;width:100%;font-size:.88em}
.rm-content th,.rm-content td{border:1px solid var(--rm-line);padding:8px 10px;text-align:start}
.rm-content th{background:var(--rm-quote)}
/* استایل‌های inline ویرایشگر (رنگ/پس‌زمینه) خوانایی تم را خراب نکنند */
.rm-content [style*="color"]{color:inherit !important}
.rm-content [style*="background"]{background:transparent !important}
.rm-content [style*="font-size"]{font-size:inherit !important}
.rm-content [style*="width"]:not(img):not(iframe){max-width:100%}

.rm-end{text-align:center;color:var(--rm-mute);font-size:13px;margin-top:44px;padding-top:22px;border-top:1px solid var(--rm-line)}

/* قفل اسکرول صفحه‌ی زیرین */
html.rm-lock,html.rm-lock body{overflow:hidden !important}

@media (max-width:720px){
  .rm-page{padding-top:22px}
  .rm-settings{gap:10px 16px;padding:10px 12px}
  .rm-btn-label{display:none}
}
@media (prefers-reduced-motion:reduce){
  .rm-overlay,.rm-fab,.rm-progress-bar,.rm-page{transition:none}
  .rm-scroll{scroll-behavior:auto}
}
@media print{ .rm-trigger,.rm-fab{display:none !important} .rm-overlay.open{position:static;display:block;overflow:visible} .rm-bar,.rm-settings,.rm-progress{display:none} }
