@charset "UTF-8";
/* =====================================================================
   نظام المتابعة - ملف التنسيقات الوحيد
   أسلوب مستوحى من python.org: شريط علوي داكن، ترويسة بيضاء بشعار وبحث، شريط تنقل أزرق،
   أزرار مستديرة زرقاء/صفراء، عناوين بخط أصفر، جداول مسطحة، تذييل داكن.

   الترتيب:  1 المتغيرات  2 الخطوط  3 الأساس  4 الهيكل (ترويسة/تنقل/تذييل)  5 المكونات
             6 الأدوات المساعدة  7 قشرة النافذة الواحدة  8 الصفحات (pg-*)  9 الطباعة  10 الهاتف
   كل صفحة تلتف بحاوية  <div class="pg pg-اسم">  وقواعدها مقيّدة بها حتى لا تتسرب إلى
   غيرها (الصفحات تتبدّل داخل #app دون إعادة تحميل).
   ===================================================================== */

/* ---------- 1) المتغيرات ---------- */
:root {
	--blue: #3776ab;          /* أزرق بايثون */
	--blue-dark: #306998;
	--blue-deep: #2b5b84;
	--yellow: #ffd43b;
	--yellow-dark: #e6bb1f;
	--ink: #444;
	--ink-strong: #222;
	--muted: #777;
	--line: #ddd;
	--soft: #f6f6f6;
	--paper: #fff;
	--danger: #c0392b;
	--ok: #2e8b57;
	--warn: #e08a00;
	--radius: 6px;
	--ui: Dubai, "Segoe UI", Tahoma, Arial, sans-serif;
	--text: amiri, "Traditional Arabic", "Times New Roman", serif;
	--wrap: 1100px;
}

/* ---------- 2) الخطوط ---------- */
@font-face { font-family: Dubai; src: url('fonts/dubai.ttf'); }
@font-face { font-family: amiri; src: url('fonts/amiri.ttf'); }

