/* ═══════════════════════════════════════════════════
   نَقدر — محرّر النصوص الغني
   ═══════════════════════════════════════════════════ */

.rich{border:1px solid var(--line);border-radius:14px;background:var(--surface);overflow:hidden}
.rich:focus-within{border-color:var(--amber);box-shadow:0 0 0 3px rgba(245,166,30,.14)}

/* ---------- شريط الأزرار ---------- */
.rich-bar{
  display:flex;flex-wrap:wrap;align-items:center;gap:2px;
  padding:7px 8px;background:var(--paper);border-bottom:1px solid var(--line);
  position:sticky;top:0;z-index:5;
}
.rich-btn{
  min-width:33px;height:33px;padding:0 8px;border:1px solid transparent;border-radius:8px;
  background:transparent;cursor:pointer;font-family:inherit;font-size:13.5px;font-weight:700;
  color:var(--ink-soft);display:inline-flex;align-items:center;justify-content:center;
  transition:.13s;line-height:1;
}
.rich-btn:hover{background:#fff;border-color:var(--line);color:var(--ink)}
.rich-btn.on{background:var(--steel-deep);border-color:var(--steel-deep);color:#fff}
.rich-btn b,.rich-btn i,.rich-btn u,.rich-btn s{font-style:inherit;font-weight:inherit}
.rich-btn b{font-weight:900}
.rich-btn i{font-style:italic}
.rich-sep{width:1px;height:20px;background:var(--line);margin:0 5px}

/* ---------- منطقة الكتابة ---------- */
.rich-area{
  min-height:230px;max-height:640px;overflow-y:auto;padding:16px 18px;
  font-size:15.5px;line-height:2;color:var(--ink);outline:0;background:var(--surface);
}
.rich-area:empty::before,
.rich-area > p:only-child:empty::before{content:attr(data-ph);color:var(--ink-mute)}

/* تنسيقات المحتوى جوّه المحرّر */
.rich-area h2{font-size:22px;font-weight:900;margin:18px 0 10px;color:var(--ink);line-height:1.4}
.rich-area h3{font-size:18px;font-weight:800;margin:16px 0 8px;color:var(--ink);line-height:1.45}
.rich-area p{margin:0 0 12px}
.rich-area ul,.rich-area ol{margin:0 0 12px;padding-inline-start:26px}
.rich-area li{margin-bottom:6px}
.rich-area a{color:var(--steel);text-decoration:underline;font-weight:600}
.rich-area blockquote{
  margin:14px 0;padding:12px 16px;border-inline-start:3px solid var(--amber);
  background:var(--paper);border-radius:0 10px 10px 0;color:var(--ink-soft);font-size:15px;
}
.rich-area hr{border:0;border-top:1px solid var(--line);margin:18px 0}
.rich-area img{max-width:100%;height:auto;border-radius:10px;display:block}
.rich-area figure{margin:16px 0}
.rich-area figcaption{
  font-size:12.5px;color:var(--ink-mute);text-align:center;margin-top:7px;
  min-height:1.2em;outline:0;
}
.rich-area figcaption:empty::before{content:"اكتب وصف الصورة (اختياري)";color:var(--line-2)}
.rich-area table{width:100%;border-collapse:collapse;margin:14px 0;font-size:14px}
.rich-area th,.rich-area td{border:1px solid var(--line);padding:9px 11px;text-align:start}
.rich-area th{background:var(--paper);font-weight:800}

/* ---------- وضع الكود ---------- */
.rich-src{
  width:100%;border:0;outline:0;padding:16px 18px;resize:vertical;
  font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:13px;line-height:1.8;
  direction:ltr;text-align:left;background:#0E1E38;color:#C8D8F0;
}

/* ---------- التذييل ---------- */
.rich-foot{
  padding:7px 14px;border-top:1px solid var(--line);background:var(--paper);
  font-size:11.5px;color:var(--ink-mute);min-height:29px;
}

@media (max-width:760px){
  .rich-bar{padding:6px;gap:1px}
  .rich-btn{min-width:31px;height:31px;padding:0 6px;font-size:12.5px}
  .rich-sep{margin:0 3px;height:17px}
  .rich-area{min-height:190px;padding:13px 14px;font-size:15px}
}

/* ═══════════════════════════════════════════════════
   عرض المحتوى الغني في الصفحات العامة
   ═══════════════════════════════════════════════════ */
.rte{font-size:16px;line-height:2.05;color:var(--ink-soft)}
.rte > *:first-child{margin-top:0}
.rte h2{font-size:clamp(20px,3vw,26px);font-weight:900;color:var(--ink);margin:32px 0 12px;line-height:1.4}
.rte h3{font-size:clamp(17px,2.4vw,21px);font-weight:800;color:var(--ink);margin:26px 0 10px;line-height:1.45}
.rte p{margin:0 0 16px}
.rte ul,.rte ol{margin:0 0 18px;padding-inline-start:24px}
.rte li{margin-bottom:9px}
.rte a{color:var(--steel);font-weight:700;text-decoration:underline;text-underline-offset:3px}
.rte a:hover{color:var(--amber-d)}
.rte strong,.rte b{font-weight:800;color:var(--ink)}
.rte blockquote{
  margin:22px 0;padding:16px 20px;border-inline-start:4px solid var(--amber);
  background:var(--paper);border-radius:0 12px 12px 0;font-size:15.5px;color:var(--ink-soft);
}
.rte blockquote p:last-child{margin-bottom:0}
.rte hr{border:0;border-top:1px solid var(--line);margin:28px 0}
.rte img{max-width:100%;height:auto;border-radius:14px;display:block;margin:0 auto}
.rte figure{margin:26px 0}
.rte figcaption{font-size:13px;color:var(--ink-mute);text-align:center;margin-top:9px}
.rte table{width:100%;border-collapse:collapse;margin:22px 0;font-size:14.5px;
  display:block;overflow-x:auto;white-space:nowrap}
.rte th,.rte td{border:1px solid var(--line);padding:11px 13px;text-align:start}
.rte th{background:var(--paper);font-weight:800;color:var(--ink)}
.rte code{background:var(--paper);border:1px solid var(--line);border-radius:6px;
  padding:2px 6px;font-size:13.5px;font-family:ui-monospace,monospace;direction:ltr;display:inline-block}
.rte pre{background:#0E1E38;color:#C8D8F0;padding:16px;border-radius:12px;overflow-x:auto;
  direction:ltr;text-align:left;font-size:13.5px;line-height:1.8;margin:20px 0}
.rte pre code{background:transparent;border:0;padding:0;color:inherit}

@media (max-width:760px){
  .rte{font-size:15.5px;line-height:1.95}
  .rte table{font-size:13px}
}
