/*
  تم مشترک همه صفحات manual.parsianandroid.ir
  رنگ‌ها از برند سایت new.parsianandroid.ir (navy / blue / orange / paper)، فونت BenyaminNum.
  هر صفحه راهنما فقط همین فایل را لینک کند و از متغیرهای زیر استفاده کند؛ رنگ/فونت جدا تعریف نشود.
*/
@font-face {
  font-family: "BenyaminNum";
  src: url("fonts/BenyaminNum.ttf") format("truetype");
  font-weight: normal;
  font-style: normal;
  font-display: swap;
}

:root {
  --bg: #FAF9F6;          /* paper */
  --card: #FFFFFF;
  --ink: #0E1726;
  --sub: #677284;
  --line: #E4E1DA;
  --brand: #2B6CDF;       /* blue-600 */
  --brand-ink: #FFFFFF;
  --accent: #EE6B2D;      /* orange-500 */
  --chip: #EEF4FF;        /* blue-50 */
  --ok: #1F8A5B;
  --off: #D2CEC4;
  --warn: #D2581C;
  --yellow: #FFEFBE;
  --green: #C8EBC8;
  --radius: 14px;
  --shadow: 0 1px 2px rgba(7, 20, 38, .06), 0 8px 24px rgba(7, 20, 38, .06);
  --font: "BenyaminNum", Tahoma, "Segoe UI", sans-serif;
}

@media (prefers-color-scheme: dark) {
  :root {
    --bg: #071426; --card: #0B1F36; --ink: #E6ECF5; --sub: #A9B8CC; --line: #1E4470;
    --brand: #4C86F0; --brand-ink: #071426; --accent: #EE6B2D; --chip: #14304F;
    --ok: #4ADE80; --off: #3B4A63; --warn: #FBBF24; --yellow: #5B4B12; --green: #1F4D2B;
    --shadow: none;
  }
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body {
  margin: 0;
  background: var(--bg);
  color: var(--ink);
  font-family: var(--font);
  line-height: 1.9;
}
input, button, select, textarea { font-family: inherit; }
:focus-visible { outline: 2px solid var(--brand); outline-offset: 3px; border-radius: 4px; }

/* نوار برند بالای همه صفحه‌ها */
.site-bar {
  background: #0B1F36;
  color: #fff;
  border-bottom: 3px solid var(--accent);
}
.site-bar .in {
  max-width: 1040px; margin: 0 auto; padding: 10px 16px;
  display: flex; align-items: center; justify-content: space-between; gap: 12px;
}
.site-bar a { color: #fff; text-decoration: none; }
.site-bar .brand { font-weight: bold; font-size: 16px; }
.site-bar .brand b { color: var(--accent); }
.site-bar .links { display: flex; gap: 16px; font-size: 14px; }
.site-bar .links a { color: #A9C6FA; }
.site-bar .links a:hover { color: #fff; }

/* ───────── تصویر خودکار راهنماها (assets/guide.js) ─────────
   .shot = جایگاه تصویر؛ بدون JS همان متن توضیح در کادر خط‌چین دیده می‌شود. */
.shot { border: 2px dashed var(--line); border-radius: 10px; padding: 14px; margin: 12px 0; color: var(--sub); text-align: center; font-size: 13px; }
figure.shot { margin: 12px 0; padding: 0; border: 1px solid var(--line); background: var(--card); overflow: hidden; box-shadow: var(--shadow); color: var(--ink); }
.shot__btn { display: block; width: 100%; padding: 0; margin: 0; border: 0; background: none; cursor: zoom-in; }
.shot__btn img { display: block; width: 100%; max-width: 100%; height: auto; }   /* هیچ‌وقت از عرض صفحه بیرون نمی‌زند */
.shot__btn:hover img { opacity: .94; }
figure.shot figcaption { padding: 8px 14px; font-size: 13px; color: var(--sub); border-top: 1px solid var(--line); text-align: center; }

/* جای تصویر (وقتی عکسی در پوشهٔ img نیست): الگوی ریشهٔ manual */
.shot--empty {
  position: relative; display: grid; place-items: center; min-height: 260px; padding: 20px; overflow: hidden;
  border-style: solid; background: var(--chip) var(--shot-ph) center 30% / cover no-repeat;
}
.shot__cap { max-width: 520px; padding: 6px 16px; border: 1px solid var(--line); border-radius: 999px; background: color-mix(in srgb, var(--card) 92%, transparent); color: var(--sub); font-size: 13px; }

/* نمایش بزرگ */
.shot-lock { overflow: hidden; }
.shot-box { position: fixed; inset: 0; z-index: 1000; display: flex; flex-direction: column; background: rgba(7, 20, 38, .88); }
.shot-box[hidden] { display: none; }
.shot-box__stage { flex: 1; min-height: 0; display: grid; place-items: center; overflow: auto; padding: 16px; }
.shot-box__stage img { max-width: 96vw; max-height: calc(100vh - 110px); width: auto; height: auto; cursor: zoom-in; border-radius: 6px; background: #fff; box-shadow: 0 10px 40px rgba(0, 0, 0, .5); }
.shot-box.is-zoomed .shot-box__stage { place-items: start center; }
.shot-box.is-zoomed .shot-box__stage img { max-width: none; max-height: none; cursor: zoom-out; }
.shot-box__cap { margin: 0; padding: 8px 16px 14px; text-align: center; color: #E6ECF5; font-size: 14px; }
.shot-box__close { position: absolute; top: 10px; inset-inline-start: 14px; z-index: 1; width: 40px; height: 40px; border: 0; border-radius: 10px; background: rgba(255, 255, 255, .14); color: #fff; font-size: 26px; line-height: 1; cursor: pointer; }
.shot-box__close:hover { background: rgba(255, 255, 255, .26); }