/* =====================================================================
 *  الروابط الإضافية — القائمة المنسدلة المتعددة وخطوط الربط والتمييز
 * ===================================================================== */

/* ---------------- القائمة المنسدلة متعددة الاختيار ---------------- */
.msel{position:relative}
.msel-ctl{min-height:38px;display:flex;align-items:center;gap:6px;padding:4px 8px;border:1px solid var(--line-2);border-radius:6px;
  background:var(--surface);cursor:pointer;transition:border-color .15s,box-shadow .15s}
.msel-ctl:hover{border-color:var(--teal)}
.msel-ctl:focus-visible,.msel.open .msel-ctl{outline:none;border-color:var(--teal);box-shadow:0 0 0 3px var(--teal-soft)}
.msel.err .msel-ctl{border-color:var(--high)}
.msel-chips{flex:1;display:flex;flex-wrap:wrap;gap:4px;min-width:0}
.msel-ph{color:var(--muted);font-size:12px;padding:4px 2px}
.msel-car{color:var(--muted);font-size:11px;flex:none;transition:transform .15s}
.msel.open .msel-car{transform:rotate(180deg)}
.msel-chip{display:inline-flex;align-items:center;gap:5px;max-width:100%;background:var(--teal-soft);color:var(--ink);border:1px solid var(--brand-line);
  border-radius:999px;padding:1px 4px 1px 9px;font-size:11.5px;min-width:0}
.msel-chip b{font-size:10px;color:var(--teal);flex:none}
.msel-chip span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;max-width:230px}
.msel-chip button{border:0;background:transparent;color:var(--muted);cursor:pointer;font-size:10px;width:18px;height:18px;border-radius:50%;padding:0;flex:none}
.msel-chip button:hover{background:var(--high-bg);color:var(--high)}
.msel-chip.lk{background:var(--pill);border-color:var(--line-2)}
.msel-chip.lk i{font-style:normal;font-size:9.5px;color:var(--muted);background:var(--surface);border-radius:99px;padding:0 6px;margin-inline-end:3px}
.msel-pop{position:absolute;inset-inline:0;top:calc(100% + 4px);z-index:30;background:var(--surface);border:1px solid var(--line-2);border-radius:8px;
  box-shadow:0 14px 34px -12px rgba(16,42,63,.35);display:flex;flex-direction:column;max-height:320px}
.msel-pop[hidden]{display:none}
.msel-s{margin:8px;padding:7px 10px;border:1px solid var(--line-2);border-radius:6px;font-size:12.5px;background:var(--surface-2)}
.msel-s:focus{outline:none;border-color:var(--teal)}
.msel-opts{overflow-y:auto;padding:0 4px 4px;flex:1;min-height:0}
.msel-g{position:sticky;top:0;background:var(--surface);font-size:10.5px;font-weight:700;color:var(--muted);padding:6px 8px 3px;border-bottom:1px solid var(--line)}
.msel-o{display:grid;grid-template-columns:auto auto minmax(0,1fr) auto;gap:8px;align-items:center;padding:6px 8px;border-radius:6px;cursor:pointer;font-size:12.5px}
.msel-o:hover{background:var(--hover)}
.msel-o b{font-size:10.5px;color:var(--muted)}
.msel-o span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.msel-o i{font-style:normal;font-size:10px;color:var(--muted);background:var(--pill);border-radius:99px;padding:0 7px}
.msel-o:has(input:checked){background:var(--teal-soft)}
.msel-o:has(input:checked) b{color:var(--teal)}
.msel-o.lk{opacity:.65;cursor:default}
.msel-empty{padding:14px;text-align:center;color:var(--muted);font-size:12px}
.msel-foot{display:flex;justify-content:space-between;align-items:center;gap:8px;padding:6px 8px;border-top:1px solid var(--line);font-size:11.5px;color:var(--muted)}
.msel-foot span:last-child{display:flex;gap:6px}

/* شرائح الروابط بلوحة التفاصيل */
.xl-chip{cursor:pointer;border:1px dashed var(--violet)}
.xl-chip b{color:var(--violet);font-size:10px}
.xl-chip:hover{background:var(--violet-bg)}

