/* ===== الموارد البشرية — ملفات الموظفين والهيكل التنظيمي ============================================ */
.hre{display:flex;flex-direction:column;gap:0}
.hre-ic{flex-shrink:0;vertical-align:middle}
.hre-sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.hre-danger:hover{border-color:#dc2626;color:#b3261e}
.hre-check{display:inline-flex;align-items:center;gap:.45rem;font-weight:700;font-size:.85rem;color:var(--ink);cursor:pointer;margin-bottom:.6rem}
.hre-check input{width:16px;height:16px;accent-color:var(--dark)}
.hre-small{font-size:.8rem;margin:.1rem 0 .6rem}

/* avatar */
.hre-av{width:36px;height:36px;border-radius:50%;background:#e8eef5;color:#1f4f6f;display:inline-grid;place-items:center;font-weight:800;font-size:.95rem;overflow:hidden;flex-shrink:0}
.hre-av img{width:100%;height:100%;object-fit:cover;display:block}
.hre-av--xl{width:84px;height:84px;font-size:2rem}

/* list */
.hre-kpis{margin-bottom:1rem}
.hre-kpi-btn{cursor:pointer;transition:border-color .15s,box-shadow .15s}
.hre-kpi-btn:hover,.hre-kpi-btn:focus-visible{border-color:#d97706;box-shadow:0 0 0 3px #fff4e5;outline:none}
.hre-search{position:relative;display:flex;align-items:center;min-width:220px}
.hre-search .hre-ic{position:absolute;inset-inline-start:.65rem;color:var(--muted);pointer-events:none}
.hre-search .in{padding-inline-start:2.1rem;width:100%}
.hre-filters{padding-top:.1rem}
.hre-filters .in{flex:1 1 150px;min-width:140px}
.hre-filters .hre-check{margin:0 .3rem}
.hre-count{margin:.2rem 0 .5rem;color:var(--muted);font-size:.8rem;font-weight:700;min-height:1em}
.hre-person{display:flex;align-items:center;gap:.6rem;color:inherit;text-decoration:none}
.hre-person:hover b{color:var(--blue-d)}
.hre-person span{display:flex;flex-direction:column;min-width:0}
.hre-person small{color:var(--muted);font-size:.76rem}

/* form */
.hre-total{margin:-.3rem 0 .8rem;font-size:.86rem;color:var(--muted)}
.hre-total b{color:var(--ink)}
.hre-hint{font-size:.76rem;font-weight:700;min-height:1em}
.hre-hint.is-ok{color:#166534}
.hre-hint.is-bad{color:#b3261e}

/* profile */
.hre-back{display:inline-flex;align-items:center;gap:.3rem;color:var(--muted);font-weight:700;font-size:.82rem;text-decoration:none;margin-bottom:.6rem;width:max-content}
.hre-back .hre-ic{transform:rotate(-90deg)}
.hre-back:hover{color:var(--ink)}
.hre-head{display:flex;gap:1.1rem;align-items:center;flex-wrap:wrap}
.hre-head__av{position:relative}
.hre-av-btn{position:absolute;bottom:-2px;inset-inline-end:-2px;width:30px;height:30px;border-radius:50%;border:2px solid #fff;background:var(--dark);color:#fff;display:grid;place-items:center;cursor:pointer;transition:background .15s}
.hre-av-btn:hover{background:var(--blue-d)}
.hre-head__main{flex:1 1 260px;min-width:0}
.hre-head__main h2{margin:0;font-size:1.25rem;line-height:1.4}
.hre-head__main p{margin:.1rem 0 .45rem;color:var(--muted);font-size:.88rem}
.hre-head__pills{display:flex;gap:.35rem;flex-wrap:wrap;align-items:center}
.hre-mgr{font-size:.8rem;color:var(--muted);margin-inline-start:.3rem}
.hre-mgr a{color:var(--blue-d);font-weight:700;text-decoration:none}
.hre-head__act{display:flex;gap:.4rem;flex-wrap:wrap}
.hre-ptabs{display:flex;gap:.2rem;border-bottom:1px solid var(--line);margin:0 0 1rem;overflow-x:auto}
.hre-ptab{border:0;background:none;font:inherit;font-weight:800;font-size:.86rem;color:var(--muted);padding:.6rem .9rem;border-bottom:2px solid transparent;margin-bottom:-1px;cursor:pointer;white-space:nowrap;transition:color .15s,border-color .15s}
.hre-ptab:hover{color:var(--ink)}
.hre-ptab.on{color:var(--ink);border-bottom-color:var(--orange)}
.hre-ptab:focus-visible{outline:2px solid var(--blue);outline-offset:-2px}
.hre-cards{align-items:start}
.hre-cards .hr-card{margin-bottom:0}
.hre-cards{margin-bottom:1rem}
.hre-dl{margin:0;display:flex;flex-direction:column}
.hre-dl>div{display:grid;grid-template-columns:minmax(110px,38%) 1fr;gap:.6rem;padding:.45rem 0;border-bottom:1px dashed #edf0f4;font-size:.88rem}
.hre-dl>div:last-child{border-bottom:0}
.hre-dl dt{color:var(--muted);font-weight:700;font-size:.8rem}
.hre-dl dd{margin:0;min-width:0;overflow-wrap:anywhere}
.hre-dl a{color:var(--blue-d);text-decoration:none}
.hre-notes{margin:.6rem 0 0;padding:.6rem .7rem;background:#f6f8fb;border-radius:10px;font-size:.85rem;white-space:pre-wrap}
.hre-doc{display:flex;gap:.55rem;align-items:center}
.hre-doc .hre-ic{color:var(--blue-d)}
.hre-doc span{display:flex;flex-direction:column}

/* dashboard cards */
.hre-wlink{text-decoration:none;color:inherit}
.hre-warn{color:#b45309}
.hre-wlist{list-style:none;margin:.35rem 0 0;padding:0;display:flex;flex-direction:column;gap:.25rem;font-size:.78rem}
.hre-wlist li{display:flex;justify-content:space-between;gap:.5rem}
.hre-wlist a{color:var(--ink);font-weight:700;text-decoration:none;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.hre-wlist a:hover{color:var(--blue-d)}
.hre-wlist span{color:var(--muted);white-space:nowrap}

/* structure */
.hre-structure .hr-card{margin-bottom:0}
.hre-loc{display:inline-flex;align-items:center;gap:.25rem;color:var(--blue-d);font-weight:700;text-decoration:none;font-size:.84rem}
.hre-geo{display:flex;align-items:center;gap:.6rem;flex-wrap:wrap;margin:-.2rem 0 .9rem}

/* org chart: a big square stage (dotted canvas), zoom/fit/full-screen controls floating on it */
.hre-org-note{font-size:.8rem;margin:0 0 .6rem}
.hre-org-note kbd{font:inherit;font-size:.72rem;border:1px solid var(--line);border-bottom-width:2px;border-radius:5px;padding:0 .3rem;background:#fff}
.hre-org-hits{font-size:.8rem;font-weight:700;min-width:60px}
.hre-org-wrap{position:relative}
.hre-org-scroll{overflow:auto;height:clamp(560px,78vh,1100px);border:1px solid var(--line);border-radius:16px;padding:56px 28px 40px;
  background:radial-gradient(circle,#d8dfe8 1px,transparent 1.2px) 0 0/22px 22px,linear-gradient(180deg,#fbfcfe,#f3f6fa);cursor:grab;overscroll-behavior:contain}
.hre-org-scroll.is-drag{cursor:grabbing;user-select:none}
.hre-org-card.is-list .hre-org-scroll{height:auto;max-height:72vh;cursor:auto;background:#fafbfd;padding:1rem}
.hre-org-card.is-list .hre-org-zoom{display:none}
.hre-org-card.is-list .hre-org-tip{display:none}
@media (hover:none){.hre-org-tip{display:none}}
.hre-org-zoom{position:absolute;top:12px;inset-inline-end:12px;z-index:3;display:flex;align-items:center;gap:2px;background:rgba(255,255,255,.92);
  backdrop-filter:blur(6px);border:1px solid var(--line);border-radius:12px;padding:3px;box-shadow:0 4px 14px rgba(15,23,42,.08)}
.hre-org-zoom button{width:32px;height:32px;display:grid;place-items:center;border:0;background:none;border-radius:9px;color:#334155;cursor:pointer;transition:background .15s,color .15s}
.hre-org-zoom button:hover,.hre-org-zoom button:focus-visible{background:var(--dark);color:#fff;outline:none}
.hre-org-zoom bdi{min-width:46px;text-align:center;font-size:.76rem;font-weight:800;color:#334155}
.hre-org-card.is-full{position:fixed;inset:10px;z-index:1200;margin:0;display:flex;flex-direction:column;box-shadow:0 20px 60px rgba(15,23,42,.35)}
.hre-org-card.is-full .hre-org-wrap{flex:1;min-height:0;display:flex;flex-direction:column}
.hre-org-card.is-full .hre-org-scroll{flex:1;height:auto}
body.hre-noscroll{overflow:hidden}
.hre-org,.hre-org ul{list-style:none;margin:0;padding:0}
.hre-node{--hue:#1f6f8f;display:flex;align-items:center;gap:.55rem;background:#fff;border:1px solid var(--line);border-top:3px solid var(--hue);border-radius:12px;padding:.6rem .7rem;cursor:pointer;
  transition:border-color .15s,box-shadow .15s,transform .15s;text-align:start;position:relative;box-shadow:0 1px 3px rgba(15,23,42,.05)}
.hre-node:hover,.hre-node:focus-visible{border-color:var(--hue);box-shadow:0 6px 18px rgba(15,23,42,.12);transform:translateY(-1px);outline:none}
.hre-node .hre-av{box-shadow:0 0 0 2px #fff,0 0 0 3.5px color-mix(in srgb,var(--hue) 45%,transparent)}
.hre-node__t{display:flex;flex-direction:column;min-width:0;line-height:1.35}
.hre-node__t b{font-size:.84rem;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.hre-node__t small{font-size:.74rem;color:var(--muted);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.hre-node__t em{font-style:normal;font-size:.68rem;color:var(--hue);font-weight:700}
.hre-node__tg{margin-inline-start:auto;display:inline-flex;align-items:center;gap:.15rem;border:1px solid var(--line);background:#f6f8fb;border-radius:20px;padding:.12rem .45rem;font:inherit;font-size:.72rem;font-weight:800;color:var(--muted);cursor:pointer;flex-shrink:0}
.hre-node__tg:hover{background:var(--dark);color:#fff;border-color:var(--dark)}
.hre-node__tg .hre-ic{transition:transform .15s}
li.is-closed>.hre-node .hre-node__tg .hre-ic{transform:rotate(90deg)}
li.is-closed>ul{display:none!important}
.hre-node.is-hit{border-color:#d97706;background:#fffaf0}
.hre-node.is-current{box-shadow:0 0 0 3px rgba(217,119,6,.35)}
/* company + department heads */
.hre-node--org{cursor:default;background:linear-gradient(135deg,#0f172a,#1e3a5f);color:#fff;border:0;padding:.8rem 1.1rem;gap:.8rem;box-shadow:0 10px 28px rgba(15,23,42,.25)}
.hre-node--org:hover{transform:none;box-shadow:0 10px 28px rgba(15,23,42,.25)}
.hre-node--org img{width:40px;height:40px;object-fit:contain;background:#fff;border-radius:10px;padding:4px}
.hre-node--org .hre-node__t b{font-size:.98rem}
.hre-node--org .hre-node__t small{color:#cbd5e1}
.hre-node--dept{cursor:default;justify-content:center;background:color-mix(in srgb,var(--hue) 9%,#fff);border:1px solid color-mix(in srgb,var(--hue) 35%,#fff);border-top:3px solid var(--hue)}
.hre-node--dept:hover{transform:none;box-shadow:0 1px 3px rgba(15,23,42,.05);border-color:color-mix(in srgb,var(--hue) 35%,#fff)}
.hre-node--dept .hre-node__t{align-items:center;text-align:center}
.hre-node--dept .hre-node__t b{color:var(--hue);font-size:.9rem}
/* a team of plain members, packed into a square grid */
.hre-pack{background:rgba(255,255,255,.7);border:1px dashed #c9d2de;border-radius:14px;padding:.6rem}
.hre-pack__h{display:flex;align-items:center;justify-content:center;gap:.3rem;font-size:.74rem;font-weight:800;color:var(--muted);margin-bottom:.5rem}
.hre-pack__grid{display:grid;grid-template-columns:repeat(var(--cols,3),210px);gap:.55rem}

/* tree mode: top-down chart, connectors drawn with logical sides so RTL reads right-to-left */
.hre-org--tree{display:flex;align-items:flex-start;gap:1.2rem;width:max-content;margin-inline:auto;padding-bottom:.5rem}
.hre-org--tree ul{display:flex;justify-content:center;position:relative;padding-top:26px}
.hre-org--tree li{position:relative;display:flex;flex-direction:column;align-items:center;padding:26px 8px 0}
.hre-org--tree>li{padding-top:0}
.hre-org--tree .hre-node{width:220px}
.hre-org--tree .hre-node--org{width:auto;min-width:280px}
.hre-org--tree .hre-node--dept{width:240px}
.hre-org--tree .hre-pack .hre-node{width:210px}
.hre-org--tree li::before,.hre-org--tree li::after{content:"";position:absolute;top:0;inset-inline-end:50%;width:50%;height:26px;border-top:1.5px solid #b8c3d1}
.hre-org--tree li::after{inset-inline-end:auto;inset-inline-start:50%;border-inline-start:1.5px solid #b8c3d1}
.hre-org--tree>li::before,.hre-org--tree>li::after{display:none}
.hre-org--tree li:only-child::before{display:none}
.hre-org--tree li:only-child::after{border-top:0}
.hre-org--tree li:first-child::before,.hre-org--tree li:last-child::after{border:0 none}
.hre-org--tree li:last-child::before{border-inline-end:1.5px solid #b8c3d1;border-start-end-radius:8px}
.hre-org--tree li:first-child::after{border-start-start-radius:8px}
.hre-org--tree li:only-child::after{border-start-start-radius:0}
.hre-org--tree ul::before{content:"";position:absolute;top:0;inset-inline-start:50%;height:26px;border-inline-start:1.5px solid #b8c3d1}

/* list mode: indented, used on phones and on demand */
.hre-org--list{display:flex;flex-direction:column;gap:.4rem}
.hre-org--list ul{display:flex;flex-direction:column;gap:.4rem;margin-top:.4rem;margin-inline-start:1.1rem;padding-inline-start:.8rem;border-inline-start:1.5px solid #dbe2ea}
.hre-org--list .hre-node{width:100%;max-width:520px}
.hre-org--list .hre-node--dept{justify-content:flex-start}
.hre-org--list .hre-node--dept .hre-node__t{align-items:flex-start;text-align:start}
.hre-org--list .hre-pack{background:none;border:0;padding:0}
.hre-org--list .hre-pack__h{display:none}
.hre-org--list .hre-pack__grid{display:flex;flex-direction:column;gap:.4rem}

@media (max-width:640px){
  .hre-head{gap:.8rem}
  .hre-av--xl{width:64px;height:64px;font-size:1.5rem}
  .hre-head__act{width:100%}
  .hre-head__act .btn{flex:1;justify-content:center}
  .hre-dl>div{grid-template-columns:1fr;gap:.1rem}
  .hre-org-scroll{padding:52px .6rem .6rem;height:78vh}
  .hre-org-card.is-list .hre-org-scroll{padding:.6rem;max-height:none}
  .hre-org-card.is-full{inset:0;border-radius:0}
  .hre-org--list ul{margin-inline-start:.5rem;padding-inline-start:.5rem}
  .hre-search{min-width:0;flex-basis:100%}
  .hre-person small{white-space:normal}
}

/* ---- extra managers picker ---- */
.hre-mgrs{border:1px solid #e3e8ef;border-radius:10px;padding:.5rem;background:#fff}
.hre-mgrs__q{margin-bottom:.4rem}
.hre-mgrs__list{max-height:180px;overflow:auto;display:flex;flex-direction:column;gap:.1rem}
.hre-mgrs__item{margin:0;padding:.3rem .4rem;border-radius:8px;font-weight:600}
.hre-mgrs__item:hover{background:#f6f8fb}
.hre-mgrs__item small{color:#6b7280;font-weight:500;margin-inline-start:.3rem}
.hre-mgrs__item.is-direct{opacity:.5;cursor:not-allowed}
.hre-mgrs__item.is-direct span::after{content:" (المدير المباشر)";font-size:.75rem;color:#6b7280}
.hre-note{display:flex;gap:.5rem;align-items:flex-start;margin:.4rem 0 .6rem;padding:.6rem .75rem;background:#fff8ec;border:1px solid #fde3b5;border-radius:10px;font-size:.85rem;color:#7a4b0b;line-height:1.7}

/* ---- joining / leaving ---- */
.hre-banner{display:flex;align-items:center;justify-content:space-between;gap:1rem;flex-wrap:wrap;margin:.75rem 0 0;padding:.75rem 1rem;border-radius:12px;border:1px solid}
.hre-banner > div:first-child{display:flex;flex-direction:column;gap:.15rem;min-width:0}
.hre-banner span{font-size:.85rem;line-height:1.7}
.hre-banner__act{display:flex;gap:.5rem;flex-wrap:wrap}
.hre-banner--warn{background:#fff8ec;border-color:#fde3b5;color:#7a4b0b}
.hre-banner--bad{background:#fdf1f1;border-color:#f6c9c9;color:#8f1d16}
.hre-banner--muted{background:#f4f6f9;border-color:#e3e8ef;color:#3f4754}
.hre-warnbox{display:flex;gap:.6rem;padding:.7rem .85rem;background:#fdf1f1;border:1px solid #f6c9c9;border-radius:10px;color:#8f1d16;font-size:.85rem;line-height:1.7}
.hre-warnbox ul{margin:.25rem 0 0;padding-inline-start:1.1rem}
.btn.hre-danger-btn{background:#b3261e;border-color:#b3261e}
.btn.hre-danger-btn:hover{background:#8f1d16;border-color:#8f1d16}

/* «استيراد كشف الموظفين» */
.hri{display:flex;flex-direction:column;gap:.8rem}
.hri-drop{display:flex;flex-direction:column;align-items:center;gap:.5rem;text-align:center;padding:2.4rem 1.2rem;border:2px dashed #cbd5e1;border-radius:14px;
  background:#f8fafc;color:var(--ink);cursor:pointer;transition:border-color .15s,background .15s}
.hri-drop:hover,.hri-drop.is-over{border-color:var(--blue-d,#1f6f8f);background:#eef6fb}
.hri-drop small{max-width:560px;color:var(--muted);line-height:1.7}
.hri-head{display:flex;align-items:center;justify-content:space-between;gap:.6rem;flex-wrap:wrap;font-size:.88rem}
.hri-chips{display:flex;flex-wrap:wrap;gap:.4rem}
.hri-chip{border:1px solid #dbe2ea;background:#fff;border-radius:999px;padding:.3rem .8rem;font:inherit;font-size:.8rem;font-weight:700;color:var(--ink);cursor:pointer;transition:background .15s,border-color .15s}
.hri-chip:hover{border-color:#94a3b8}
.hri-chip.is-on{background:var(--dark,#1f2937);border-color:var(--dark,#1f2937);color:#fff}
.hri-chip--name_match:not(.is-on){border-color:#f5c27a;color:#92400e}
.hri-chip--skip:not(.is-on){border-color:#f3b4ae;color:#b3261e}
.hri-secs{border:1px solid #e5e9ef;border-radius:12px;padding:.6rem .8rem;background:#fff}
.hri-secs summary{cursor:pointer;font-weight:800;font-size:.88rem}
.hri-secs .hr-table{margin-top:.6rem}
.hri-secs .in{min-width:170px}
.hri-list{display:flex;flex-direction:column;gap:.55rem}
.hri-row{border:1px solid #e5e9ef;border-radius:12px;padding:.7rem .9rem;background:#fff;border-inline-start:4px solid #cbd5e1}
.hri-row--linked,.hri-row--link{border-inline-start-color:#16a34a}
.hri-row--file,.hri-row--new_account{border-inline-start-color:#2b8ab3}
.hri-row--name_match{border-inline-start-color:#d97706}
.hri-row--skip{border-inline-start-color:#dc2626;background:#fffafa}
.hri-row.is-off{opacity:.6}
.hri-row header{display:grid;grid-template-columns:minmax(0,1.3fr) minmax(0,1.2fr) auto;gap:.8rem;align-items:start}
.hri-who{display:flex;flex-direction:column;gap:.1rem;min-width:0}
.hri-who small{font-size:.76rem;color:var(--muted);overflow-wrap:anywhere}
.hri-state{display:flex;flex-direction:column;align-items:flex-start;gap:.25rem;font-size:.78rem}
.hri-state a{color:var(--blue-d,#1f6f8f);font-weight:700}
.hri-acc{display:inline-flex;align-items:center;gap:.3rem;color:#166534;font-weight:700}
.hri-acc.is-none{color:var(--muted);font-weight:600}
.hri-act .in{min-width:170px}
.hri-changes{list-style:none;margin:.6rem 0 0;padding:.5rem .6rem;display:flex;flex-direction:column;gap:.3rem;background:#f8fafc;border-radius:10px;font-size:.82rem}
.hri-changes li{display:flex;align-items:center;gap:.45rem;flex-wrap:wrap}
.hri-changes label{display:inline-flex;align-items:center;gap:.4rem;font-weight:700;cursor:pointer;min-width:120px}
.hri-changes input{width:15px;height:15px;accent-color:var(--dark)}
.hri-changes s{color:#94a3b8}
.hri-changes em{font-style:normal;color:#166534;font-size:.76rem}
.hri-changes li.is-new span{min-width:120px;color:var(--muted);font-weight:700}
.hri-changes li.is-change b{color:#92400e}
.hri-changes li.is-fill b{color:#166534}
.hri-note{margin:.45rem 0 0;font-size:.78rem;color:#92400e;background:#fff8ec;border-radius:8px;padding:.35rem .6rem}
.hri-note.is-ok{color:#166534;background:#eefaf1}
.hri-note.is-bad{color:#b3261e;background:#fdeeee}
.hri-done{display:flex;flex-direction:column;gap:.8rem}
.hri-errs{margin:0;padding-inline-start:1.2rem;display:flex;flex-direction:column;gap:.3rem;font-size:.85rem}
@media (max-width:720px){
  .hri-row header{grid-template-columns:1fr}
  .hri-act .in{width:100%}
}
.modal--full .modal__b.hr-modal{max-height:none}
.hri-secs td small{display:block;margin-top:.15rem}