/* ---------- 3) الأساس ---------- */
* { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; }
body {
	margin: 0;
	font-family: var(--ui);
	font-size: 16px;
	line-height: 1.55;
	color: var(--ink);
	background: var(--paper);
}
a { color: var(--blue); text-decoration: none; }
a:hover { color: var(--blue-dark); text-decoration: underline; }
img { max-width: 100%; }
h1, h2, h3, h4 { color: var(--ink-strong); font-family: var(--ui); line-height: 1.3; }
h3 { margin: 0 0 14px; font-size: 1.45em; }
h4 { margin: 18px 0 8px; font-size: 1.1em; }
hr { border: 0; border-top: 1px solid var(--line); }
code { padding: 1px 5px; background: #f1f1f1; border-radius: 3px; font-size: 0.9em; }
mark { background: #fff3a0; padding: 0 1px; }
label { display: inline-block; margin: 6px 0; font-weight: 600; vertical-align: top; }

input, select, textarea {
	font-family: var(--ui);
	font-size: 0.95em;
	color: var(--ink-strong);
	padding: 7px 9px;
	background: #fff;
	border: 1px solid #c8c8c8;
	border-radius: 5px;
}
input:focus, select:focus, textarea:focus { outline: 2px solid rgba(55, 118, 171, 0.35); border-color: var(--blue); }
input[type=checkbox], input[type=radio] { padding: 0; }
textarea { width: 100%; max-width: 100%; }

/* الجداول: مسطحة، رأس رمادي بخط أزرق سفلي، تظليل متناوب */
table { width: 100%; border-collapse: collapse; background: var(--paper); border: 1px solid var(--line); font-size: 0.97em; }
th { padding: 10px 12px; text-align: right; font-weight: 700; color: var(--ink-strong); background: #eee; border-bottom: 2px solid var(--blue); }
td { padding: 9px 12px; text-align: right; vertical-align: middle; border-top: 1px solid #eee; }
tr:nth-child(even) > td { background: #fafafa; }
tr:hover > td { background: #f1f6fb; }
tr:target { outline: 2px solid var(--blue); }
td.selected { background: #fff3a0 !important; }

/* جدول داخل نص الرسالة (لصق من Word/Excel) */
.innertbl { width: auto; white-space: nowrap; background: #f2f2f2; font-family: arial; border: 1px solid #999; }
.innertbl tr:nth-child(even) > td { background: #fefefe; }
.innertbl td { padding: 2px 6px; border: 1px solid #999; }

/* ---------- 4) الهيكل: ترويسة وتنقل وتذييل ---------- */
.wrap { max-width: var(--wrap); margin: 0 auto; padding: 0 16px; }

#util { background: #222; color: #ccc; font-size: 0.85em; }
#util .wrap { display: flex; justify-content: space-between; align-items: center; min-height: 36px; }
#util a { color: #fff; }
#util .util-user a { margin-right: 10px; padding: 2px 10px; border: 1px solid #666; border-radius: 12px; }
#util .util-user a:hover { background: var(--yellow); border-color: var(--yellow); color: #222; text-decoration: none; }

#site-header { background: var(--paper); border-bottom: 1px solid var(--line); }
#site-header .wrap { display: flex; justify-content: space-between; align-items: center; gap: 20px; padding-top: 14px; padding-bottom: 14px; }
.brand { display: flex; align-items: center; gap: 12px; color: var(--ink-strong); }
.brand:hover { text-decoration: none; color: var(--ink-strong); }
.brand .logo { width: 42px; height: 42px; border-radius: 10px; background: linear-gradient(135deg, var(--blue) 50%, var(--yellow) 50%); box-shadow: inset 0 0 0 2px rgba(255, 255, 255, 0.35); }
.brand-name { display: flex; flex-direction: column; font-size: 1.55em; font-weight: 700; line-height: 1.1; }
.brand-name small { font-size: 0.5em; font-weight: 400; color: var(--muted); letter-spacing: 1px; }

.header-search { display: flex; max-width: 320px; flex: 1; }
.header-search input { flex: 1; min-width: 0; border-radius: 0 20px 20px 0; border-left: 0; }
.header-search .go { padding: 0 14px; cursor: pointer; color: #fff; background: var(--blue); border: 1px solid var(--blue-dark); border-radius: 20px 0 0 20px; }
.header-search .go:hover { background: var(--blue-dark); }

#mainnav { background: var(--blue); }
#mainnav ul { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; }
#mainnav li { position: relative; }
#mainnav li > a { display: block; padding: 12px 18px; font-weight: 600; color: #fff; border-bottom: 4px solid transparent; }
#mainnav li > a:hover, #mainnav li > a.active { background: var(--blue-dark); border-bottom-color: var(--yellow); text-decoration: none; color: #fff; }
#mainnav .badge { margin-right: 4px; }
#mainnav .sub { display: none; position: absolute; top: 100%; right: 0; z-index: 30; min-width: 210px; flex-direction: column; background: #fff; border: 1px solid var(--line); border-top: 4px solid var(--yellow); box-shadow: 0 6px 16px rgba(0, 0, 0, 0.18); }
#mainnav .has-sub:hover > .sub, #mainnav .has-sub:focus-within > .sub { display: flex; }
#mainnav .sub a { display: block; padding: 9px 16px; color: var(--ink); border-bottom: 1px solid #eee; font-weight: 400; }
#mainnav .sub a:hover { background: #f1f6fb; color: var(--blue-dark); text-decoration: none; }
#navtoggle, .navburger { display: none; }

#footer { margin-top: 40px; color: #aaa; background: #222; font-size: 0.85em; }
#footer .wrap { padding-top: 22px; padding-bottom: 22px; display: flex; justify-content: space-between; gap: 12px; flex-wrap: wrap; border-top: 4px solid var(--blue); }
#footer b { color: #fff; }
#footer a { color: var(--yellow); }

/* ---------- 5) المكونات ---------- */
/* الأزرار: مستديرة، زرقاء؛ .alt صفراء للإجراء الرئيسي */
.button, input[type=submit], input[type=button], button.button {
	display: inline-block;
	padding: 7px 18px;
	font-family: var(--ui);
	font-size: 0.95em;
	font-weight: 700;
	line-height: 1.3;
	color: #fff;
	background: var(--blue);
	border: 1px solid var(--blue-dark);
	border-radius: var(--radius);
	cursor: pointer;
	vertical-align: middle;
}
.button:hover, input[type=submit]:hover, input[type=button]:hover { color: #fff; background: var(--blue-dark); text-decoration: none; }
.button.alt, .add-reply, .new-topic-btn { color: #222; background: var(--yellow); border-color: var(--yellow-dark); }
.button.alt:hover, .add-reply:hover, .new-topic-btn:hover { color: #222; background: var(--yellow-dark); }
.button.danger, input.danger { color: #fff; background: var(--danger); border-color: #a02d22; }
.button[disabled], input[disabled] { opacity: 0.55; cursor: progress; }
.button img { vertical-align: middle; }

.message { font-family: var(--text); font-size: 1.2em; line-height: 1.8; color: #000; text-align: right; }
.author { width: 150px; vertical-align: top; font-size: 0.9em; color: var(--muted); }
.updatedate { float: left; direction: rtl; font-size: 0.85em; color: var(--muted); }
.topics { text-align: right; font-size: 1.05em; }
.crmp { font-size: 1.1em; font-weight: 700; float: right; }

/* رسائل التنبيه */
.flash { margin: 10px 0; padding: 10px 14px; font-family: var(--ui); font-size: 0.95em; color: #5c4b00; background: #fff7d6; border: 1px solid #f0dc82; border-radius: var(--radius); }
.flash-ok { color: #1d5c34; background: #e8f5ec; border-color: #a9d7b6; }
.flash-err { color: #8a1f1f; background: #fdeaea; border-color: #e6b0b0; }
.flash[hidden] { display: none; }

/* صفحات الأخطاء */
.errbox { max-width: 560px; margin: 40px auto; padding: 24px; text-align: center; background: var(--paper); border: 1px solid var(--line); border-top: 5px solid var(--yellow); border-radius: var(--radius); }
.errbox h2 { margin-top: 0; }
.errbox .button { margin: 4px; }

/* ترقيم الصفحات (Laravel) */
.pages ul { padding: 0; margin: 14px 0; text-align: center; }
.pages li { display: inline-block; margin: 2px; list-style: none; }
.pages li a, .pages li span { display: block; min-width: 34px; padding: 5px 10px; border: 1px solid var(--line); border-radius: var(--radius); }
.pages li.active span { color: #222; background: var(--yellow); border-color: var(--yellow-dark); font-weight: 700; }

/* الحالة والشارات */
.st { display: inline-block; padding: 1px 10px; font-size: 0.82em; font-weight: 700; color: #fff; background: #777; border-radius: 12px; white-space: nowrap; }
.st-open { background: var(--blue); }
.st-progress { background: var(--warn); }
.st-done { background: var(--ok); }
.late { color: var(--danger); font-weight: 700; }
.badge { display: inline-block; min-width: 1.5em; padding: 0 6px; font-size: 0.78em; font-weight: 700; line-height: 1.5; text-align: center; color: #222; background: var(--yellow); border-radius: 10px; }
.badge:empty { display: none; }
.badge-late { color: #fff; background: var(--danger); }
.new-dot { display: inline-block; width: 9px; height: 9px; margin: 0 6px; background: var(--blue); border-radius: 50%; }
.unread { font-weight: 700; }
.follow-bar { margin-top: 8px; font-size: 0.9em; font-weight: 400; color: var(--muted); }
.follow-bar b { margin: 0 3px; color: var(--ink); }
.follow-bar a { margin-right: 10px; }

/* رأس الصفحة: عنوان بخط أصفر + أدوات */
.page-head { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: flex-end; gap: 10px; margin-bottom: 16px; padding-bottom: 10px; border-bottom: 1px solid var(--line); }
.page-head h3 { margin: 0; padding-bottom: 6px; border-bottom: 4px solid var(--yellow); }
.page-tools { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; }
.crumbs { font-size: 0.9em; color: var(--muted); margin-bottom: 4px; }

/* ---------- 6) أدوات مساعدة ---------- */
.fr { float: right; }
.fl { float: left; }
.ta-r { text-align: right; }
.f11 { font-size: 1.1em; }
.f12 { font-size: 1.2em; }
.f2 { font-size: 2em; }
.w10 { width: 10%; } .w12 { width: 12%; } .w40 { width: 40%; } .w70 { width: 70%; }
.w80 { width: 80%; } .w90 { width: 90%; } .w100 { width: 100%; }
.hidden { display: none; }
.plain { border: none; background: transparent; }
.inline { display: inline; }
.danger { color: var(--danger); }
.c-silver { color: #aaa; }
.corner-tl, .corner-tr { margin: 0 0 10px; }
.in-num { width: 110px; }
.filter-in { min-width: 220px; }
.btn-green { padding: 3px 12px; color: #fff; background: var(--ok); border-radius: var(--radius); }
.smile-btn { font-size: 1.4em; background: transparent; border: 0; cursor: pointer; }

/* منتقي الأيقونات */
.ikonz { overflow: auto; height: 360px; width: 230px; float: left; padding: 6px; background: var(--soft); border: 1px solid var(--line); border-radius: var(--radius); }
.ikonz img { cursor: pointer; }

/* مساحات التحرير بعرض ورقة A4 */
.w-a4 { width: 100%; max-width: 21cm; }
.area-a4 { width: 100%; max-width: 21cm; height: 400px; resize: vertical; overflow: auto; }

/* ---------- 7) قشرة النافذة الواحدة ---------- */
#app { max-width: var(--wrap); margin: 0 auto; padding: 24px 16px 8px; min-height: 55vh; text-align: right; }
.pg { text-align: right; }
.busy, .busy * { cursor: progress; }
.busy #app { opacity: 0.55; }
#login-page { max-width: 420px; margin: 0 auto; padding: 40px 16px; min-height: 55vh; }

/* نافذة منبثقة (data-modal) */
.modal { position: fixed; inset: 0; z-index: 100; display: flex; align-items: center; justify-content: center; background: rgba(20, 30, 40, 0.55); }
.modal[hidden] { display: none; }
.modal-box { position: relative; max-width: 92vw; max-height: 88vh; overflow: auto; padding: 0 0 18px; background: var(--paper); border-top: 5px solid var(--yellow); border-radius: var(--radius); box-shadow: 0 10px 30px rgba(0, 0, 0, 0.4); text-align: right; }
.modal-title { padding: 14px 20px 10px 52px; font-size: 1.15em; font-weight: 700; color: #fff; background: var(--blue); }
.modal-title:empty { display: none; }
.modal-x { position: absolute; top: 8px; left: 10px; width: 32px; height: 32px; padding: 0; font-size: 1.1em; color: #fff; background: transparent; border: 0; border-radius: 50%; cursor: pointer; }
.modal-x:hover { background: rgba(0, 0, 0, 0.25); }
.modal-title:empty + #modal-body, #modal-body { padding: 16px 20px 0; }
.modal-title:empty ~ #modal-body { padding-top: 34px; }
.modal-box table { border: 0; }
.modal-box .corner-tl, .modal-box .corner-tr { position: static; }

/* ---------- 8) الصفحات ---------- */
/* --- الدخول --- */
.login { padding: 26px 24px; text-align: center; background: var(--paper); border: 1px solid var(--line); border-top: 5px solid var(--yellow); border-radius: var(--radius); box-shadow: 0 4px 14px rgba(0, 0, 0, 0.08); }
.login input[type=text], .login input[type=password] { width: 100%; padding: 10px; font-size: 1.05em; text-align: center; direction: ltr; }
.login br { display: none; }
.login input[type=text] { margin-bottom: 12px; }
.login input[type=submit] { width: 100%; margin-top: 14px; padding: 10px; }

/* --- الرئيسية: الأقسام --- */
.pg-cats-index table { border: 1px solid var(--line); }
.pg-cats-index td { padding: 11px 14px; font-weight: 600; }
.pg-cats-index td a { color: var(--ink-strong); }
.pg-cats-index td a:hover { color: var(--blue); }
.pg-cats-index .cat-actions { width: 1%; white-space: nowrap; text-align: center; }
.pg-cats-index .cat-actions a { margin: 0 6px; font-size: 1.15em; }
.pg-cats-index .cat-desc { color: var(--muted); font-weight: 400; font-size: 0.92em; }
.pg-cats-index .folder { margin-left: 8px; vertical-align: middle; }
.pg-cats-index .scroll-list { max-height: none; }

.pg-cats-closed table { margin-top: 10px; }
.pg-cats-edit form { padding: 14px; background: var(--soft); border: 1px solid var(--line); border-radius: var(--radius); }
.pg-cats-edit input[type=text], .pg-cats-edit textarea { width: 100%; margin: 4px 0 10px; }
.pg-cats-new input[type=text] { width: 100%; margin: 4px 0 10px; }

/* --- المواضيع --- */
.pg-topics .topic-search { display: inline-flex; gap: 6px; }
.pg-topics .fu small { color: var(--muted); }
.pg-topics .author, .pg-topics td.tools { width: 1%; white-space: nowrap; }
.pg-topics td.tools { text-align: center; }
.pg-topics td.tools a { margin: 0 5px; }
.pg-topics tr:hover > td { background: #f1f6fb; }

.pg-topic-show .show-head { margin-bottom: 14px; padding: 14px 18px; background: var(--soft); border: 1px solid var(--line); border-right: 5px solid var(--yellow); border-radius: var(--radius); }
.pg-topic-show .show-head h3 { margin: 0 0 4px; }
.pg-topic-show table.posts { border: 0; background: transparent; }
.pg-topic-show table.posts > tbody > tr > td, .pg-topic-show table.posts > tr > td { border: 1px solid var(--line); background: #fff !important; }
.pg-topic-show table.posts td.author { width: 160px; text-align: center; background: var(--soft) !important; }
.pg-topic-show table.posts tr { box-shadow: 0 1px 2px rgba(0, 0, 0, 0.05); }
.pg-topic-show .mystyle { font-size: 1.15em; }
.pg-topic-show .toolz { margin-top: 6px; font-size: 0.85em; }
.pg-topic-show .toolz a { display: inline-block; padding: 1px 6px; }
.pg-topic-show .profile { display: block; width: 90px; height: 90px; margin: 8px auto 0; object-fit: cover; border-radius: 50%; }
.pg-topic-show .add-reply { margin-top: 12px; }
.pg-topic-show .export-bar { margin: 14px 0 0; }

.pg-topic-new table, .pg-topic-new td, .pg-topic-edit table, .pg-topic-edit td { border: 0; background: transparent !important; }
.pg-topic-new input[type=text], .pg-topic-edit input[type=text] { width: 60%; min-width: 260px; }
.pg-topic-protected form { display: inline-flex; gap: 8px; align-items: center; margin: 14px 0; }
.pg-topic-protected .lock-go { font-size: 1.4em; color: #222; background: var(--yellow); border: 1px solid var(--yellow-dark); border-radius: var(--radius); cursor: pointer; }

/* نموذج الموضوع: المحرر يمينا ومنتقي الأيقونات يسارا */
.pg-topic-new, .pg-topic-edit { display: flex; flex-wrap: wrap; gap: 16px; align-items: flex-start; }
.pg-topic-new > .corner-tr, .pg-topic-edit > a.button, .pg-topic-edit > .fr { flex-basis: 100%; }
.pg-topic-new form, .pg-topic-edit form { order: 1; flex: 1 1 520px; min-width: 0; }
.pg-topic-new .ikonz, .pg-topic-edit .ikonz { order: 2; float: none; flex: 0 0 230px; }
.pg-topic-new table, .pg-topic-edit table { max-width: 100%; }
.pg-topic-new .w-a4, .pg-topic-edit .w-a4 { width: 100%; max-width: none; }
.pg-topic-posts table { margin-top: 8px; }

/* --- الردود --- */
.pg-reply-new table, .pg-reply-new td, .pg-reply-edit table, .pg-reply-edit td { border: 0; background: transparent !important; }
.pg-reply-new .ikonz, .pg-reply-edit .ikonz { position: absolute; top: 120px; left: 16px; height: 400px; width: 190px; z-index: 5; }

/* --- الاستمارات --- */
.pg-estim-index td { font-size: 1.02em; }
.pg-estim-index .rght { text-align: right; }
.pg-estim-data .estm { margin: 10px 0; font-size: 1.2em; font-weight: 700; }
.pg-estim-edit input[type=text], .pg-estim-edit textarea { width: 100%; margin: 4px 0 10px; }
.pg-estim-edit textarea { direction: ltr; text-align: left; font-family: monospace; }
.pg-estim-edit table { border: 0; }
.pg-estim-edit td { background: transparent !important; border: 0; }

.pg-estim-fill .bar, .pg-estim-builder .bar { padding: 8px 12px; color: #fff; background: var(--blue); }
.pg-estim-fill .buttonx, .pg-estim-builder .buttonx { padding: 0 8px; color: #fff; background: rgba(0, 0, 0, 0.25); border-radius: 4px; }
.pg-estim-fill table { width: auto; max-width: 100%; min-width: 420px; }
.pg-estim-fill td, .pg-estim-builder td { background: #fff !important; }
.pg-estim-fill textarea { min-height: 110px; max-height: 200px; }
.pg-estim-fill input[type=text], .pg-estim-fill input[type=number], .pg-estim-fill input[type=date] { margin: 4px 0; }
.pg-estim-builder table { width: auto; min-width: 380px; }
.pg-estim-builder input { margin: 3px; }

/* --- التذكيرات --- */
.pg-nc-index .nc-title { margin: 6px 0 12px; font-size: 1.25em; font-weight: 700; }
.pg-nc-index .nc-side { width: 28%; vertical-align: top; background: var(--soft) !important; }
.pg-nc-index .nc-main { vertical-align: top; }
.pg-nc-index .tag { padding: 3px 10px; color: #fff; background: var(--ok); border-radius: 10px; }
.pg-nc-index .azf { color: var(--danger); font-weight: 700; }
.pg-nc-index td { vertical-align: top; }
.pg-nc-index hr.soft { margin: 12px 0; }
.pg-nc-edit input[type=text], .pg-nc-new input[type=text] { width: 100%; margin: 4px 0 10px; }
.pg-notes-all .filter-in { margin-bottom: 10px; }
.pg-note-edit input, .pg-note-edit label { margin: 6px 0; }
.pg-note-new input[type=text], .pg-note-new textarea, .pg-note-new select { width: 100%; margin: 4px 0 10px; }
.pg-note-new .note-area { min-height: 110px; max-height: 220px; }
.pg-note-show { width: 100%; }
.pg-note-show .note-due { float: left; padding: 2px 10px; color: #fff; background: var(--danger); border-radius: 10px; }
.pg-note-show .note-del { margin-top: 14px; }
.pg-note-show .del-link { color: var(--danger); }

/* --- الرسائل الخاصة --- */
.pg-pm-index .pm-bar { display: flex; flex-wrap: wrap; gap: 8px; margin: 0 0 14px; }
.pg-pm-new textarea, .pg-pm-new table { width: 100%; min-width: 0; }
.pg-pm-new table { border: 0; }
.pg-pm-new td { background: transparent !important; border: 0; }
.pg-pm-new .pm-area { min-height: 180px; max-height: 320px; }

/* --- المستخدمون --- */
.pg-users .users-table { margin-top: 6px; }
.pg-users #box { margin-top: 12px; }
.pg-users-new table, .pg-users-new td, .pg-users-cats table { border: 0; }
.pg-users-new td { background: transparent !important; }
.pg-users-new input[type=text], .pg-users-edit input[type=text] { width: 100%; margin: 4px 0; }
.pg-users-edit table, .pg-users-edit td { border: 0; background: transparent !important; }
.pg-users-cats th { background: #eee; }

/* --- أدوات المدير والصفحات الحديثة --- */
.pg-audit form { display: flex; flex-wrap: wrap; align-items: center; gap: 6px; margin: 8px 0 14px; padding: 12px; background: var(--soft); border: 1px solid var(--line); border-radius: var(--radius); }
.pg-audit td, .pg-audit th { font-size: 0.92em; padding: 6px 10px; }
.pg-audit .a-login_fail, .pg-audit .a-unlock_fail { color: var(--danger); }
.pg-audit .a-topic_delete, .pg-audit .a-reply_delete, .pg-audit .a-purge { color: var(--danger); font-weight: 700; }

.pg-history .rev { margin: 10px 0; padding: 12px 16px; background: var(--paper); border: 1px solid var(--line); border-right: 4px solid var(--blue); border-radius: var(--radius); }
.pg-history .meta { margin-bottom: 6px; font-size: 0.9em; color: var(--muted); }

.pg-fm { display: flex; gap: 16px; align-items: flex-start; }
.pg-fm .list { width: 32%; max-height: 560px; overflow: auto; padding: 8px; background: var(--soft); border: 1px solid var(--line); border-radius: var(--radius); }
.pg-fm .view { flex: 1; }
.pg-fm a { display: block; margin: 3px 0; padding: 4px 10px; color: var(--ink); background: #fff; border: 1px solid var(--line); border-radius: 5px; }
.pg-fm a:hover { border-color: var(--blue); text-decoration: none; }
.pg-fm a.sel { color: #222; background: var(--yellow); border-color: var(--yellow-dark); }
.pg-fm img.prev { max-width: 100%; max-height: 480px; }

.pg-drafts .drafts-layout { display: flex; gap: 16px; align-items: flex-start; }
.pg-drafts .menu { width: 24%; padding: 10px; background: var(--soft); border: 1px solid var(--line); border-radius: var(--radius); }
.pg-drafts .menu .row { display: flex; justify-content: space-between; gap: 6px; margin: 6px 0; }
.pg-drafts .ed { flex: 1; }
.pg-drafts .ed input[type=text] { width: 60%; margin-bottom: 8px; }
.pg-drafts .editor-area { height: 420px; }
.pg-drafts .sharebox { margin: 8px 0; padding: 8px 12px; direction: ltr; word-break: break-all; background: #e8f5ec; border: 1px solid #a9d7b6; border-radius: var(--radius); }

.pg-follow .follow-filter { display: flex; gap: 8px; align-items: center; margin: 0 0 14px; }
.pg-follow-form td { padding: 8px 12px; }
.pg-follow-form table { border: 0; }

.pg-search .search-form { padding: 14px; background: var(--soft); border: 1px solid var(--line); border-radius: var(--radius); }
.pg-search .search-q { width: 70%; padding: 9px; font-size: 1.1em; }
.pg-search .search-more { margin-top: 10px; }
.pg-search .search-more select, .pg-search .search-more input { margin: 3px 4px; }
.pg-search .search-count { margin: 16px 0 6px; color: var(--muted); }
.pg-search .hit { margin: 10px 0; padding: 12px 16px; background: var(--paper); border: 1px solid var(--line); border-right: 4px solid var(--blue); border-radius: var(--radius); }
.pg-search .hit-title { font-size: 1.15em; font-weight: 700; }
.pg-search .hit-meta { margin: 3px 0; font-size: 0.85em; color: var(--muted); }
.pg-search .hit-text { font-family: var(--text); font-size: 1.1em; line-height: 1.7; }

.pg-backups .bk-note, .pg-backups .bk-help { line-height: 1.9; }
.pg-backups .bk-help { margin-top: 16px; padding: 12px 16px; background: var(--soft); border: 1px dashed #bbb; border-radius: var(--radius); }
.pg-backups .bk-run { margin: 12px 0; }
.backup-link { text-decoration: underline; }

.pg-access .acc-note { line-height: 1.9; color: var(--muted); }
.pg-access .acc-form, .pg-groups .acc-form { margin: 0; }
.pg-access .acc-add, .pg-groups .acc-add { margin: 10px 0 18px; }
.pg-access .acc-add select, .pg-groups .acc-add select, .pg-groups .acc-add input[type=text] { margin: 0 3px; }

.export-bar { margin: 10px 0; }
.export-bar .button { margin: 0 4px; background: #fff; color: var(--blue); }
.export-bar .button:hover { background: var(--soft); color: var(--blue-dark); }

/* صفحة المشاركة العامة للمسودة + صفحة التصدير المطبوعة (صفحتان مستقلتان) */
body.shared, body.doc { background: #eee; font-family: var(--text); font-size: 1.15em; }
body.shared .A4 { width: 21cm; max-width: 94%; min-height: 29.7cm; margin: 14px auto; padding: 2cm; text-align: right; background: #fff; box-shadow: 0 0 6px #999; }
body.shared table { width: auto; }
.doc-bar { padding: 10px; text-align: center; background: #222; }
.doc-bar .button { margin: 0 4px; }
.doc-page { width: 21cm; max-width: 96%; min-height: 29.7cm; margin: 14px auto; padding: 1.8cm; background: #fff; box-shadow: 0 0 6px #999; }
.doc-head { margin-bottom: 14px; padding-bottom: 10px; text-align: center; border-bottom: 4px solid var(--yellow); }
.doc-org { font-family: var(--ui); font-weight: 700; color: var(--blue); letter-spacing: 1px; }
.doc-head h1 { margin: 6px 0 10px; font-size: 1.5em; }
.doc-meta { margin: 0; font-size: 0.9em; }
.doc-meta td { padding: 4px 8px; border: 1px solid #ccc; }
.doc-meta td:nth-child(odd) { width: 18%; font-family: var(--ui); font-weight: 700; background: #f3f6fb !important; }
.doc-post { margin: 12px 0; padding-bottom: 8px; border-bottom: 1px dotted #aaa; page-break-inside: avoid; }
.doc-post-head { margin-bottom: 4px; font-family: var(--ui); font-size: 0.85em; color: #444; }
.doc-body { line-height: 1.8; text-align: right; }
.doc-body table { width: auto; }
.doc-att { margin-top: 4px; font-size: 0.85em; color: #555; }
.doc-foot { margin-top: 18px; font-size: 0.8em; color: #666; text-align: left; }

/* ---------- 9) الطباعة ---------- */
@media print {
	#util, #site-header, #mainnav, #footer, .modal, .export-bar, .doc-bar { display: none !important; }
	body, body.doc, body.shared { background: #fff; }
	#app { max-width: none; padding: 0; }
	.doc-page, body.shared .A4 { width: auto; max-width: none; min-height: 0; margin: 0; padding: 0; box-shadow: none; }
	table, td { box-shadow: none; }
	tr:hover > td { background: inherit; }
	.pg-estim-data .button, .pg-estim-data a,
	.pg-pm-archive .button, .pg-pm-archive a,
	.pg-topic-show .toolz, .pg-topic-show .crmp, .pg-topic-show .button, .pg-topic-show a { display: none; }
	.pg-estim-data table td:nth-child(1), .pg-topic-show table td:nth-child(1) { display: none; }
}

/* ---------- 10) الهاتف والشاشات الصغيرة ---------- */
@media (max-width: 760px) {
	#site-header .wrap { flex-direction: column; align-items: stretch; }
	.header-search { max-width: none; }
	.navburger { display: block; padding: 12px 16px; font-weight: 700; color: #fff; cursor: pointer; }
	#mainnav ul { display: none; flex-direction: column; }
	#navtoggle:checked ~ ul { display: flex; }
	#mainnav li > a { border-bottom: 1px solid rgba(255, 255, 255, 0.15); border-right: 0; }
	#mainnav .sub { position: static; display: flex; box-shadow: none; border: 0; border-top: 0; background: var(--blue-dark); }
	#mainnav .sub a { color: #fff; border-bottom-color: rgba(255, 255, 255, 0.12); }
	.page-head { align-items: stretch; flex-direction: column; }
	.pg-fm, .pg-drafts .drafts-layout { flex-direction: column; }
	.pg-fm .list, .pg-drafts .menu { width: 100%; }
	.pg-topic-show table.posts td.author { width: 90px; font-size: 0.8em; }
	.pg-topic-show .profile { width: 56px; }
	.pg-search .search-q { width: 100%; }
	.pg-reply-new .ikonz, .pg-reply-edit .ikonz { position: static; width: 100%; height: 200px; }
	.filter-in { min-width: 0; width: 100%; }
	table { font-size: 0.9em; }
	td, th { padding: 7px 8px; }
	.errbox { margin: 20px 8px; }
	.modal-box { max-width: 96vw; }
}