/* ---------------- خطوط الربط بعرض المسار ---------------- */
.pq-wrap{position:relative}
.xl-layer{position:absolute;inset:0;pointer-events:none;z-index:1}
.xl-svg{position:absolute;inset:0;overflow:visible}
.xl-g{pointer-events:auto;cursor:pointer}
.xl-hit{fill:none;stroke:transparent;stroke-width:14;pointer-events:stroke}
.xl-path{fill:none;stroke:var(--violet);stroke-width:2;stroke-dasharray:6 5;opacity:.75;pointer-events:none;transition:opacity .2s,stroke-width .15s}
.xl-end{fill:none;stroke:var(--violet);stroke-width:1.5;stroke-dasharray:3 3;opacity:.7;pointer-events:none}
.xl-g:hover .xl-path{opacity:1;stroke-width:3}
.xl-g.fx .xl-path{opacity:1;stroke-width:3;stroke-dasharray:8 4}
@media (prefers-reduced-motion:no-preference){.xl-g.fx .xl-path{animation:xldash 1.2s linear infinite}}
@keyframes xldash{to{stroke-dashoffset:-24}}
.xl-stub{position:absolute;transform:translate(14px,-150%);pointer-events:auto;border:1px dashed var(--violet);background:var(--violet-bg);color:var(--violet);
  font-size:10px;font-weight:700;border-radius:99px;padding:0 7px;cursor:pointer;white-space:nowrap;font-family:ui-monospace,monospace;line-height:1.6}
.xl-stub:hover{border-style:solid}

/* ---------------- التمييز: الشجرة المختارة واضحة والباقي باهت ---------------- */
.pq-wrap.pq-focusing [data-rk]:not(.fx),
.pq-wrap.pq-focusing .pq-onode:not(.fx),
.pq-wrap.pq-focusing .pq-olb:not(.fx),
.pq-wrap.pq-focusing .xl-g:not(.fx),
.pq-wrap.pq-focusing .xl-stub:not(.fx){opacity:.12}
.pq-wrap.pq-focusing [data-rk].fx,.pq-wrap.pq-focusing .pq-onode.fx{opacity:1}
.pq-omap path[data-pq-focus]{cursor:pointer}
.xl-focusbar{display:flex;justify-content:space-between;align-items:center;gap:10px;background:var(--violet-bg);border:1px dashed var(--violet);
  border-radius:8px;padding:5px 10px;font-size:12px;color:var(--violet)}
.xl-focusbar b{color:var(--ink)}

/* تحييد أنماط .field العامة داخل القائمة المنسدلة */
.field .msel-o{display:grid;font-size:12.5px;font-weight:500;color:var(--ink);margin:0}
.field .msel-o input[type=checkbox]{width:16px;height:16px;padding:0;margin:0;accent-color:var(--teal);flex:none}
.field .msel-s{width:auto;margin:8px;padding:7px 10px;background:var(--surface-2)}

.msel-o.nc{grid-template-columns:auto minmax(0,1fr) auto}
.msel-n{flex:none;font-size:10px;font-weight:700;color:var(--teal);background:var(--teal-soft);border-radius:99px;padding:0 7px}
.msel-n:empty{display:none}

/* القوائم المنسدلة الطويلة بالبحث (ssel.js) */
.ssel-pop{position:fixed;z-index:400;background:var(--surface);border:1px solid var(--line-2);border-radius:8px;
  box-shadow:0 14px 34px -12px rgba(16,42,63,.35);display:flex;flex-direction:column;overflow:hidden}
.ssel-q{margin:7px;padding:7px 10px;border:1px solid var(--line-2);border-radius:6px;font:inherit;font-size:12.5px;background:var(--surface-2);color:var(--ink)}
.ssel-q:focus{outline:none;border-color:var(--teal)}
.ssel-list{overflow-y:auto;padding:0 4px 5px;flex:1;min-height:0}
.ssel-g{position:sticky;top:0;background:var(--surface);font-size:10.5px;font-weight:700;color:var(--muted);padding:6px 8px 3px;border-bottom:1px solid var(--line)}
.ssel-o{padding:6px 10px;border-radius:6px;cursor:pointer;font-size:12.5px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.ssel-o:hover,.ssel-o.hi{background:var(--hover)}
.ssel-o.on{background:var(--teal-soft);font-weight:700}
.ssel-o.off{opacity:.5;cursor:default}
.ssel-empty{padding:12px;text-align:center;color:var(--muted);font-size:12px}