/* EMF Org Map (people). Department colours are set per card via --c; the department
   name is always printed on the card, so colour is never the only identifier. */
:root { --om-up: #16a34a; --om-down: #eab308; --om-edge: #b8c0ca; --om-stage: #eef1f4; }
@media (prefers-color-scheme: dark) { :root:not([data-theme="light"]) { --om-up: #4ade80; --om-down: #facc15; --om-edge: #4b525c; --om-stage: #15181c; } }
:root[data-theme="dark"] { --om-up: #4ade80; --om-down: #facc15; --om-edge: #4b525c; --om-stage: #15181c; }

.om-loading { padding: 40px; text-align: center; color: var(--ink-3); }
.om-legend-lines { display: flex; gap: 16px; align-items: center; flex-wrap: wrap; font-size: 12px; color: var(--ink-2); }
.om-legend-lines .ln { display: inline-block; width: 26px; height: 0; border-top: 3px solid; vertical-align: middle; margin-inline-end: 6px; border-radius: 2px; }
.om-legend-lines .ln.up { border-color: var(--om-up); box-shadow: 0 0 6px var(--om-up); }
.om-legend-lines .ln.down { border-color: var(--om-down); box-shadow: 0 0 6px var(--om-down); }

.om-toolbar { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; margin-bottom: 8px; }
.om-toolbar input[type=search], .om-toolbar select { background: var(--surface); border: 1px solid var(--line-strong); border-radius: 8px; padding: 7px 10px; }
.om-toolbar input[type=search] { flex: 1 1 240px; min-width: 200px; }
.om-toolbar .btn { padding: 6px 12px; }
.om-icon { width: 34px; padding: 6px 0 !important; font-size: 16px; line-height: 1; }
.om-sep { flex: 1; }
.om-check { display: inline-flex; gap: 6px; align-items: center; font-size: 13px; color: var(--ink-2); }

.om-chips { display: flex; flex-wrap: wrap; gap: 6px; margin-bottom: 8px; }
.om-chip { display: inline-flex; align-items: center; gap: 6px; border: 1px solid var(--line-strong); background: var(--surface); color: var(--ink); border-radius: 999px; padding: 3px 10px; font-size: 12px; cursor: pointer; }
.om-chip i { width: 10px; height: 10px; border-radius: 50%; background: var(--c); display: inline-block; }
.om-chip b { color: var(--ink-3); font-weight: 600; }
.om-chip.on { border-color: var(--c); box-shadow: inset 0 0 0 1px var(--c); background: color-mix(in srgb, var(--c) 12%, var(--surface)); }
.om-issues { font-size: 12px; margin-bottom: 8px; color: var(--warn-ink); }
.om-issues summary { cursor: pointer; }
.om-issues ul { margin: 6px 0 0; padding-inline-start: 18px; color: var(--ink-2); }

.om-chain { font-size: 13px; background: var(--surface); border: 1px solid var(--line); border-radius: 8px; padding: 8px 12px; margin-bottom: 8px; min-height: 38px; }
.om-link { background: none; border: 0; padding: 0; color: var(--brand); cursor: pointer; text-decoration: underline; font: inherit; }
.om-pill { display: inline-block; border-radius: 999px; padding: 0 8px; font-size: 12px; font-weight: 600; }
.om-pill.up { background: color-mix(in srgb, var(--om-up) 18%, transparent); color: var(--good-ink); }
.om-pill.down { background: color-mix(in srgb, var(--om-down) 25%, transparent); color: var(--warn-ink); }
.om-pill.deep { background: var(--surface-2); color: var(--ink-2); }

.om-stage { position: relative; height: calc(100vh - 330px); min-height: 460px; overflow: hidden; background: var(--om-stage); border: 1px solid var(--line); border-radius: 10px; cursor: grab; touch-action: none;
  background-image: radial-gradient(circle, color-mix(in srgb, var(--ink-3) 25%, transparent) 1px, transparent 1px); background-size: 22px 22px; }
.om-stage.grab { cursor: grabbing; }
.om-world { position: absolute; left: 0; top: 0; transform-origin: 0 0; }
.om-edges { position: absolute; left: 0; top: 0; overflow: visible; pointer-events: none; }
.om-edge { fill: none; stroke: var(--om-edge); stroke-width: 1.6; transition: opacity .2s; }
.om-edge.om-dim { opacity: .35; }
.om-edge.om-out { opacity: .15; }
.om-hl { fill: none; stroke-width: 3.2; stroke-linecap: round; stroke-linejoin: round; stroke-dasharray: 10 7; animation: omFlow 1.1s linear infinite; }
.om-hl.up { stroke: var(--om-up); filter: url(#omGlowG); animation-direction: reverse; }
.om-hl.down { stroke: var(--om-down); filter: url(#omGlowY); }
.om-hl.deep { stroke: var(--om-down); stroke-width: 1.8; opacity: .55; animation: none; stroke-dasharray: none; }
@keyframes omFlow { to { stroke-dashoffset: -34; } }
@media (prefers-reduced-motion: reduce) { .om-hl { animation: none; stroke-dasharray: none; } }

.om-card { position: absolute; width: 220px; height: 86px; display: flex; background: var(--surface); border: 1px solid var(--line-strong); border-radius: 10px; box-shadow: 0 1px 3px rgba(16,24,40,.12);
  cursor: pointer; overflow: hidden; transition: opacity .2s, box-shadow .2s, transform .15s; color: var(--ink); }
.om-card:hover { box-shadow: 0 4px 14px rgba(16,24,40,.18); }
.om-band { width: 7px; flex: none; background: var(--c); }
.om-body { padding: 8px 30px 6px 10px; min-width: 0; display: flex; flex-direction: column; gap: 1px; }
.om-name { font-weight: 700; font-size: 13px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.om-desig { font-size: 11.5px; color: var(--ink-2); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.om-meta { display: flex; gap: 6px; font-size: 10.5px; color: var(--ink-3); margin-top: auto; min-width: 0; align-items: center; }
.om-dept { color: color-mix(in srgb, var(--c) 75%, var(--ink)); font-weight: 600; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.om-tag { font-size: 10px; border-radius: 4px; padding: 0 5px; background: var(--surface-2); border: 1px solid var(--line); white-space: nowrap; }
.om-tag.ed { background: var(--info-bg); color: var(--brand); border-color: transparent; }
.om-gear { position: absolute; top: 4px; right: 4px; width: 24px; height: 24px; border-radius: 6px; border: 0; background: transparent; color: var(--ink-3); cursor: pointer; font-size: 15px; line-height: 1; }
.om-gear:hover, .om-gear:focus-visible { background: var(--surface-2); color: var(--ink); }
.om-toggle { position: absolute; bottom: 4px; right: 4px; border: 1px solid var(--line); background: var(--surface-2); color: var(--ink-2); border-radius: 999px; font-size: 10.5px; padding: 0 7px; cursor: pointer; }
.om-card.ph { border-style: dashed; background: color-mix(in srgb, var(--surface) 70%, transparent); }
.om-card.ph .om-name { color: var(--ink-2); }
.om-card.sel { box-shadow: 0 0 0 3px var(--c), 0 6px 20px rgba(16,24,40,.25); transform: translateY(-2px); z-index: 3; }
.om-card.om-up { box-shadow: 0 0 0 2px var(--om-up), 0 0 14px color-mix(in srgb, var(--om-up) 60%, transparent); }
.om-card.om-down { box-shadow: 0 0 0 2px var(--om-down), 0 0 14px color-mix(in srgb, var(--om-down) 60%, transparent); }
.om-card.om-deep { box-shadow: 0 0 0 1px color-mix(in srgb, var(--om-down) 60%, transparent); }
.om-card.om-dim { opacity: .38; }
.om-card.om-out { opacity: .14; }
.om-card.om-out.sel, .om-card.om-out.om-up, .om-card.om-out.om-down { opacity: .55; }

.om-drawer { position: fixed; top: 0; inset-inline-end: 0; width: min(440px, 100vw); height: 100vh; background: var(--surface); border-inline-start: 1px solid var(--line); box-shadow: -8px 0 30px rgba(0,0,0,.18); z-index: 40; display: flex; flex-direction: column; }
.om-dhead { padding: 18px 20px 14px; border-top: 6px solid var(--c); border-bottom: 1px solid var(--line); position: relative; }
.om-dname { font-size: 18px; font-weight: 700; padding-inline-end: 30px; }
.om-dmeta { font-size: 12px; color: var(--ink-3); margin-top: 6px; display: flex; align-items: center; gap: 6px; flex-wrap: wrap; }
.om-dot { width: 10px; height: 10px; border-radius: 50%; background: var(--c); display: inline-block; }
.om-x { position: absolute; top: 14px; inset-inline-end: 14px; border: 0; background: var(--surface-2); border-radius: 8px; width: 30px; height: 30px; cursor: pointer; color: var(--ink); }
.om-dbody { overflow: auto; padding: 14px 20px 30px; }
.om-dactions { display: flex; gap: 8px; margin-bottom: 10px; flex-wrap: wrap; }
.om-sec { border: 1px solid var(--line); border-radius: 8px; padding: 10px 12px; margin-bottom: 10px; }
.om-sec h3 { font-size: 12px; text-transform: uppercase; letter-spacing: .5px; color: var(--ink-3); margin: 0 0 8px; }
.om-sec dl { display: grid; grid-template-columns: 150px 1fr; gap: 5px 10px; margin: 0; font-size: 13px; }
.om-sec dt { color: var(--ink-3); }
.om-sec dd { margin: 0; overflow-wrap: anywhere; }
.om-sec dd input, .om-sec dd select { width: 100%; padding: 4px 6px; border: 1px solid var(--line-strong); border-radius: 6px; background: var(--surface); }
.om-sec.locked { background: var(--surface-2); }
.om-team { margin: 0; padding-inline-start: 18px; font-size: 13px; }
@media (max-width: 560px) { .om-sec dl { grid-template-columns: 1fr; } .om-stage { height: calc(100vh - 380px); } }

/* ---------- department zones (organised layout) ---------- */
.om-zone rect, .omp-zone rect { fill: color-mix(in srgb, var(--z) 7%, transparent); stroke: color-mix(in srgb, var(--z) 45%, transparent); stroke-width: 1.2; stroke-dasharray: 5 4; }
.om-zone text, .omp-zone text { fill: color-mix(in srgb, var(--z) 80%, var(--ink)); font: 600 13px var(--font); letter-spacing: .2px; }
.om-zone.om-dim { opacity: .45; }
.om-zone-lane, .omp-zone-lane { stroke: var(--line-strong); stroke-width: 2; stroke-dasharray: 2 6; }

/* ---------- print dialog ---------- */
.om-modal { position: fixed; inset: 0; background: rgba(10,14,20,.45); z-index: 70; display: grid; place-items: center; padding: 16px; }
.om-modal-card { background: var(--surface); color: var(--ink); border-radius: 12px; padding: 20px 22px; width: min(460px, 100%); box-shadow: 0 20px 50px rgba(0,0,0,.3); }
.om-modal-card h2 { margin: 0 0 12px; }
.om-modal-card fieldset { border: 1px solid var(--line); border-radius: 8px; margin: 0 0 12px; padding: 8px 12px 10px; }
.om-modal-card legend { font-size: 12px; color: var(--ink-3); padding: 0 4px; }
.om-modal-card label { display: flex; gap: 8px; align-items: baseline; padding: 4px 0; font-size: 14px; }

/* ---------- print output ---------- */
#omPrintRoot { display: none; }
@media print {
  body.om-printing > *:not(#omPrintRoot) { display: none !important; }
  body.om-printing { background: #fff !important; }
  body.om-printing #omPrintRoot { display: block !important; }
  #omPrintRoot { --surface: #ffffff; --surface-2: #f3f5f8; --ink: #1c2430; --ink-2: #3f4856; --ink-3: #6b7480; --line: #dfe3e8; --line-strong: #c3cad3;
    --brand: #285A39; --info-bg: #e5effb; --font: Arial, Helvetica, sans-serif; color: #1c2430; font-family: Arial, Helvetica, sans-serif;
    -webkit-print-color-adjust: exact; print-color-adjust: exact; }
  .omp-page { break-after: page; page-break-after: always; break-inside: avoid; }
  .omp-page:last-child { break-after: auto; page-break-after: auto; }
  .omp-head { display: flex; align-items: center; gap: 14px; border-bottom: 2.5px solid #347C4C; padding-bottom: 6px; margin-bottom: 6px; }
  .omp-logo { height: 46px; width: auto; }
  .omp-titles { flex: 1; min-width: 0; }
  .omp-title { font-size: 17px; font-weight: 700; color: #285A39; }
  .omp-sub { font-size: 10.5px; color: #4a5462; }
  .omp-right { font-size: 9.5px; color: #4a5462; text-align: right; line-height: 1.35; }
  .omp-legend { display: flex; flex-wrap: wrap; gap: 4px 12px; font-size: 9.5px; color: #3f4856; margin-bottom: 6px; }
  .omp-legend i { display: inline-block; width: 9px; height: 9px; border-radius: 50%; margin-right: 4px; vertical-align: -1px; }
  .omp-fit { position: relative; overflow: hidden; margin: 0 auto; }
  .omp-world { position: absolute; left: 0; top: 0; transform-origin: 0 0; }
  .omp-svg { position: absolute; left: 0; top: 0; }
  .omp-edge { fill: none; stroke: #9aa3ad; stroke-width: 1.6; }
  #omPrintRoot .om-card { box-shadow: none; border-color: #c3cad3; background: #fff; }
  #omPrintRoot .om-card.ph { background: #f7f8fa; }
  #omPrintRoot .om-toggle { border-color: #dfe3e8; background: #f3f5f8; color: #3f4856; }
}

/* ---------- grade badge ---------- */
.om-grade { display: inline-block; margin-left: auto; font-size: 10px; font-weight: 700; border-radius: 5px; padding: 0 5px; background: #285A39; color: #fff; white-space: nowrap; }
.om-grade.below { background: #f2b01e; color: #3b2a00; }
.om-grade.above { background: #2a78d6; color: #fff; }
.om-grade.none { background: var(--surface-2); color: var(--ink-3); border: 1px dashed var(--line-strong); }
.om-grade.prop { outline: 1.5px dashed currentColor; outline-offset: 1px; }
.om-gsec { border-color: color-mix(in srgb, #347C4C 40%, var(--line)); }
.om-meta .om-grade { flex: none; }

/* ---------- dock & full screen ---------- */
.om-dock-brand { display: none; }
.om-fs-only { display: none !important; }
.om-div { width: 1px; align-self: stretch; background: var(--line); margin: 0 2px; }
.om-root.om-fs { display: flex; flex-direction: column; gap: 6px; width: 100vw; height: 100vh; padding: 8px 10px; background: var(--bg); color: var(--ink); overflow: hidden; box-sizing: border-box; }
.om-root:fullscreen { background: var(--bg); }
.om-root.om-pseudo { position: fixed; inset: 0; z-index: 60; }
.om-fs .om-head, .om-fs .om-issues { display: none; }
.om-fs .om-fs-only { display: inline-flex !important; align-items: center; justify-content: center; }
.om-fs .om-dock { display: flex; align-items: center; gap: 8px; background: var(--surface); border: 1px solid var(--line); border-radius: 10px; padding: 5px 8px; box-shadow: var(--shadow); flex: none; }
.om-fs .om-dock-brand { display: flex; align-items: center; gap: 6px; flex: none; font-size: 13px; color: var(--brand); padding-right: 6px; border-right: 1px solid var(--line); }
.om-fs .om-dock-brand img { height: 30px; width: auto; }
.om-fs .om-toolbar { flex: 1; flex-wrap: nowrap; overflow-x: auto; margin: 0; gap: 6px; scrollbar-width: thin; padding: 1px; }
.om-fs .om-toolbar input[type=search] { flex: 1 1 170px; min-width: 150px; padding: 5px 8px; }
.om-fs .om-toolbar select { padding: 5px 6px; max-width: 170px; flex: none; }
.om-fs .om-toolbar .btn { padding: 5px 9px; white-space: nowrap; flex: none; }
.om-fs .om-check { white-space: nowrap; flex: none; font-size: 12px; }
.om-fs .om-lbl, .om-fs .om-sep { display: none; }
.om-fs .om-chips { flex-wrap: nowrap; overflow-x: auto; margin: 0; padding-bottom: 2px; flex: none; scrollbar-width: thin; }
.om-fs .om-chip { flex: none; padding: 2px 8px; font-size: 11px; }
.om-fs .om-chain { margin: 0; min-height: 0; padding: 5px 10px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; font-size: 12px; flex: none; }
.om-fs .om-stage { flex: 1; height: auto; min-height: 0; }

/* ---------- group companies (EMF / IFI / MADA) logo filter ---------- */
.om-co-group { display: inline-flex; gap: 4px; padding: 2px; border: 1px solid var(--line); border-radius: 10px; background: var(--surface-2, var(--surface)); flex: none; }
.om-co-btn { display: inline-flex; align-items: center; gap: 4px; height: 30px; padding: 2px 7px; border: 1px solid transparent; border-radius: 8px; background: #fff; cursor: pointer; opacity: .8; }
.om-co-btn img { height: 22px; width: auto; display: block; }
.om-co-btn img.om-co-word { height: 10px; }
.om-co-btn b { font: 600 11px var(--font); color: #5b6270; }
.om-co-btn:hover { opacity: 1; }
.om-co-btn.on { opacity: 1; border-color: var(--brand); box-shadow: 0 0 0 2px color-mix(in srgb, var(--brand) 35%, transparent); }
.om-co-btn:focus-visible { outline: 2px solid var(--brand); outline-offset: 1px; }
.om-co-mark { height: 13px; width: auto; flex: none; border-radius: 3px; background: #fff; padding: 1px 2px; }
.om-fs .om-co-btn { height: 26px; }
.om-fs .om-co-btn img { height: 18px; }
@media print { .om-co-group { display: none; } }

.om-gsec .om-sal { width: 140px; padding: 4px 8px; }