/* دليل الخدمات — الدفعة 1 (واجهة) + 2 (إشعار ونموذج البلاغ) + 3 (صفحة إضافة جهة بالشكل الجديد). يُحمَّل بعد theme.css من block head في directory.html.
   يستخدم متغيرات الثيم الحالية فقط، فيتبع الوضعين الليلي والنهاري. لا style="" في القالب (CSP). */

/* ---------- عدّاد التصنيف ---------- */
.rs-chip__n{margin-inline-start:6px;font-size:12px;font-weight:700;opacity:.7;font-variant-numeric:tabular-nums}
.rs-chip[aria-pressed="true"] .rs-chip__n{opacity:.85}

/* ---------- إخفاء بالفلاتر (منفصل عن hidden الذي يستخدمه extras.js) ---------- */
.rs-dcard.is-off{display:none}

/* ---------- التخطيط ---------- */
.rs-dirlayout{display:flex;flex-direction:column;gap:16px}
.rs-dirmain{display:flex;flex-direction:column;gap:14px;min-width:0}

/* ---------- الفلاتر ---------- */
.rs-dirside{display:flex;flex-wrap:wrap;gap:10px;align-items:stretch}
.rs-ff{display:flex;flex-direction:column;gap:6px;flex:1 1 180px;min-width:0}
.rs-ff__l{font-size:12px;font-weight:600;color:var(--muted)}
.rs-select{height:44px;width:100%;border-radius:14px;background:var(--surface);color:var(--text);border:1px solid var(--border-strong);padding:0 12px;font-size:14px;font-family:inherit;cursor:pointer}
.rs-select:hover{border-color:var(--gold)}
.rs-select:focus-visible,.rs-switch:focus-visible{outline:2px solid var(--focus);outline-offset:2px}

.rs-switch{display:flex;align-items:center;justify-content:space-between;gap:12px;flex:1 1 180px;min-height:44px;padding:0 14px;border-radius:14px;background:var(--surface);color:var(--text);border:1px solid var(--border-strong);font-size:14px;font-weight:600;font-family:inherit;cursor:pointer;transition:border-color .2s ease,background-color .2s ease}
.rs-switch:hover{border-color:var(--gold)}
.rs-switch__t{display:inline-flex;align-items:center;gap:8px}
.rs-switch__t svg{color:var(--link)}
.rs-switch__t b{font-size:12px;font-weight:700;color:var(--muted);font-variant-numeric:tabular-nums}
.rs-switch__k{position:relative;width:40px;height:24px;flex:0 0 auto;border-radius:999px;background:var(--raised);border:1px solid var(--border-strong);transition:background-color .2s ease,border-color .2s ease}
.rs-switch__k i{position:absolute;top:2px;inset-inline-start:2px;width:18px;height:18px;border-radius:50%;background:var(--text-2);transition:inset-inline-start .2s ease,background-color .2s ease}
.rs-switch[aria-checked="true"]{border-color:var(--gold);background:var(--gold-soft)}
.rs-switch[aria-checked="true"] .rs-switch__k{background:var(--gold);border-color:var(--gold)}
.rs-switch[aria-checked="true"] .rs-switch__k i{inset-inline-start:18px;background:var(--on-gold)}

/* ---------- البطاقة المميّزة (موضع مدفوع معلن) ---------- */
.rs-dcard--f{border-color:var(--gold);box-shadow:0 0 0 3px var(--gold-soft),var(--shadow-card)}
.rs-dcard__fs{margin-inline-start:auto;font-size:10px;font-weight:600;letter-spacing:0;opacity:.8}

/* ---------- الحالة الفارغة ---------- */
.rs-empty__b{margin-top:14px;min-height:44px}

/* ---------- الكمبيوتر: شريط جانبي + شبكة ---------- */
@media (min-width:1024px){
  .rs-main.rs-dirpage{max-width:1120px}
  .rs-dirlayout.has-side{display:grid;grid-template-columns:260px minmax(0,1fr);gap:24px;align-items:start}
  .rs-dirlayout.has-side .rs-dirside{position:sticky;top:84px;flex-direction:column;padding:16px;border-radius:20px;background:var(--surface);border:1px solid var(--border)}
  .rs-dirlayout.has-side .rs-ff,.rs-dirlayout.has-side .rs-switch{flex:0 0 auto}
  .rs-dir>.rs-dcard--f:first-child{grid-column:1/-1}
  .rs-dirchips{flex-wrap:wrap;overflow:visible}
}

