/* Mreža saradnji — graf i kartice (21.10.2026). Učitava se poslije profil.css. */
.ng-heading{margin:22px 0 26px!important;align-items:flex-end!important}
.ng-heading h1{font-size:clamp(30px,3vw,44px)!important;line-height:1.05;margin:10px 0 8px!important}
.ng-heading p{margin:0;max-width:60ch}
.ng-total{display:flex;flex-direction:column;align-items:flex-end;min-width:120px;padding:14px 22px;border:1px solid var(--line);border-radius:18px;background:var(--surface);font-size:40px!important;line-height:1}
.ng-total small{margin-top:6px}
.ng-workspace{border-radius:22px!important}
.ng-toolbar{flex-wrap:wrap;gap:14px 18px!important;padding:20px 24px 4px!important;border-bottom:0!important}
.ng-toolbar>label{flex:1 1 260px!important;font-weight:600;color:var(--muted)}
.ng-toolbar>.ng-peer-toggle{flex:0 0 auto!important;font-weight:500;color:var(--text);padding:0 4px}
.ng-extra-tools{display:flex!important;flex-wrap:wrap;align-items:end;gap:12px 16px;padding:14px 24px 20px!important;border-top:0!important;border-bottom:1px solid var(--line)}
.ng-extra-tools>label{display:grid;gap:8px;font-size:13px;font-weight:600;color:var(--muted)}
.ng-extra-tools select{min-height:44px;border-radius:10px}
.ng-extra-tools .btn{min-height:44px;border-radius:10px;font-size:13.5px}
.ng-extra-tools .btn[data-graph-share]{margin-left:auto}
.ng-status{padding:14px 24px 0!important}
.ng-layout{grid-template-columns:minmax(0,1fr) 340px!important}
.ng-scroll{min-height:420px;display:grid;align-items:center}
.ng-canvas{margin:12px auto!important}
.ng-node{width:218px!important;min-height:118px!important;padding:16px!important;border-radius:16px!important;gap:6px 14px!important;transition:border-color .15s ease,box-shadow .15s ease,transform .15s ease}
.ng-node:hover{transform:translate(-50%,calc(-50% - 2px))!important;box-shadow:0 14px 30px #0004}
.ng-node .avatar{width:52px!important;height:52px!important;border-radius:12px!important;font-size:15px!important}
.ng-node .company-logo{padding:5px}
.ng-node strong{font-size:14.5px!important;line-height:1.3!important}
.ng-node small{font-size:12.5px!important}
.ng-center{width:200px!important;min-height:150px!important;border-radius:18px!important;box-shadow:0 18px 40px #0005}
.ng-center strong{font-size:16px!important}
.ng-center small{font-size:12.5px!important}
.ng-legend{display:flex;gap:22px;flex-wrap:wrap;padding:10px 24px 4px;font-size:13px;color:var(--muted)}
.ng-pages{padding:14px 24px 22px!important}
.ng-pages .btn{min-height:42px;border-radius:10px}
.ng-inspector{position:sticky;top:88px;align-self:start;max-height:calc(100dvh - 108px);overflow:auto;padding:28px 26px!important}
.ng-inspector h2{font-size:24px!important}
.ng-inspector p{font-size:14.5px!important}
.ng-path-panel,.ng-suggestions{margin:0!important;border:0!important;border-top:1px solid var(--line)!important}
.ng-path-panel>summary,.ng-suggestions>summary{min-height:56px;display:flex;align-items:center;padding:0 24px;cursor:pointer;font-weight:700;font-size:15px}
.ng-suggestions{margin-top:22px!important;border:1px solid var(--line)!important;border-radius:18px;overflow:hidden;background:var(--surface)}
.ng-note{max-width:80ch;margin:18px 0 0;font-size:13.5px;line-height:1.55;color:var(--muted)}

/* kartice saradnika u tabu "Mreža saradnji" */
.network-visuals,.firm-network .collab-grid{gap:20px}
@media(max-width:1100px){.ng-layout{grid-template-columns:1fr!important}.ng-inspector{position:static;max-height:none;border-left:0!important;border-top:1px solid var(--line)}}
@media(max-width:700px){.ng-extra-tools .btn[data-graph-share]{margin-left:0}.ng-total{font-size:30px!important;padding:10px 16px}.ng-heading{align-items:flex-start!important}}
.ng-node{grid-template-columns:52px minmax(0,1fr)!important}
.ng-path-panel>summary,.ng-suggestions>summary{justify-content:space-between;list-style:none}
.ng-path-panel>summary::-webkit-details-marker,.ng-suggestions>summary::-webkit-details-marker{display:none}
.ng-path-panel>summary::after,.ng-suggestions>summary::after{content:"▾";color:var(--muted);transition:transform .15s ease}
.ng-path-panel[open]>summary::after,.ng-suggestions[open]>summary::after{transform:rotate(180deg)}

/* S5 QA (21.10): mobilni — Period/Broj firmi oznake i selekti su se preklapali
   (labele se skupe ispod širine teksta). Složi alatke u čitljiv raspored. */
@media(max-width:560px){
  .ng-extra-tools>label{flex:1 1 130px;min-width:0}
  .ng-extra-tools select{width:100%}
  .ng-extra-tools .btn{flex:1 1 100%;width:100%}
}
