/* Belit Flow Color 04. Loaded last; palette and presentation only. */
:root {
  --color-bg:#f3f6fc;
  --flow-blue:#128bcc; --flow-blue-bg:#e2f1fc;
  --flow-purple:#7962c4; --flow-purple-bg:#eee7fc;
  --flow-green:#178973; --flow-green-bg:#e4f3ec;
  --blue-avatar-ivica:rgba(255,255,255,.16);
  --kpi-plavi-bg:var(--flow-blue-bg);
  --kpi-ljubicasti-bg:var(--flow-purple-bg);

  /* Boje koje koriste pravila ispod. Sva pravila gledaju token, nikad vrednost. */
  --flow-nav-aktivan:#126fa7;
  --flow-nav-traka:#76d0ff;
  --flow-zaglavlje-kraj:#386ba9;
  --flow-period:#dfedfa;
  --flow-plava-ivica:#cce3f4;
  --flow-ljubicasta-ivica:#e0d6f5;
  --flow-zelena-ivica:#cfe8da;
  --flow-nadnaslov:#213d58;
  --flow-broj:#102943;
  --flow-zaglavlje-tabele:#edf3fb;
  --flow-tekst-prigusen:#405c79;
  --flow-red-hover:#f0f7fe;
  --flow-tab-ivica:#dce5f0;
  --flow-tab-traka:#edf2fa;
  --flow-tab-hover:#e3ebf7;
  --flow-tab-aktivan:#deedfc;
  --flow-dugme:#087eb7;
  --flow-dugme-hover:#076c9e;
  --flow-admin-traka:#f1edfa;
  --flow-admin-aktivan:#e9e0fa;
  --flow-admin-tekst:#6443a4;
  --flow-kartica:#f5f8fc;
  --flow-tim-otvoren:#f7f5fd;
  --flow-na-tamnom:#fff;
  --flow-senka-kartice:rgb(5 31 62 / 9%);
}
.workspace-topbar{min-height:60px;padding-top:10px;padding-bottom:10px}
.page-heading{padding-top:20px;padding-bottom:16px}
.page-heading h1{font-size:1.6rem;letter-spacing:-.025em}
.page-description{margin-top:5px;font-size:.875rem}
.sidebar .nav-link{border-radius:8px}
.sidebar .nav-link[aria-current=page]{background:var(--flow-nav-aktivan);box-shadow:inset 3px 0 var(--flow-nav-traka)}
.sidebar .flow-nav-group{margin:22px 12px 8px;font-size:.6875rem;letter-spacing:.1em}
.profile-header{padding:18px 22px;gap:16px;margin-bottom:14px;background:linear-gradient(110deg,var(--brand-navy) 0%,var(--profile-end) 72%,var(--flow-zaglavlje-kraj) 100%)}
.profile-avatar{width:52px;height:52px;flex-basis:52px;font-size:1.15rem}
.profile-header .profile-identity h2#ovScope{color:var(--flow-na-tamnom);font-size:1.75rem;margin:0 0 5px;line-height:1.2;font-weight:650}
.profile-eyebrow{font-size:.6875rem;letter-spacing:.07em;margin-bottom:4px}
.profile-period{color:var(--flow-period);font-size:.8125rem}
.ledger-overview .controls{padding:12px 16px;gap:10px}
.ledger-overview .dateline{padding-bottom:12px}
.summary-grid{gap:16px;margin-bottom:18px}
.summary-card{padding:17px 20px;box-shadow:none;border:1px solid var(--flow-plava-ivica);border-top:3px solid var(--flow-blue);background:var(--flow-blue-bg)}
.summary-card:nth-child(2){background:var(--flow-purple-bg);border-color:var(--flow-ljubicasta-ivica);border-top-color:var(--flow-purple)}
.summary-card:nth-child(3){background:var(--flow-green-bg);border-color:var(--flow-zelena-ivica);border-top-color:var(--flow-green)}
.summary-card .kicker{font-size:.9375rem;font-weight:650;color:var(--flow-nadnaslov)}
.summary-value,.summary-card .total{font-size:2.25rem;margin:8px 0 5px;line-height:1.15;color:var(--flow-broj)}
section.block,.insight-card{box-shadow:none}
section.block{padding:20px;margin-bottom:18px}
.table thead th{background:var(--flow-zaglavlje-tabele);color:var(--flow-tekst-prigusen);font-weight:600}
.table tbody tr:hover{background:var(--flow-red-hover)}
.table td{padding-top:12px;padding-bottom:12px}
.tabs,.section-tabs{gap:6px;padding:5px 6px 0;margin-bottom:20px;border:0;border-bottom:1px solid var(--flow-tab-ivica);background:var(--flow-tab-traka);border-radius:10px 10px 0 0}
.tab,.section-tab{border:0;border-radius:6px 6px 0 0;background:transparent;box-shadow:none;color:var(--flow-tekst-prigusen);padding:12px 16px;font-weight:500}
.tab:hover,.section-tab:hover{background:var(--flow-tab-hover);color:var(--profile-end);border:0}
.tab.on,.section-tab.on,.tab.on:hover,.section-tab.on:hover{background:var(--flow-tab-aktivan);color:var(--profile-end);border:0;box-shadow:inset 0 -3px var(--flow-dugme);font-weight:650}
[data-page=admin] .tabs{background:var(--flow-admin-traka)}
[data-page=admin] .tab.on,[data-page=admin] .tab.on:hover{background:var(--flow-admin-aktivan);color:var(--flow-admin-tekst);box-shadow:inset 0 -3px var(--flow-purple)}
.flow-time-action{display:flex;justify-content:flex-end;margin-bottom:12px}
.flow-insights{background:var(--flow-na-tamnom);border:1px solid var(--color-divider);border-radius:12px;margin-bottom:18px}
.flow-insights>summary{padding:16px 20px;cursor:pointer;font-size:.9375rem;font-weight:600;color:var(--flow-tekst-prigusen)}
.flow-insights[open]>summary{border-bottom:1px solid var(--color-divider)}
.flow-insights .overview-insights{margin:0;padding:16px;gap:16px}
.flow-insights .insight-card{border:0;background:var(--flow-kartica)}
[data-overview-mode=projects] .flow-insights,[data-overview-mode=team] .flow-insights{display:none}
.tim-kartica[open],details.team-card[open]{background:var(--flow-tim-otvoren)}
.tim-kartica,details.team-card{border-radius:8px;padding:14px}
.tim-kartica>summary{flex-wrap:wrap;row-gap:5px}
.tim-kartica>summary::before{content:'›';color:var(--flow-purple);font-size:1.25rem}
.tim-kartica[open]>summary::before{content:'⌄'}
.btn{box-shadow:none}
.btn-primary{background:var(--flow-dugme);border-color:var(--flow-dugme);color:var(--flow-na-tamnom)}
.btn-primary:hover{background:var(--flow-dugme-hover);border-color:var(--flow-dugme-hover)}
a:focus-visible,button:focus-visible,summary:focus-visible,input:focus-visible,select:focus-visible{outline:3px solid var(--flow-blue);outline-offset:3px}
.auth-unified .auth-card{box-shadow:0 14px 45px var(--flow-senka-kartice)}
@media(max-width:860px){.profile-header{padding:18px}.flow-nav-group{display:none}.workspace-topbar{min-height:60px}}
@media(max-width:600px){
 .profile-header{gap:12px;padding:18px 16px}
 .profile-header .profile-identity h2#ovScope{font-size:1.5rem}
 .profile-identity{flex-basis:calc(100% - 68px)}
 .profile-header .field{max-width:none}
 .summary-grid{gap:10px}.summary-card{padding:16px}
 .summary-card .summary-value,.summary-card .total{font-size:2rem;margin:0}
 .tabs,.section-tabs{flex-wrap:nowrap;overflow-x:auto;gap:3px}
 .tab,.section-tab{flex:none;white-space:nowrap;padding:12px}
 section.block{padding:16px}.flow-insights .overview-insights{padding:10px}
 .flow-time-action .btn{width:100%;justify-content:center}
}
@media print{
 .profile-header .profile-identity h2#ovScope{color:var(--flow-broj)}
 .flow-time-action{display:none}
 .flow-insights .overview-insights{display:grid}
 .summary-card{background:var(--flow-na-tamnom)!important}
}