/* ---------- إشعار (بعد الإدراج/البلاغ) ---------- */
.rs-notice{padding:12px 16px;border-radius:14px;background:var(--gold-soft);color:var(--text);border:1px solid var(--gold-line-2);font-size:14px;line-height:1.7}
.rs-notice--err{border-color:var(--down,#F87171)}

/* ---------- نموذج الإبلاغ عن جهة ---------- */
.rs-rform{display:flex;flex-direction:column;gap:14px}
.rs-rform__set{border:0;margin:0;padding:0;display:flex;flex-direction:column;gap:10px;min-width:0}
.rs-rform__set legend{padding:0;margin-bottom:6px;font-size:14px;font-weight:700}
.rs-opt{display:flex;align-items:center;gap:12px;min-height:52px;padding:0 16px;border-radius:14px;border:1px solid var(--border-strong);background:var(--surface);color:var(--text);font-size:14px;cursor:pointer;transition:border-color .2s ease,background-color .2s ease}
.rs-opt:hover{border-color:var(--gold)}
.rs-opt input{width:20px;height:20px;flex:0 0 auto;accent-color:var(--gold);margin:0}
.rs-opt:has(input:checked){border-color:var(--gold);background:var(--gold-soft)}
.rs-opt:has(input:focus-visible){outline:2px solid var(--focus);outline-offset:2px}
.rs-rform__n{margin:0;font-size:12px;line-height:1.8;color:var(--muted)}
.rs-rbtn{min-height:52px;border:0;border-radius:14px;background:var(--gold);color:var(--on-gold);font-family:inherit;font-size:15px;font-weight:700;cursor:pointer}
.rs-rbtn:focus-visible,.rs-rlink:focus-visible{outline:2px solid var(--focus);outline-offset:2px}
.rs-rlink{display:flex;align-items:center;justify-content:center;min-height:44px;font-size:14px;font-weight:600;color:var(--muted)}
.rs-rlink:hover{color:var(--text)}

/* ---------- صفحة إضافة جهة ---------- */
.rs-aform{display:flex;flex-direction:column;gap:16px}
.rs-aform .rs-ff{flex:0 0 auto}
.rs-aform__row{display:flex;flex-wrap:wrap;gap:12px}
.rs-aform__row .rs-ff{flex:1 1 220px}
.rs-aform .rs-select{height:52px}
.rs-input{width:100%;min-height:52px;box-sizing:border-box;padding:0 14px;border-radius:14px;background:var(--surface);color:var(--text);border:1px solid var(--border-strong);font-family:inherit;font-size:15px}
.rs-input--area{padding:12px 14px;line-height:1.8;resize:vertical;min-height:112px}
.rs-input:hover{border-color:var(--gold)}
.rs-input:focus-visible{outline:2px solid var(--focus);outline-offset:2px}
.rs-input::placeholder{color:var(--muted)}
.rs-aform__meta{display:flex;justify-content:space-between;gap:12px;font-size:12px;color:var(--muted);line-height:1.7}
.rs-aform__meta span:last-child{font-variant-numeric:tabular-nums;flex:0 0 auto}

/* ---------- بطاقة تنبيه خدمات التحويل ---------- */
.rs-note{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:12px;padding:14px 16px;margin-bottom:16px;border-radius:16px;background:var(--surface);border:1px solid var(--gold-line-2)}
.rs-note__t{display:flex;flex-direction:column;gap:4px;flex:1 1 240px;min-width:0}
.rs-note__t b{font-size:14px;font-weight:700}
.rs-note__t span{font-size:13px;line-height:1.7;color:var(--text-2)}
.rs-note__a{flex:0 0 auto;min-height:44px}

@media (prefers-reduced-motion:reduce){
  .rs-switch,.rs-switch__k,.rs-switch__k i,.rs-opt{transition:none!important}
}
