/* واجهة النظام — هوية السكن الجماعي */
:root{
  --plum:#241038; --plum-2:#3a2752; --violet:#7600ff; --lime:#d6ff5c; --lavender:#ede3ff;
  --cream:#f9f5f2; --sand:#f1ece6; --muted:#6d6675; --line:#e6e0ea; --white:#fff;
  --ok:#1f7a4d; --err:#b3261e; --warn:#9a6400;
  --r:10px;
}
*{ box-sizing:border-box; }
html,body{ margin:0; }
body{ font-family:'Tajawal',sans-serif; background:var(--cream); color:var(--plum); font-size:14px; }
h1,h2,h3{ font-family:'Alexandria',sans-serif; margin:0; }
a{ color:var(--violet); }
code{ background:var(--lavender); padding:1px 6px; border-radius:4px; }
.muted{ color:var(--muted); }
.hidden{ display:none !important; }

/* أزرار */
.btn{ font-family:'Tajawal',sans-serif; font-weight:700; font-size:14px; border:1px solid var(--line); background:var(--white); color:var(--plum);
      padding:9px 16px; border-radius:8px; cursor:pointer; text-decoration:none; display:inline-flex; align-items:center; gap:6px; line-height:1.2; }
.btn:hover{ border-color:var(--plum); }
.btn.primary{ background:var(--plum); color:#fff; border-color:var(--plum); }
.btn.primary:hover{ background:var(--plum-2); }
.btn.accent{ background:var(--violet); color:#fff; border-color:var(--violet); }
.btn.lime{ background:var(--lime); border-color:var(--lime); color:var(--plum); }
.btn.danger{ color:var(--err); }
.btn.danger:hover{ border-color:var(--err); }
.btn.sm{ padding:5px 10px; font-size:12.5px; border-radius:6px; }
.btn.block{ width:100%; justify-content:center; padding:12px; }
.btn:disabled{ opacity:.5; cursor:not-allowed; }
.icon-btn{ border:0; background:transparent; cursor:pointer; color:var(--muted); font-size:15px; padding:4px 6px; border-radius:5px; }
.icon-btn:hover{ background:var(--lavender); color:var(--plum); }

/* حقول */
label{ display:flex; flex-direction:column; gap:5px; font-size:12.5px; font-weight:700; color:var(--muted); }
input,select,textarea{ font-family:'Tajawal',sans-serif; font-size:14px; color:var(--plum); background:var(--white); border:1px solid var(--line);
      border-radius:8px; padding:9px 11px; width:100%; outline:none; }
textarea{ resize:vertical; line-height:1.6; }
input:focus,select:focus,textarea:focus{ border-color:var(--violet); box-shadow:0 0 0 3px rgba(118,0,255,.12); }
.grid2{ display:grid; grid-template-columns:1fr 1fr; gap:12px; }
.grid3{ display:grid; grid-template-columns:repeat(3,1fr); gap:12px; }
.span2{ grid-column:1 / -1; }
.hint{ font-size:12px; color:var(--muted); font-weight:500; margin:4px 0 0; line-height:1.6; }
.check{ flex-direction:row; align-items:center; gap:8px; color:var(--plum); }
.check input{ width:auto; }

.alert{ padding:10px 14px; border-radius:8px; margin:10px 0; font-weight:700; font-size:13px; }
.alert.err{ background:#fdecea; color:var(--err); }
.alert.ok{ background:#e6f4ec; color:var(--ok); }

/* صفحات الدخول والتثبيت */
body.auth{ min-height:100vh; display:grid; place-items:center; padding:24px; }
.auth-card{ background:var(--white); border:1px solid var(--line); border-radius:16px; padding:32px; width:100%; max-width:400px;
            display:flex; flex-direction:column; gap:14px; box-shadow:0 10px 40px rgba(36,16,56,.08); border-top:5px solid var(--violet); }
.auth-card.wide{ max-width:620px; }
.auth-card h1{ font-size:22px; }
.auth-card h3{ font-size:14px; margin-top:8px; color:var(--violet); }
.auth-logo{ width:200px; align-self:center; }
.auth-card form{ display:flex; flex-direction:column; gap:12px; }

/* الشريط العلوي */
.topbar{ background:var(--plum); color:#fff; height:58px; display:flex; align-items:center; gap:18px; padding:0 24px; position:sticky; top:0; z-index:50; border-top:4px solid var(--violet); }
.topbar .brand{ font-family:'Alexandria',sans-serif; font-weight:700; font-size:15px; display:flex; align-items:center; gap:10px; }
.topbar .brand .dot{ width:10px; height:10px; background:var(--lime); border-radius:3px; }
.topbar .spacer{ flex:1; }
.topbar .who{ font-size:13px; opacity:.85; }
.topbar .btn{ background:transparent; color:#fff; border-color:rgba(255,255,255,.3); }
.topbar .btn:hover{ border-color:#fff; }
.topbar .btn.lime{ background:var(--lime); color:var(--plum); border-color:var(--lime); }

/* التبويبات */
.container{ max-width:1240px; margin:0 auto; padding:24px; }
.tabs{ display:flex; gap:6px; border-bottom:1px solid var(--line); margin-bottom:20px; flex-wrap:wrap; }
.tab{ border:0; background:transparent; font-family:'Alexandria',sans-serif; font-weight:600; font-size:14px; color:var(--muted);
      padding:12px 16px; cursor:pointer; border-bottom:3px solid transparent; margin-bottom:-1px; }
.tab.active{ color:var(--plum); border-bottom-color:var(--violet); }

.toolbar{ display:flex; gap:10px; align-items:center; margin-bottom:14px; flex-wrap:wrap; }
.toolbar input,.toolbar select{ width:auto; min-width:220px; }
.toolbar .spacer{ flex:1; }

/* الجداول */
.table-wrap{ background:var(--white); border:1px solid var(--line); border-radius:12px; overflow:auto; }
table{ width:100%; border-collapse:collapse; }
th{ text-align:right; font-size:12px; color:var(--muted); font-weight:700; background:var(--sand); padding:11px 12px; white-space:nowrap; }
td{ padding:11px 12px; border-top:1px solid var(--line); font-size:13.5px; vertical-align:middle; }
tr:hover td{ background:#fcfaff; }
td .actions{ display:flex; gap:4px; flex-wrap:wrap; justify-content:flex-end; }
.num{ font-family:'Alexandria',sans-serif; font-weight:700; direction:ltr; unicode-bidi:isolate; }
.empty{ text-align:center; color:var(--muted); padding:40px; }
.badge{ display:inline-block; padding:3px 10px; border-radius:20px; font-size:11.5px; font-weight:800; }
.badge.draft{ background:var(--sand); color:var(--muted); }
.badge.sent{ background:var(--lavender); color:var(--violet); }
.badge.approved{ background:#e3f6dd; color:var(--ok); }
.badge.rejected{ background:#fdecea; color:var(--err); }
.badge.off{ background:var(--sand); color:var(--muted); }
.badge.on{ background:var(--lime); color:var(--plum); }
select.status{ width:auto; padding:4px 8px; font-size:12.5px; font-weight:700; }

/* النوافذ المنبثقة */
.modal-bg{ position:fixed; inset:0; background:rgba(36,16,56,.45); display:flex; align-items:flex-start; justify-content:center; z-index:100; padding:40px 16px; overflow:auto; }
.modal{ background:var(--white); border-radius:14px; width:100%; max-width:720px; box-shadow:0 20px 60px rgba(0,0,0,.25); border-top:5px solid var(--violet); }
.modal header{ display:flex; align-items:center; justify-content:space-between; padding:16px 20px; border-bottom:1px solid var(--line); }
.modal header h3{ font-size:16px; }
.modal .body{ padding:20px; display:flex; flex-direction:column; gap:14px; }
.modal footer{ padding:14px 20px; border-top:1px solid var(--line); display:flex; gap:8px; justify-content:flex-start; }

/* نافذة التأكيد */
.modal-bg.ask{ align-items:center; }
.modal-bg.ask .modal{ max-width:440px; }
.ask-msg{ margin:0; font-size:15px; font-weight:500; line-height:1.8; color:var(--plum); }
.btn.danger-solid{ background:var(--err); border-color:var(--err); color:#fff; }

/* محرر الخدمات */
.svc-editor{ display:flex; flex-direction:column; gap:6px; }
.svc-row{ display:grid; grid-template-columns:26px 1.3fr 1fr auto; gap:6px; align-items:center; }
.svc-row .n{ width:24px; height:24px; border-radius:5px; background:var(--lime); display:grid; place-items:center; font-weight:800; font-size:12px; font-family:'Alexandria'; }
.svc-row input{ padding:7px 9px; font-size:13px; }
.svc-row .ctrl{ display:flex; }
.svc-add{ align-self:flex-start; }

/* توست */
#toast{ position:fixed; bottom:24px; left:50%; transform:translateX(-50%); background:var(--plum); color:#fff; padding:11px 22px; border-radius:10px;
        font-weight:700; z-index:300; display:none; box-shadow:0 8px 30px rgba(0,0,0,.2); }
#toast.err{ background:var(--err); }

/* ============ المحرر ============ */
body.editor{ height:100vh; display:flex; flex-direction:column; overflow:hidden; }
.ed-main{ flex:1; display:grid; grid-template-columns:minmax(420px, 520px) 1fr; min-height:0; }
.ed-form{ overflow:auto; padding:18px; border-left:1px solid var(--line); background:var(--white); }
.ed-preview{ overflow:auto; background:#e7e2dc; padding:24px; }
.ed-preview .sheet{ margin:0 auto 20px; box-shadow:0 6px 24px rgba(36,16,56,.15); transform-origin:top center; }
.ed-preview .pages{ display:flex; flex-direction:column; align-items:center; gap:18px; }
.overflow-warn{ background:#fff4e0; color:var(--warn); font-weight:700; font-size:12.5px; padding:8px 12px; border-radius:8px; margin:0 auto 12px; max-width:600px; text-align:center; }

.sec{ border:1px solid var(--line); border-radius:12px; margin-bottom:14px; background:var(--white); }
.sec > summary{ list-style:none; cursor:pointer; padding:13px 16px; font-family:'Alexandria',sans-serif; font-weight:700; font-size:14px; display:flex; align-items:center; gap:10px; }
.sec > summary::-webkit-details-marker{ display:none; }
.sec > summary::before{ content:""; width:8px; height:8px; border-radius:2px; background:var(--violet); }
.sec > summary .sub{ font-family:'Tajawal'; font-weight:500; font-size:12px; color:var(--muted); margin-right:auto; }
.sec[open] > summary{ border-bottom:1px solid var(--line); }
.sec .inner{ padding:14px 16px; display:flex; flex-direction:column; gap:12px; }

.opt-card{ border:1px solid var(--line); border-radius:10px; padding:12px; display:flex; flex-direction:column; gap:10px; background:#fdfcff; border-right:4px solid var(--plum); }
.opt-head{ display:flex; align-items:center; gap:8px; }
.opt-head .title{ font-family:'Alexandria'; font-weight:700; font-size:13.5px; flex:1; }
.opt-head .pg{ background:var(--lavender); color:var(--violet); font-size:11px; font-weight:800; padding:2px 8px; border-radius:20px; }
.add-opt{ display:flex; gap:8px; }
.add-opt select{ flex:1; }

.history-list{ list-style:none; margin:0; padding:0; }
.history-list li{ padding:10px 0; border-bottom:1px solid var(--line); font-size:13px; }
.history-list li small{ color:var(--muted); display:block; }

@media (max-width: 980px){
  body.editor{ height:auto; overflow:auto; }
  .ed-main{ grid-template-columns:1fr; }
  .ed-form{ border-left:0; }
  .grid2,.grid3{ grid-template-columns:1fr; }
}