/* ============================================================
   n3flow — Panel operatora N3XARO (widok prywatny / demo)
   Command center: sidebar + topbar + karta leada
   Rozszerza tokeny z styles.css
   ============================================================ */

body.op{background:var(--bg-void)}

.opshell{display:grid;grid-template-columns:248px 1fr;min-height:100vh}

/* ---------- Sidebar ---------- */
.opside{
  position:sticky;top:0;height:100vh;background:var(--bg-base);border-right:1px solid var(--border);
  display:flex;flex-direction:column;padding:20px 14px;
}
.opside__brand{display:flex;align-items:center;gap:10px;padding:6px 8px 18px;border-bottom:1px solid var(--border);margin-bottom:14px}
.opside__brand .brand__mark{filter:drop-shadow(0 0 8px var(--glow))}
.opside__brand b{font-family:var(--font-d);font-weight:700;color:var(--text-hi);font-size:1.15rem}
.opside__brand span{display:block;font-family:var(--font-m);font-size:.54rem;letter-spacing:.18em;color:var(--text-dim)}
.opnav{display:flex;flex-direction:column;gap:3px;flex:1}
.opnav a{display:flex;align-items:center;gap:12px;padding:10px 12px;border-radius:var(--r-sm);color:var(--text-dim);font-size:.9rem;transition:.2s}
.opnav a:hover{background:rgba(255,255,255,.03);color:var(--text-hi)}
.opnav a.is-active{background:rgba(163,230,53,.08);color:var(--accent)}
.opnav a .ic{width:18px;text-align:center}
.opnav a .badge{margin-left:auto;font-family:var(--font-m);font-size:.62rem;background:var(--accent);color:#0A1005;border-radius:50px;padding:1px 7px}
.opside__foot{border-top:1px solid var(--border);padding-top:14px;font-family:var(--font-m);font-size:.66rem;color:var(--text-dim)}
.opside__user{display:flex;align-items:center;gap:10px;margin-bottom:10px}
.opside__avatar{width:30px;height:30px;border-radius:50%;background:linear-gradient(135deg,var(--accent),var(--cyan));display:grid;place-items:center;color:#0A1005;font-weight:700;font-family:var(--font-d);font-size:.8rem}

/* ---------- Topbar ---------- */
.opbar{
  position:sticky;top:0;z-index:20;display:flex;align-items:center;gap:16px;
  background:rgba(8,12,20,.85);backdrop-filter:blur(14px);border-bottom:1px solid var(--border);
  padding:14px clamp(18px,3vw,32px);
}
.opbar__burger{display:none;flex-direction:column;gap:5px}
.opbar__burger span{width:22px;height:2px;background:var(--text-hi);border-radius:2px}
.opbar__crumb{font-family:var(--font-m);font-size:.78rem;color:var(--text-dim);display:flex;gap:8px;align-items:center}
.opbar__crumb a{color:var(--text-dim)}.opbar__crumb a:hover{color:var(--accent)}
.opbar__crumb .cur{color:var(--text-hi)}
.opbar__demo{margin-left:auto;font-family:var(--font-m);font-size:.64rem;letter-spacing:.08em;color:#F5C04A;border:1px solid rgba(245,192,74,.35);background:rgba(245,192,74,.08);border-radius:50px;padding:5px 11px}
.opbar__search{display:none}

.opmain{padding:clamp(18px,3vw,30px) clamp(18px,3vw,32px) 120px;max-width:1180px}

/* ---------- Lead header ---------- */
.lead-top{display:flex;flex-wrap:wrap;gap:18px;align-items:flex-start;margin-bottom:22px}
.lead-top__main{flex:1;min-width:260px}
.lead-id{font-family:var(--font-m);font-size:.78rem;color:var(--text-dim);display:flex;align-items:center;gap:9px;margin-bottom:8px}
.lead-id i{width:9px;height:9px;border-radius:50%;background:var(--c,var(--accent))}
.lead-id .src{margin-left:4px}
.lead-top h1{font-size:clamp(1.4rem,2.6vw,2rem);color:var(--text-hi);line-height:1.18;margin-bottom:10px}
.lead-sub{display:flex;flex-wrap:wrap;gap:8px;align-items:center;font-size:.85rem;color:var(--text-dim)}
.lead-sub .pin{display:inline-flex;gap:6px;align-items:center}

/* score ring */
.score-ring{flex-shrink:0;display:flex;align-items:center;gap:14px;background:var(--bg-panel);border:1px solid var(--border);border-radius:var(--r);padding:16px 20px}
.ring{--p:0;--col:var(--accent);width:74px;height:74px;border-radius:50%;display:grid;place-items:center;
  background:radial-gradient(closest-side,var(--bg-panel) 78%,transparent 79% 100%),conic-gradient(var(--col) calc(var(--p)*1%),rgba(255,255,255,.08) 0)}
.ring b{font-family:var(--font-m);font-size:1.25rem;color:var(--text-hi)}
.score-ring__lbl{font-size:.72rem;color:var(--text-dim);font-family:var(--font-m);line-height:1.5}
.score-ring__lbl b{display:block;color:var(--text-hi);font-size:.92rem;font-family:var(--font-d)}

/* status stepper */
.stepper{display:flex;flex-wrap:wrap;gap:6px;margin-bottom:24px}
.step-chip{font-family:var(--font-m);font-size:.72rem;padding:8px 14px;border-radius:50px;border:1px solid var(--border);color:var(--text-dim);cursor:pointer;transition:.2s;display:flex;align-items:center;gap:7px}
.step-chip:hover{border-color:var(--border-accent);color:var(--text)}
.step-chip.done{color:var(--accent);border-color:var(--border-accent)}
.step-chip.is-active{background:var(--accent);color:#0A1005;border-color:var(--accent);font-weight:600}

/* ---------- Grid ---------- */
.op-grid{display:grid;grid-template-columns:1.5fr 1fr;gap:20px;align-items:start}
.op-col{display:flex;flex-direction:column;gap:20px}

.op-card{background:var(--bg-panel);border:1px solid var(--border);border-radius:var(--r);padding:22px}
.op-card__h{display:flex;align-items:center;gap:10px;margin-bottom:16px}
.op-card__h h2{font-size:1.05rem;color:var(--text-hi)}
.op-card__h .tag-priv{font-family:var(--font-m);font-size:.58rem;letter-spacing:.06em;color:#F0938B;border:1px solid rgba(229,86,75,.3);background:rgba(229,86,75,.07);border-radius:50px;padding:2px 8px}
.op-card__h .tag-pub{font-family:var(--font-m);font-size:.58rem;letter-spacing:.06em;color:var(--accent);border:1px solid var(--border-accent);background:rgba(163,230,53,.06);border-radius:50px;padding:2px 8px}
.op-card__h .ic{color:var(--accent)}

/* data rows */
.drow{display:flex;justify-content:space-between;gap:14px;padding:11px 0;border-bottom:1px solid var(--border);font-size:.9rem}
.drow:last-child{border-bottom:none}
.drow__k{color:var(--text-dim);font-family:var(--font-m);font-size:.74rem;padding-top:2px;flex-shrink:0}
.drow__v{color:var(--text-hi);text-align:right}
.drow__v a{color:var(--cyan)}
.drow__v.mono{font-family:var(--font-m);font-size:.84rem}
.note-box{background:var(--bg-void);border:1px solid var(--border);border-left:3px solid var(--accent);border-radius:var(--r-sm);padding:13px 15px;font-size:.9rem;color:var(--text);margin-top:6px}

/* scoring block */
.score-reason{font-size:.9rem;color:var(--text);margin-top:8px}
.missing{display:flex;flex-wrap:wrap;gap:8px;margin-top:14px}
.missing .m{font-family:var(--font-m);font-size:.68rem;color:#F5C04A;border:1px dashed rgba(245,192,74,.4);border-radius:50px;padding:4px 10px}

/* public mini preview */
.pub-mini{background:var(--bg-void);border:1px solid var(--border-accent);border-radius:var(--r-sm);padding:14px 16px}
.pub-mini .pm-row{display:flex;justify-content:space-between;gap:12px;padding:6px 0;font-size:.84rem;border-bottom:1px solid var(--border)}
.pub-mini .pm-row:last-child{border-bottom:none}
.pub-mini .pm-k{color:var(--text-dim);font-family:var(--font-m);font-size:.7rem}
.pub-mini .pm-v{color:var(--text-hi)}

/* contractors */
.contractor{display:flex;align-items:center;gap:12px;padding:13px 0;border-bottom:1px solid var(--border)}
.contractor:last-child{border-bottom:none}
.contractor__match{flex-shrink:0;width:46px;height:46px;border-radius:12px;display:grid;place-items:center;font-family:var(--font-m);font-weight:600;font-size:.92rem}
.contractor__match.hi{background:rgba(163,230,53,.14);color:var(--accent)}
.contractor__match.mid{background:rgba(245,192,74,.12);color:#F5C04A}
.contractor__match.low{background:rgba(255,255,255,.06);color:var(--text-dim)}
.contractor__info{flex:1;min-width:0}
.contractor__name{color:var(--text-hi);font-weight:600;font-size:.94rem;font-family:var(--font-d)}
.contractor__meta{font-size:.76rem;color:var(--text-dim)}
.contractor__trust{font-family:var(--font-m);font-size:.6rem;border-radius:50px;padding:2px 7px;border:1px solid var(--border);color:var(--text-dim);margin-left:6px}
.contractor__trust.t-zaufany{color:var(--accent);border-color:var(--border-accent)}
.contractor__trust.t-aktywny{color:var(--cyan);border-color:rgba(56,232,200,.3)}
.contractor__call{flex-shrink:0;font-family:var(--font-d);font-weight:600;font-size:.8rem;color:#0A1005;background:var(--accent);border-radius:var(--r-sm);padding:8px 14px;transition:.2s}
.contractor__call:hover{background:var(--accent-bright)}

/* decision */
.decision{display:flex;flex-direction:column;gap:10px}
.dec-opt{display:flex;align-items:center;gap:12px;padding:12px 14px;border:1px solid var(--border);border-radius:var(--r-sm);cursor:pointer;transition:.2s}
.dec-opt:hover{border-color:var(--border-accent)}
.dec-opt input{accent-color:var(--accent);width:16px;height:16px}
.dec-opt.is-sel{border-color:var(--accent);background:rgba(163,230,53,.05)}
.dec-opt__t{font-weight:600;color:var(--text-hi);font-size:.9rem;font-family:var(--font-d)}
.dec-opt__d{font-size:.78rem;color:var(--text-dim)}
.dec-sugg{font-family:var(--font-m);font-size:.66rem;color:var(--accent);margin-bottom:6px;display:block}

/* timeline */
.timeline{position:relative}
.tl{position:relative;display:flex;gap:14px;padding:0 0 16px 4px}
.tl:not(:last-child)::after{content:"";position:absolute;left:8px;top:18px;bottom:-2px;width:1px;background:var(--border)}
.tl__dot{flex-shrink:0;width:17px;height:17px;border-radius:50%;border:2px solid var(--border-accent);background:var(--bg-panel);margin-top:2px;z-index:1}
.tl:last-child .tl__dot{background:var(--accent);border-color:var(--accent)}
.tl__t{font-size:.88rem;color:var(--text-hi)}
.tl__time{font-family:var(--font-m);font-size:.68rem;color:var(--text-dim)}

/* action bar */
.actionbar{
  position:fixed;left:248px;right:0;bottom:0;z-index:30;display:flex;gap:10px;flex-wrap:wrap;align-items:center;
  background:rgba(8,12,20,.92);backdrop-filter:blur(14px);border-top:1px solid var(--border);padding:14px clamp(18px,3vw,32px);
}
.actionbar__primary{display:flex;gap:10px;flex-wrap:wrap}
.actionbar__sec{margin-left:auto;display:flex;gap:10px;flex-wrap:wrap}
.abtn{font-family:var(--font-d);font-weight:600;font-size:.88rem;padding:11px 18px;border-radius:var(--r-sm);transition:.2s;border:1px solid var(--border);color:var(--text-hi);background:rgba(255,255,255,.02)}
.abtn:hover{border-color:var(--border-accent)}
.abtn--call{background:var(--accent);color:#0A1005;border-color:var(--accent)}
.abtn--call:hover{background:var(--accent-bright)}
.abtn--ghost{color:var(--text-dim)}

/* toast */
.toast{position:fixed;bottom:90px;left:50%;transform:translateX(-50%) translateY(20px);z-index:50;
  background:var(--bg-elevated);border:1px solid var(--border-accent);border-radius:var(--r);padding:14px 20px;
  color:var(--text-hi);font-size:.9rem;box-shadow:0 20px 50px -16px rgba(0,0,0,.7);opacity:0;pointer-events:none;transition:.3s var(--ease);max-width:90vw}
.toast.show{opacity:1;transform:translateX(-50%) translateY(0)}
.toast b{color:var(--accent)}

/* link back to public */
.back-pub{display:inline-flex;align-items:center;gap:8px;font-family:var(--font-m);font-size:.78rem;color:var(--cyan);margin-bottom:18px}
.back-pub:hover{color:var(--accent)}

/* ---------- Responsive ---------- */
@media(max-width:1000px){
  .op-grid{grid-template-columns:1fr}
}
@media(max-width:820px){
  .opshell{grid-template-columns:1fr}
  .opside{position:fixed;left:0;top:0;z-index:60;width:248px;transform:translateX(-110%);transition:transform .3s var(--ease)}
  .opside.is-open{transform:translateX(0)}
  .opbar__burger{display:flex}
  .actionbar{left:0}
  .actionbar__sec{display:none}
}