/* ============================================================ cc-design.css — Cacarot dizajn sistem (#cc-root) Izvor istine za novi izgled modula. Linkovati POSLE cacarot-theme.css. Sve je scope-ovano pod #cc-root da ne dira ostatak app-a i da pobedi cacarot-theme po specifičnosti. Font: IBM Plex Sans (UI, pun ćir+lat) + JetBrains Mono. Učitati Google Fonts u . ============================================================ */ #cc-root { --bg:#eef2f8; --surface:#ffffff; --elevated:#f6f8fc; --line:#e4e9f1; --line-soft:#eef1f6; /* ink3 #9aa3b1 na #fff je bio 2.55:1 — pada WCAG AA (4.5:1) za sitan tekst (cc-stat-lab, cc-crumb, cc-sub...). #6b7684 daje 4.62:1 (audit 2026-07-04, Medium). */ --ink:#19212e; --ink2:#5b6677; --ink3:#626d7b; /* axe 21.09.2026: #6b7684 је на --bg/--elevated/--soft давао 4,1 / 4,3 / 4,0; #626d7b ≥ 4,5 на све три */ /* accent2 = hover/gradijent kraj: TAMNIJI od akcenta da bijeli tekst na dugmetu ostane ≥ 4.5:1 (#3f78e0 je davao 4.22 ✗; #2558b8 daje 6.4 ✓) */ --accent:#2b63cb; --accent2:#2558b8; --soft:#e8eefb; /* текст-акценат: #2f6ad6 на --soft = 4,3; #2b63cb = 4,8 (испуна остаје --accent-fill) */ /* --accent-fill: pozadina PUNIH dugmadi sa bijelim tekstom (u tamnoj temi --accent je svijetla za linkove, pa bijeli tekst na njoj pada — fill ostaje zasićen) */ --accent-fill:#2f6ad6; --ok:#1f9d63; --ok-s:#e8f6ee; --warn:#c8963a; --warn-s:#fbf4e6; --bad:#d95f5f; --bad-s:#fbeded; /* -ink varijante su za TEKST (AA na bijelom/-s pozadini): ok 5.9, warn 5.9, bad 5.0. Osnovne --ok/--warn/--bad ostaju za pozadine, ivice i ikone. */ --ok-ink:#17714a; --warn-ink:#8a6420; --bad-ink:#b34848; /* Истицање праваца по оријентацији на скици (клик на прстен станице) — 2–3 стила су довољна: 1 = пуна јача плава, 2 = испрекидана љубичаста, 3 = тачкаста тиркизна (в. .orij-ist-* ниже). */ --orij-ist-1:#2f6ad6; --orij-ist-2:#8a4fd0; --orij-ist-3:#0e8f84; /* --mono ide SAMO na sadržaj fajla i isječke koda (, 
, nalijepljeni
       tekst), gdje kolone zavise od fiksne širine znaka. Brojevi u tabelama,
       poljima i statistici idu na --num: isti IBM Plex Sans kao ostatak UI-ja,
       a poravnanje drži font-variant-numeric:tabular-nums niže. */
    --mono:'JetBrains Mono',monospace;
    --num:'IBM Plex Sans',sans-serif;
    --r1:6px; --r2:10px; --r3:14px; --r4:20px; --r-full:999px;
    /* скала величине фонта (DS-2/сједмица 5): само ове вриједности за нове стилове */
    --fs-2xs:.62rem; --fs-xs:.68rem; --fs-sm:.74rem; --fs-md:.8rem; --fs-base:.84rem; --fs-lg:.92rem; --fs-xl:1.02rem; --fs-2xl:1.2rem; --fs-3xl:1.5rem; --fs-4xl:1.9rem;
    --sh1:0 1px 2px rgba(27,35,48,.06); --sh2:0 8px 24px -12px rgba(27,35,48,.18);
    --sh3:0 18px 50px -28px rgba(27,35,48,.35);
    /* motion */
    --t-fast:.12s; --t-base:.2s; --t-slow:.3s; --ease:cubic-bezier(.4,0,.2,1);
    /* z-slojevi */
    --z-nav:50; --z-sticky:40; --z-seg:60; --z-modal:1000; --z-toast:1100;
    /* ── Aliasi cacarot-theme imena → cc tokeni (obrazac admin/base.html) — svaka
       strana umotana u #cc-root dobija cc paletu i bez izmjene markupa ── */
    --bg-base:var(--bg); --bg-surface:var(--surface); --bg-elevated:var(--elevated);
    --bg-overlay:var(--elevated); --bg-hover:var(--elevated); --bg-input:var(--surface);
    --border:var(--line); --border-subtle:var(--line-soft); --border-focus:var(--accent);
    --accent-hover:var(--accent2); --accent-dim:var(--soft);
    --text-primary:var(--ink); --text-secondary:var(--ink2); --text-muted:var(--ink3);
    --success:var(--ok); --success-dim:var(--ok-s); --success-ink:var(--ok-ink);
    --warning:var(--warn); --warning-dim:var(--warn-s); --warning-ink:var(--warn-ink);
    --danger:var(--bad); --danger-dim:var(--bad-s); --danger-ink:var(--bad-ink);
    --font-ui:'IBM Plex Sans',sans-serif; --font-mono:var(--mono);
    --radius-sm:var(--r1); --radius-md:var(--r2); --radius-lg:var(--r3); --radius-xl:var(--r4); --radius-full:var(--r-full);
    --shadow-sm:var(--sh1); --shadow-md:var(--sh2); --shadow-lg:var(--sh3); --shadow-xl:var(--sh3);
    font-family:'IBM Plex Sans',sans-serif; -webkit-font-smoothing:antialiased;
    /* цифре исте ширине — колоне бројева остају поравнате и без mono фонта */
    font-variant-numeric:tabular-nums;
    min-height:100vh; background:var(--bg); color:var(--ink); padding-bottom:96px;
    transition:background-color var(--t-slow) var(--ease),color var(--t-slow) var(--ease);
}
/* Поља за унос НЕ насљеђују tabular-nums. Firefox шаље сваки  кроз спорији
   пут обликовања текста кад је tnum укључен: изравнање 100 тачака / ~940 мјерења
   мјерено 09.09.2026 — 43/477/64 ms без tnum, 877/801/820 ms са tnum на свему,
   67/501/75 ms са овим искључењем (праг теста је 900 ms). Вриједности у пољима су
   лијево поравнате па tnum ту ионако ништа не поравнава. */
/* Поља за унос не насљеђују фонт по дефолту (пресретне их Arial из прегледача);
   `inherit` их враћа на UI фонт, а посебна правила ниже и даље добијају по
   специфичности (нпр. налијепљени сирови текст остаје на --mono). */
#cc-root input, #cc-root select, #cc-root textarea { font-family:inherit; font-variant-numeric:normal; }

/* Tamna tema: JEDAN izvor — html[data-theme="dark"] (postavlja _cc_head.html inline
   skripta prije CSS-a, mijenja theme-toggle.js). Stari #cc-root[data-theme] i
   body.light-theme mirror-i su uklonjeni. */
html[data-theme="dark"] #cc-root {
    --bg:#0c0f15; --surface:#141a23; --elevated:#1a212c; --line:#283041; --line-soft:#1f2733;
    --ink:#e6ebf3; --ink2:#9aa6b8; --ink3:#8a95a5; --soft:rgba(47,106,214,.18);
    /* link/tekst akcenat svjetliji: #2f6ad6 na #141a23 = 3.46 ✗, #6ea0ff = 7.0 ✓;
       accent2 (hover/gradijent) ostaje zasićen da bijeli tekst na dugmetu prođe */
    --accent:#6ea0ff; --accent2:#3068cc; --accent-fill:#3068cc;
    --ok-s:rgba(31,157,99,.16); --warn-s:rgba(200,150,58,.16); --bad-s:rgba(217,95,95,.16);
    --ok-ink:#3fc281; --warn-ink:#e0b05a; --bad-ink:#ef8a8a;
    --sh1:0 1px 2px rgba(0,0,0,.5); --sh2:0 8px 24px -10px rgba(0,0,0,.6); --sh3:0 18px 50px -28px rgba(0,0,0,.7);
    --orij-ist-1:#6ea0ff; --orij-ist-2:#b18ae8; --orij-ist-3:#35b8ac;
}
#cc-root *,#cc-root *::before,#cc-root *::after { box-sizing:border-box; }
#cc-root a { text-decoration:none; }
/* дугмад не наслеђују фонт по дефолту → наследи IBM Plex Sans (важи за све модуле са cc-design) */
#cc-root button { font-family:inherit; }
/* Тастатурна навигација: видљив фокус-прстен САМО за :focus-visible (миш га
   не приказује) — инпути/дугмад иначе гасе outline, па је Tab био слијеп. */
#cc-root :is(button,a,input,select,textarea,summary,[tabindex]):focus-visible {
    outline:2px solid var(--accent); outline-offset:2px; border-radius:var(--r1);
}
@keyframes ccup { from{opacity:0;transform:translateY(10px)} to{opacity:1;transform:none} }

/* Poštuje OS/browser podešavanje "manje pokreta" (audit 2026-07-04, Low) */
@media (prefers-reduced-motion: reduce) {
    #cc-root *, #cc-root *::before, #cc-root *::after {
        animation-duration: 0.01ms !important;
        animation-iteration-count: 1 !important;
        transition-duration: 0.01ms !important;
        scroll-behavior: auto !important;
    }
}

/* ── Shell width ── */
.cc-shell   { width:100%; max-width:1340px; margin:0 auto; padding:0 28px; }
.cc-content { max-width:1340px; margin:0 auto; padding:26px 28px 0; }

/* ── Navbar ── */
.cc-nav { position:sticky; top:0; z-index:var(--z-nav); height:62px; display:flex; align-items:center;
    background:color-mix(in srgb,var(--surface) 88%,transparent); backdrop-filter:blur(14px); border-bottom:1px solid var(--line); }
.cc-nav-inner { width:100%; max-width:1340px; margin:0 auto; padding:0 28px; display:flex; align-items:center; justify-content:space-between; gap:24px; }
.cc-logo { width:38px; height:38px; border-radius:50%; flex-shrink:0; display:flex; align-items:center; justify-content:center; box-shadow:0 6px 14px -8px rgba(47,106,214,.55); }
.cc-logo img { width:100%; height:100%; display:block; border-radius:50%; }
.cc-brand-name { font-weight:700; font-size:var(--fs-xl); letter-spacing:-.02em; line-height:1.1; }
.cc-brand-sub  { font-size:var(--fs-2xs); color:var(--ink3); letter-spacing:.12em; font-weight:600; }
.cc-nav-link { display:flex; align-items:center; gap:7px; padding:8px 12px; border-radius:9px; font-size:.82rem; font-weight:500; color:var(--ink2); }
.cc-nav-link:hover { background:var(--elevated); color:var(--ink); }
.cc-nav-link.active { font-weight:600; color:#fff; background:var(--accent-fill); }
.cc-nav-divider { width:1px; height:24px; background:var(--line); margin:0 6px; }
.cc-icon-btn { min-width:40px; height:36px; padding:0 10px; border:1px solid var(--line); background:var(--surface);
    color:var(--ink2); border-radius:9px; font-size:.78rem; font-weight:700; cursor:pointer; display:flex; align-items:center; justify-content:center; gap:6px; }
.cc-icon-btn:hover { border-color:var(--accent); color:var(--accent); }
.cc-nav-home { display:flex; align-items:center; gap:7px; padding:8px 14px; border-radius:9px; font-size:.82rem; font-weight:600; color:var(--ink); background:var(--surface); border:1px solid var(--line); margin-left:2px; }
.cc-nav-home:hover { border-color:var(--accent); color:var(--accent); }

/* ── Header ── */
.cc-head { display:flex; align-items:flex-end; justify-content:space-between; gap:24px; flex-wrap:wrap; margin-bottom:22px; }
.cc-crumb { display:flex; align-items:center; gap:8px; font-size:.78rem; color:var(--ink3); margin-bottom:12px; font-weight:500; }
.cc-crumb a { color:var(--ink3); }
.cc-crumb .cur { color:var(--ink2); }
.cc-head-row { display:flex; align-items:center; gap:16px; }
.cc-head-ico { width:54px; height:54px; border-radius:15px; background:var(--soft);
    border:1px solid color-mix(in srgb,var(--accent) 24%,transparent); display:flex; align-items:center; justify-content:center; color:var(--accent); font-size:var(--fs-3xl); }
.cc-h1 { font-size:1.62rem; font-weight:700; letter-spacing:-.025em; line-height:1.1; margin:0; }
.cc-sub { font-size:var(--fs-base); color:var(--ink3); margin-top:4px; }
.cc-head-actions { display:flex; gap:9px; flex-wrap:wrap; }
.cc-btn { display:flex; align-items:center; gap:8px; padding:10px 15px; border:1px solid var(--line); background:var(--surface);
    color:var(--ink); border-radius:10px; font-size:var(--fs-base); font-weight:600; cursor:pointer; box-shadow:var(--sh1); font-family:'IBM Plex Sans',sans-serif; }
.cc-btn:hover { border-color:var(--accent); color:var(--accent); }
.cc-btn-primary { display:flex; align-items:center; gap:9px; padding:11px 22px; border:none; border-radius:11px;
    font-size:.9rem; font-weight:700; cursor:pointer; color:#fff; background:linear-gradient(135deg,var(--accent-fill),var(--accent2));
    box-shadow:0 8px 20px -8px var(--accent); font-family:'IBM Plex Sans',sans-serif; }
.cc-btn-primary:hover:not(:disabled) { background:var(--accent2); }
.cc-btn-primary:disabled { opacity:.5; cursor:not-allowed; box-shadow:none; }

/* ── Дугмад: ЈЕДИНО мјесто дефиниције (DS-3, 2026-09-05) ──────────────────
   .cc-btn / .cc-btn-primary  — rail-layout модули (mustra Пројектовање 2D)
   .btn + модификатори        — компактна дугмад (nav, admin, projekti, табови):
       .btn-primary .btn-secondary .btn-danger .btn-ghost .btn-sm .btn-block .btn-icon
   .btn-action                — едитор извјештаја (акције уз поља)
   Токени (--space/--radius/--transition/--accent-glow) су из cacarot-theme :root.
   Правило: нова дугмад користе ове класе; не дефинисати .btn* у шаблонима. */
.btn {
  display: inline-flex; align-items: center; gap: var(--space-2);
  padding: 0.45rem 1rem;
  border-radius: var(--radius-md);
  border: 1px solid transparent;
  font-family: var(--font-ui); font-size: 0.85rem; font-weight: 500;
  cursor: pointer; transition: all var(--transition-fast);
  white-space: nowrap; text-decoration: none; line-height: 1;
}
.btn-primary   { background: var(--accent-fill); color: #fff; border-color: var(--accent-fill); }
.btn-primary:hover { background: var(--accent-hover); border-color: var(--accent-hover); color: #fff; transform: translateY(-1px); box-shadow: 0 4px 12px var(--accent-glow); }
.btn-secondary { background: transparent; color: var(--text-secondary); border-color: var(--border); }
.btn-secondary:hover { background: var(--bg-hover); color: var(--text-primary); border-color: var(--border-focus); }
.btn-danger    { background: var(--danger-dim); color: var(--danger); border-color: rgba(217,95,95,0.3); }
.btn-danger:hover { background: var(--danger); color: #fff; border-color: var(--danger); }
.btn-ghost     { background: transparent; color: var(--text-secondary); border-color: transparent; }
.btn-ghost:hover { background: var(--bg-hover); color: var(--text-primary); }
.btn-sm        { padding: 0.3rem 0.7rem; font-size: 0.78rem; }
.btn-block     { width: 100%; justify-content: center; }
.btn-icon {
    padding: .45rem;
    width: 34px;
    height: 34px;
    justify-content: center;
    border-radius: var(--radius-md);
    flex-shrink: 0;
}

.btn-icon.btn-sm {
    width: 28px;
    height: 28px;
    padding: 0;
    font-size:var(--fs-md);
    border-radius: var(--radius-sm);
}
.btn-action {
    display: inline-flex; align-items: center; gap: 6px;
    padding: 8px 12px; background: var(--accent-fill); color: white;
    border: none; border-radius: var(--radius-sm); cursor: pointer;
    font-size: .85rem; font-weight: 500;
    transition: all var(--transition-fast);
}
.btn-action:hover { filter: brightness(1.1); }
.btn-action:disabled { opacity: .5; cursor: not-allowed; }
.btn-action.secondary { background: var(--bg-base); color: var(--text-primary); border: 1px solid var(--border); }
.btn-action.secondary:hover { background: var(--bg-hover); }

/* ── Stat strip ── */
.cc-stats { display:grid; grid-template-columns:repeat(auto-fit,minmax(190px,1fr)); gap:14px; margin-bottom:22px; }
.cc-stat { background:var(--surface); border:1px solid var(--line); border-radius:var(--r3); padding:16px 18px; display:flex; align-items:center; gap:14px; box-shadow:var(--sh1); }
.cc-stat-ico { width:42px; height:42px; border-radius:11px; background:var(--soft); color:var(--accent); display:flex; align-items:center; justify-content:center; font-size:var(--fs-2xl); }
.cc-stat-ico.muted { background:var(--elevated); color:var(--ink2); }
.cc-stat-val { font-family:var(--num); font-size:1.7rem; font-weight:600; line-height:1; font-variant-numeric:tabular-nums; }
.cc-stat-lab { font-size:var(--fs-xs); color:var(--ink3); letter-spacing:.06em; font-weight:600; }

/* ── Workspace grid ── */
.cc-grid { display:grid; grid-template-columns:372px 1fr; gap:20px; align-items:start; }
/* Levi rail: lepljen uz vrh + sopstveni skrol kad je viši od ekrana (nezavisno od glavne kolone) */
.cc-rail { display:flex; flex-direction:column; gap:16px; position:sticky; top:80px; max-height:calc(100vh - 96px); overflow-y:auto; overflow-x:visible; padding-right:4px; overscroll-behavior:contain; }
/* kartice zadržavaju svoju prirodnu visinu (flex column ih inače skuplja umesto da rail skroluje) */
.cc-rail > * { flex:0 0 auto; }
.cc-rail::-webkit-scrollbar { width:8px; }
.cc-rail::-webkit-scrollbar-thumb { background:var(--line); border-radius:8px; }
.cc-rail::-webkit-scrollbar-thumb:hover { background:var(--ink3); }
.cc-col  { display:flex; flex-direction:column; gap:16px; min-width:0; }
@media (max-width:1100px) { .cc-grid { grid-template-columns:1fr; } .cc-rail { position:static; max-height:none; overflow:visible; padding-right:0; } }

/* ── Nezavisan skrol lijevog i desnog panela (desktop, strane sa sticky footerom) ──
   Radni prostor postaje viewport-visok flex stub: header (i stat-strip) fiksni,
   grid popunjava ostatak, a OBA panela (rail + col) skroluju sopstveno i uvijek
   ostaju iznad sticky footera. Strane bez .cc-sticky (transformacija, kreator)
   se ne diraju. Na uskim ekranima (≤1100px) vrijedi obično slaganje odozgo. */
@media (min-width:1101px) {
  #cc-root:has(.cc-sticky) { padding-bottom:0; }
  #cc-root:has(.cc-sticky) .cc-content { height:calc(100vh - 62px); display:flex; flex-direction:column; overflow:hidden; padding-bottom:84px; box-sizing:border-box; }
  #cc-root:has(.cc-sticky) .cc-content > * { flex:0 0 auto; }          /* header, stat-strip… prirodne visine */
  #cc-root:has(.cc-sticky) .cc-grid { flex:1 1 auto; min-height:0; align-items:stretch; }
  #cc-root:has(.cc-sticky) .cc-rail,
  #cc-root:has(.cc-sticky) .cc-col {
    min-height:0; max-height:100%; overflow-y:auto; overflow-x:visible;
    padding-right:4px; overscroll-behavior:contain;
    /* position:relative (ne static): containing block za position:absolute potomke (npr.
       caption.sr-only tabela) — bez toga ih Chromium broji u scrollable overflow DOKUMENTA →
       stranica dobija drugi skrolbar (Firefox ne); cross-browser nalaz 2026-09-05.
       top:auto poništava `top` iz osnovnog .cc-rail{position:sticky} pravila. */
    position:relative; top:auto; }
  #cc-root:has(.cc-sticky) .cc-rail > *,
  #cc-root:has(.cc-sticky) .cc-col > * { flex:0 0 auto; }
  #cc-root:has(.cc-sticky) .cc-col::-webkit-scrollbar { width:8px; }
  #cc-root:has(.cc-sticky) .cc-col::-webkit-scrollbar-thumb { background:var(--line); border-radius:8px; }
  #cc-root:has(.cc-sticky) .cc-col::-webkit-scrollbar-thumb:hover { background:var(--ink3); }
}

/* ── Cards ── */
.cc-card { background:var(--surface); border:1px solid var(--line); border-radius:var(--r4); box-shadow:var(--sh1); overflow:hidden; }
.cc-card.elevated { box-shadow:var(--sh2); animation:ccup .4s ease; }
.cc-card-head { display:flex; align-items:center; gap:10px; padding:16px 18px; border-bottom:1px solid var(--line-soft); }
.cc-card-head.split { justify-content:space-between; }
.cc-card-head h3 { font-size:var(--fs-lg); font-weight:600; margin:0; }
.cc-card-head > i { color:var(--accent); }
.cc-card-body { padding:14px 16px; }
.cc-badge { display:inline-block; font-family:var(--num); font-size:.72rem; font-weight:700; color:var(--accent); background:var(--soft); padding:2px 9px; border-radius:9px; line-height:1.5; font-variant-numeric:tabular-nums; }
.cc-badge.ok   { color:var(--ok-ink);   background:var(--ok-s); }
.cc-badge.warn { color:var(--warn-ink); background:var(--warn-s); }
.cc-badge.bad, .cc-badge.error { color:var(--bad-ink); background:var(--bad-s); }
.cc-badge.muted { color:var(--ink2); background:var(--elevated); }

/* ── Datum radio cards ── */
.dt-opt { display:flex; align-items:center; gap:11px; padding:11px 13px; border:1px solid var(--line-soft);
    background:var(--elevated); border-radius:var(--r2); cursor:pointer; font-size:.86rem; font-weight:600; transition:border-color var(--t-fast) var(--ease),background-color var(--t-fast) var(--ease),color var(--t-fast) var(--ease); }
.dt-opt:hover { border-color:var(--accent); }
.dt-opt:has(input:checked) { border-color:var(--accent); background:var(--soft); color:var(--accent); }
.dt-opt input[type="radio"] { width:17px; height:17px; accent-color:var(--accent); flex-shrink:0; cursor:pointer; }
.dt-opt small { display:block; font-weight:500; font-size:.72rem; color:var(--ink3); margin-top:2px; }

/* .cc-input — поље ван #cc-root (претплата, листа извјештаја): токени cc-design
   ту не постоје, па иду токени теме као резерва. Класа је била у шаблонима, а
   нигдје дефинисана — поља су падала на системски изглед (налаз 21.09.). */
input.cc-input, select.cc-input { padding:8px 10px; border:1px solid var(--line, var(--border));
    background:var(--elevated, var(--bg-elevated)); color:var(--ink, var(--text-primary));
    border-radius:var(--r1, var(--radius-sm)); font-size:.85rem; font-family:inherit; outline:none; }
input.cc-input:focus, select.cc-input:focus { border-color:var(--accent); }

/* ── Settings field grid ── */
.std-grid { display:grid; grid-template-columns:1fr 1fr; gap:11px; }
.std-grid.one { grid-template-columns:1fr; }
.std-grid label { font-size:var(--fs-sm); color:var(--ink2); font-weight:500; display:block; margin-bottom:4px; }
.std-grid input,.std-grid select,#cc-root input.cc-inp,#cc-root select.cc-inp { width:100%; padding:8px 10px; border:1px solid var(--line); background:var(--elevated);
    color:var(--ink); border-radius:var(--r1); font-size:var(--fs-base); font-family:var(--num); outline:none; }
.std-grid input:focus,.std-grid select:focus,#cc-root .cc-inp:focus { border-color:var(--accent); }

/* ── Upload ── */
.cc-upload { display:flex; align-items:center; gap:12px; padding:16px; border:2px dashed var(--line);
    border-radius:var(--r2); background:var(--elevated); cursor:pointer; transition:border-color var(--t-fast) var(--ease),background-color var(--t-fast) var(--ease); }
.cc-upload:hover { border-color:var(--accent); background:var(--soft); }
.cc-upload-name { font-size:var(--fs-sm); color:var(--ink3); margin-top:6px; display:none; font-family:var(--num); }
.cc-upload-name.visible { display:block; }
.cc-upload-btn { margin-top:10px; display:inline-flex; align-items:center; gap:7px; padding:8px 13px;
    border:1px solid var(--accent); background:var(--soft); color:var(--accent); border-radius:9px; font-size:var(--fs-md); font-weight:600; cursor:pointer; }
.cc-dropzone { margin-top:10px; padding:13px; border:1px dashed var(--line); border-radius:var(--r1); text-align:center; color:var(--ink3); font-size:.76rem; cursor:pointer; }
.cc-dropzone i { font-size:1.1rem; display:block; margin-bottom:3px; }

/* ── Data tables (rows generated by module JS) ── */
#cc-root .cc-table { width:100%; border-collapse:collapse; font-size:var(--fs-base); }
#cc-root .cc-table thead th { background:var(--elevated); text-align:left; padding:10px 12px; font-size:var(--fs-xs);
    font-weight:700; letter-spacing:.05em; color:var(--ink3); white-space:nowrap; }
#cc-root .cc-table tbody td { padding:4px 8px; border-bottom:1px solid var(--line-soft); vertical-align:middle; }
#cc-root .cc-table tbody input { width:100%; padding:5px 8px; border:1px solid transparent; background:transparent;
    color:var(--ink); border-radius:var(--r1); font-size:.82rem; font-family:var(--num); outline:none; }
#cc-root .cc-table tbody input:focus { border-color:var(--line); background:var(--elevated); }
/* Native spin-strelice jedu ~20px po ćeliji pa su cifre bile odsječene u
   uskim kolonama (koordinate/visine); za tabelarni unos su ionako beskorisne */
#cc-root .cc-table tbody input[type="number"] { -moz-appearance:textfield; appearance:textfield; }
#cc-root .cc-table tbody input[type="number"]::-webkit-outer-spin-button,
#cc-root .cc-table tbody input[type="number"]::-webkit-inner-spin-button { -webkit-appearance:none; margin:0; }
#cc-root .cc-table tbody input[type="checkbox"] { width:17px; height:17px; accent-color:var(--accent); cursor:pointer; padding:0; }
#cc-root .cc-table tbody select { padding:5px 8px; border:1px solid var(--line); background:var(--elevated); color:var(--ink);
    border-radius:var(--r1); font-size:.78rem; font-weight:600; font-family:var(--num); cursor:pointer; outline:none; width:100%; }
#cc-root .cc-table tbody button { width:28px; height:28px; border:1px solid var(--line); background:var(--surface);
    color:var(--ink3); border-radius:7px; cursor:pointer; font-size:var(--fs-md); line-height:1; }
#cc-root .cc-table tbody button:hover { border-color:var(--bad); color:var(--bad); }
.cc-add { display:inline-flex; align-items:center; gap:6px; padding:7px 13px; border:1px dashed var(--accent);
    background:transparent; color:var(--accent); border-radius:9px; font-size:var(--fs-md); font-weight:600; cursor:pointer; margin:10px 16px; font-family:'IBM Plex Sans',sans-serif; }
.cc-add-head { display:flex; align-items:center; gap:6px; padding:7px 13px; border:1px solid var(--accent);
    background:var(--soft); color:var(--accent); border-radius:9px; font-size:var(--fs-md); font-weight:600; cursor:pointer; font-family:'IBM Plex Sans',sans-serif; }

/* ── Tabs (uz switchTab koji toggluje .tab-btn/.tab-content) ── */
#cc-root .tabs-nav { display:flex; gap:4px; padding:10px 14px 0; flex-wrap:wrap; }
#cc-root .tab-btn { display:flex; align-items:center; gap:7px; padding:9px 15px; border:none; background:transparent;
    cursor:pointer; font-size:.83rem; font-weight:600; border-bottom:2px solid transparent; color:var(--ink2); font-family:'IBM Plex Sans',sans-serif; }
#cc-root .tab-btn.active { border-bottom-color:var(--accent); color:var(--accent); }
/* L-09: JEDAN stil tabova za sve familije (mjerenja-tabovi, kreator paneli,
   deformaciona metode, transformacija režimi): underline + gornji radius 4px,
   ista tipografija; lokalni CSS smije mijenjati samo gustinu (padding). */
#cc-root .tab-btn, #cc-root .p-tab-btn, #cc-root .method-tab-btn, #cc-root .mode-tab {
    border-radius:4px 4px 0 0; font-family:'IBM Plex Sans',sans-serif; }
#cc-root .tab-btn:hover, #cc-root .p-tab-btn:hover:not(.active), #cc-root .method-tab-btn:hover, #cc-root .mode-tab:hover {
    background:var(--elevated); }
#cc-root .tab-btn .cnt { font-family:var(--num); font-size:.7rem; opacity:.8; }
#cc-root .tab-content { display:none; padding:8px 0 4px; }
#cc-root .tab-content.active { display:block; }

/* ── Network sketch ── */
#cc-root #network-container { position:relative; width:100%; height:360px; background:var(--elevated);
    border:1px solid var(--line-soft); border-radius:var(--r2); overflow:hidden; cursor:grab; }
#cc-root #network-svg-layer,#cc-root #network-points-layer { position:absolute; top:0; left:0; width:100%; height:100%; }
#cc-root #network-svg-layer { color:var(--ink2); }  /* ose i razmjernik: currentColor (bile crne — nevidljive u tamnoj temi) */
#cc-root #network-svg-layer text { fill:currentColor; }
#cc-root #network-points-layer { pointer-events:none; }
#cc-root #recenter-button { border:1px solid var(--line); background:var(--surface); color:var(--ink2); padding:4px 9px; border-radius:8px; cursor:pointer; font-size:.76rem; }
#cc-root #recenter-button:hover { border-color:var(--accent); color:var(--accent); }

/* Станица мјерена у ВИШЕ ОРИЈЕНТАЦИЈА (§2.5) — два постављања лимба са исте
   тачке значе двије оријентационе непознате. Скица то каже ЈЕДНОМ
   дискретном ознаком — прстеном ОКО симбола; боја и облик саме тачке
   (фиксна црвена, објекат зелени) остају нетакнуте, а сами правци се
   цртају једном бојом као и увијек. Прстен је ПУН јер су елипсе грешака
   већ испрекидане — двије испрекидане кружнице око исте тачке се не разликују. */
#cc-root .network-point.vise-orijentacija::after {
    content:''; position:absolute; inset:-5px; border:2px solid var(--ink);
    border-radius:50%; pointer-events:none;
    box-shadow:0 0 0 1.5px var(--elevated), inset 0 0 0 1.5px var(--elevated);
}
/* Прстен је и ДУГМЕ: клик истиче правце те станице по оријентацији. Слој
   тачака је иначе pointer-events:none, па су кликабилне САМО овакве станице. */
#cc-root .network-point.vise-orijentacija { pointer-events:auto; cursor:pointer; }

/* Истицање на клик (в. istakniOrijentacijeStanice у script.js): линије
   мјерења (`data-m`) се утишају, а правци истакнуте станице добију стил по
   редном броју оријентације. У мирном стању ниједна линија не носи класу —
   скица остаје једна боја, без легенде. */
#cc-root #network-svg-layer.orij-ist-aktivno line[data-m] { opacity:.14; }
#cc-root #network-svg-layer.orij-ist-aktivno line.orij-ist { opacity:1; }
#cc-root #network-svg-layer line.orij-ist-1 { stroke:var(--orij-ist-1); stroke-width:2.4; stroke-dasharray:none; }
#cc-root #network-svg-layer line.orij-ist-2 { stroke:var(--orij-ist-2); stroke-width:2.4; stroke-dasharray:8 5; }
#cc-root #network-svg-layer line.orij-ist-3 { stroke:var(--orij-ist-3); stroke-width:2.4; stroke-dasharray:2 4; }

/* Натпис уз истакнуту станицу („S: оријентација 1 — 5 праваца · …") — дијете
   елемента тачке, па путује са њом при повлачењу/зумирању без иједног рачуна. */
#cc-root .orij-natpis { position:absolute; left:16px; top:-30px; white-space:nowrap;
    background:var(--elevated); border:1px solid var(--line); border-radius:7px;
    padding:3px 9px; font-size:var(--fs-xs); font-weight:600; color:var(--ink2);
    pointer-events:none; z-index:6; box-shadow:var(--sh1); }
/* станица уз ивицу скице → натпис на другу страну (даје их _postaviOrijNatpis) */
#cc-root .orij-natpis.lijevo { left:auto; right:16px; }
#cc-root .orij-natpis.ispod { top:auto; bottom:-34px; }

/* ── Sticky action bar ── */
.cc-sticky { position:fixed; bottom:0; left:0; right:0; z-index:var(--z-sticky); background:color-mix(in srgb,var(--surface) 92%,transparent);
    backdrop-filter:blur(14px); border-top:1px solid var(--line); }
.cc-sticky-inner { max-width:1340px; margin:0 auto; padding:13px 28px; display:flex; align-items:center; justify-content:space-between; gap:20px; flex-wrap:wrap; }
.cc-status { display:flex; align-items:center; gap:9px; font-size:.86rem; color:var(--ink2); }
.cc-status i { font-size:1.05rem; }
.cc-sticky-actions { display:flex; gap:10px; }

/* ── Empty state ── */
.cc-empty { text-align:center; color:var(--ink3); font-size:var(--fs-base); padding:34px 16px; }
.cc-empty i { font-size:var(--fs-4xl); display:block; margin-bottom:8px; opacity:.7; }

/* ── Kompaktne opcije (model težina 1D) ── */
#cc-root .wt-title { font-size:.66rem; font-weight:700; text-transform:uppercase; letter-spacing:.05em; color:var(--ink3); margin:11px 0 5px; }
#cc-root .wt-title:first-child { margin-top:0; }
#cc-root .wt-opt { display:flex; align-items:center; gap:8px; padding:6px 9px; border:1px solid var(--line-soft); background:var(--elevated); border-radius:var(--r1); cursor:pointer; font-size:var(--fs-md); margin-bottom:5px; }
#cc-root .wt-opt:has(input:checked) { border-color:var(--accent); background:var(--soft); color:var(--accent); }
#cc-root .wt-opt input { accent-color:var(--accent); flex-shrink:0; }
#cc-root #trig-standards { margin-top:8px; padding:10px; background:var(--elevated); border:1px solid var(--line-soft); border-radius:var(--r2); }
#cc-root #trig-standards input { width:100%; padding:6px 8px; border:1px solid var(--line); background:var(--surface); color:var(--ink); border-radius:var(--r1); font-family:var(--num); font-size:var(--fs-md); outline:none; }

/* ── 2-col red unutar kolone (npr. mjerenja | analiza) ── */

/* Шаблони улаза (_makroi.sablon_linkovi) — ред испод зоне за учитавање */
#cc-root .cc-sablon { display:flex; flex-wrap:wrap; align-items:center; gap:6px; font-size:.74rem; color:var(--ink3); margin-top:2px; }
#cc-root .cc-sablon i { color:var(--accent); }
#cc-root .cc-sablon a { padding:2px 8px; border:1px solid var(--line); border-radius:7px; color:var(--accent); font-weight:600; text-decoration:none; background:var(--surface); }
#cc-root .cc-sablon a:hover { border-color:var(--accent); }

/* ─────────────────────────────────────────────────────────────────────
   Заједничке ситнице за смиривање садржаја у модулима (редизајн 2026-09-08)
   .cc-note        — кратка напомена/упозорење унутар картице
   details.cc-method — „Метод и формуле": дуга објашњења СКЛОПЉЕНА подразумијевано
   .cc-empty-note  — празна табела добија упутни текст умјесто голог заглавља
   .cc-toolbar     — једна трака ситних контрола (умјесто гомиле дугмади)
   .tabs-nav.nowrap— много табова се скролује водоравно умјесто да се прелама
   ───────────────────────────────────────────────────────────────────── */
/* .cc-note je BLOK sa ikonicom izvan toka (ne flex): goli tekst sa / u
   sredini bi se u flex kontejneru raspao na kolone (nalaz 21.09. — deformaciona,
   osmatranje). Ovako sadržaj smije biti i goli tekst i jedan omotač. */
#cc-root .cc-note { display:block; position:relative; font-size:.75rem; line-height:1.55;
    color:var(--ink2); background:var(--elevated); border:1px solid var(--line-soft);
    border-radius:var(--r2); padding:9px 12px; }
#cc-root .cc-note:has(> i:first-child) { padding-left:34px; }
#cc-root .cc-note > i:first-child { color:var(--accent); position:absolute; left:12px; top:10px; }
#cc-root .cc-note.accent { border-color:color-mix(in srgb,var(--accent) 20%,transparent); background:var(--soft); }

/* Увучени панел унутар картице (налијепи текст, преглед увоза, додатна поља) —
   исти омотач који је био инлајн у 5 модула; распоред и display остају на елементу. */
#cc-root .cc-panel { padding:10px 12px; background:var(--elevated);
    border:1px solid var(--line-soft); border-radius:var(--r2); }

#cc-root details.cc-method { border:1px solid var(--line-soft); border-radius:var(--r2);
    background:var(--elevated); margin:0 0 12px; }
#cc-root details.cc-method > summary { list-style:none; cursor:pointer; display:flex; align-items:center;
    gap:8px; padding:8px 12px; font-size:.75rem; font-weight:600; color:var(--ink2); user-select:none; }
#cc-root details.cc-method > summary::-webkit-details-marker { display:none; }
#cc-root details.cc-method > summary:hover { color:var(--ink); }
#cc-root details.cc-method > summary .cc-caret { margin-left:auto; color:var(--ink3); font-size:.72rem;
    transition:transform .18s ease; }
#cc-root details.cc-method[open] > summary .cc-caret { transform:rotate(90deg); }
#cc-root details.cc-method > summary > i:first-child { color:var(--accent); }
#cc-root details.cc-method .cc-method-body { padding:0 12px 11px; font-size:.76rem; line-height:1.6; color:var(--ink3); }
#cc-root details.cc-method .cc-method-body > *:first-child { margin-top:0; }
#cc-root details.cc-method .cc-method-body p { margin:0 0 8px; }
#cc-root details.cc-method .cc-method-body p:last-child { margin-bottom:0; }
#cc-root details.cc-method .cc-method-body code,
#cc-root .cc-note code { background:var(--surface); border:1px solid var(--line-soft);
    padding:1px 5px; border-radius:4px; font-family:var(--mono); font-size:.94em; }

/* Празно стање табеле — .cc-empty-note ОДМАХ иза ; види се само док је
    празан (:has, без JS-а и без реда који би ушао у бројаче редова). */
#cc-root .cc-empty-note { display:none; align-items:center; justify-content:center; gap:7px;
    text-align:center; color:var(--ink3); font-size:.78rem; padding:16px 12px; }
#cc-root .cc-empty-note i { opacity:.7; }
#cc-root .cc-table:has(> tbody:empty) + .cc-empty-note { display:flex; }

#cc-root .cc-toolbar { display:flex; align-items:center; gap:9px; flex-wrap:wrap; }
#cc-root .cc-toolbar .cc-toolbar-sep { width:1px; height:20px; background:var(--line); }
#cc-root .cc-toolbar label { font-size:.74rem; color:var(--ink2); font-weight:500; }
#cc-root .cc-toolbar input[type="number"] { width:86px; padding:7px 9px; background:var(--elevated);
    border:1px solid var(--line); border-radius:var(--r2); color:var(--ink); font-family:var(--num);
    font-size:.82rem; outline:none; }
#cc-root .cc-toolbar input[type="number"]:focus { border-color:var(--accent); }
#cc-root .cc-toolbar .cc-toolbar-hint { font-size:.72rem; color:var(--ink3); }

#cc-root .tabs-nav.nowrap { flex-wrap:nowrap; overflow-x:auto; scrollbar-width:thin; }
#cc-root .tabs-nav.nowrap .tab-btn { white-space:nowrap; flex:0 0 auto; }
#cc-root .tabs-nav.nowrap::-webkit-scrollbar { height:6px; }
#cc-root .tabs-nav.nowrap::-webkit-scrollbar-thumb { background:var(--line); border-radius:6px; }

/* Групна DMS ћелија (° / ′ / ″) — иста у свим модулима (мустра: Изравнање 2Д) */
#cc-root .dms-cell { display:flex; gap:5px; }
#cc-root .dms-cell input { min-width:0; }

/* ── Rezultati (script.js/script_proj displayResults → #results-container) ── */
#cc-root #results-container { font-size:var(--fs-base); }
#cc-root #results-container #results-header h2,
#cc-root #results-container h2 { font-size:.95rem; font-weight:700; color:var(--ink); margin:18px 0 10px; padding-bottom:8px; border-bottom:1px solid var(--line-soft); }
#cc-root #results-container > #results-header:first-child h2,
#cc-root #results-container > h2:first-child { margin-top:0; }
#cc-root #results-container h3 { font-size:var(--fs-sm); font-weight:700; text-transform:uppercase; letter-spacing:.06em; color:var(--ink3); margin:14px 0 8px; }
#cc-root #results-container table { width:100%; border-collapse:collapse; font-family:var(--num); font-size:var(--fs-md); background:var(--surface); border:1px solid var(--line-soft); border-radius:var(--r2); overflow:hidden; margin-bottom:6px; }
#cc-root #results-container thead th { background:var(--elevated); color:var(--ink3); font-family:'IBM Plex Sans',sans-serif; font-size:var(--fs-xs); font-weight:700; text-transform:uppercase; letter-spacing:.04em; padding:8px 10px; text-align:right; border-bottom:1px solid var(--line); }
#cc-root #results-container thead th:first-child, #cc-root #results-container #residuals-table thead th:nth-child(2) { text-align:left; }
/* brojevi DESNO (kanon Standard prikaza, audit F-13): predznaci/decimale se poravnavaju */
#cc-root #results-container tbody td { padding:6px 10px; border-bottom:1px solid var(--line-soft); text-align:right; font-variant-numeric:tabular-nums; color:var(--ink2); }
#cc-root #results-container #residuals-table tbody td:nth-child(2) { text-align:left; }
#cc-root #results-container tbody td:first-child { text-align:left; color:var(--ink); }
#cc-root #results-container tbody tr:last-child td { border-bottom:none; }
#cc-root #results-container .test-passed { color:var(--ok-ink); font-weight:700; }
#cc-root #results-container .test-failed { color:var(--bad-ink); font-weight:700; }
#cc-root #results-container tr.highlight-max-sigma td { background:var(--bad-s); color:var(--bad-ink); }
#cc-root #results-container tr.highlight-min-rii td { background:var(--warn-s); color:var(--warn-ink); }
/* Мјерење без контроле (r ≈ 0): ∇₀ и δ₀ теже бесконачности, па ћелија носи
   „∞", а уз назив мјерења стоји ознака „нема контроле". Важи у свим модулима
   (изравнање/пројектовање 2Д и 1Д, анализа мјерења). */
#cc-root .nk-cell, #cc-root #results-container td.nk-cell { color:var(--warn-ink); font-weight:700; }
#cc-root .nk-badge { display:inline-block; margin-left:6px; padding:0 6px; border-radius:999px;
    font-family:'IBM Plex Sans',sans-serif; font-size:var(--fs-2xs); font-weight:700; letter-spacing:.02em;
    text-transform:none; white-space:nowrap; vertical-align:middle;
    background:var(--warn-s); color:var(--warn-ink); border:1px solid color-mix(in srgb,var(--warn) 35%,transparent); }
#cc-root #results-container .error-message { color:var(--bad-ink); background:var(--bad-s); border:1px solid var(--bad); border-radius:var(--r2); padding:14px; }
#cc-root #results-container .save-notice { color:var(--ink3); padding:16px; text-align:center; }
/* Zajednički prelazni blok i blok greške (ccLoadingHtml/ccErrorHtml, cc_akcija.js) —
   važe u SVAKOM kontejneru rezultata, ne samo #results-container (M-16). */
#cc-root .cc-loading { display:flex; justify-content:center; align-items:center; gap:8px; color:var(--ink3); padding:16px; font-size:.86rem; }
#cc-root .cc-error { display:flex; align-items:flex-start; gap:8px; color:var(--bad-ink); background:var(--bad-s); border:1px solid var(--bad); border-radius:var(--r2); padding:14px; font-size:var(--fs-base); line-height:1.5; margin:0 0 12px; }
#cc-root .cc-error > i { flex:0 0 auto; margin-top:2px; color:var(--bad); }

/* ── Callout (упозорења/инфо изнад резултата — window.ccUpozorenjaHtml) ── */
#cc-root .cc-callout { display:flex; align-items:flex-start; gap:10px; padding:12px 14px; margin-bottom:14px;
    border-radius:var(--r2); font-size:var(--fs-md); line-height:1.5; }
#cc-root .cc-callout > i { flex:0 0 auto; margin-top:2px; font-size:.95rem; }
#cc-root .cc-callout .cc-callout-body { min-width:0; }
#cc-root .cc-callout strong { display:block; margin-bottom:4px; font-weight:700; }
#cc-root .cc-callout ul { margin:0; padding-left:18px; }
#cc-root .cc-callout li + li { margin-top:5px; }
#cc-root .cc-callout.warn { background:var(--warn-s); border:1px solid color-mix(in srgb,var(--warn) 35%,transparent); color:var(--warn-ink); }
#cc-root .cc-callout.warn > i { color:var(--warn); }
#cc-root .cc-callout.ok { background:var(--ok-s); border:1px solid color-mix(in srgb,var(--ok) 35%,transparent); color:var(--ok-ink); }
#cc-root .cc-callout.ok > i { color:var(--ok); }
#cc-root .cc-callout.bad, #cc-root .cc-callout.error { background:var(--bad-s); border:1px solid color-mix(in srgb,var(--bad) 35%,transparent); color:var(--bad-ink); }
#cc-root .cc-callout.bad > i, #cc-root .cc-callout.error > i { color:var(--bad); }
#cc-root .cc-callout.info { background:var(--soft); border:1px solid color-mix(in srgb,var(--accent) 30%,transparent); color:var(--ink2); }

/* ── Rezultati: metric-kartice + sekcije (vizuelni identitet kao Izravnanje/Projektovanje 2D) ── */
#cc-root .res-card { background:var(--surface); border:1px solid var(--line); border-radius:var(--r4); box-shadow:var(--sh2); overflow:hidden; animation:ccup .4s ease; }
#cc-root .res-card-head { display:flex; align-items:center; justify-content:space-between; padding:16px 18px; border-bottom:1px solid var(--line-soft); }
#cc-root .res-card-head .ttl { display:flex; align-items:center; gap:10px; }
#cc-root .res-card-head .ttl > i { color:var(--accent); }
#cc-root #results-container .res-card-head h2 { font-size:var(--fs-lg); font-weight:600; margin:0; padding:0; border:none; color:var(--ink); }
#cc-root .res-body { padding:18px; }
#cc-root .res-metrics { display:grid; grid-template-columns:repeat(auto-fit,minmax(150px,1fr)); gap:12px; margin-bottom:16px; }
#cc-root .res-metric { background:var(--elevated); border:1px solid var(--line-soft); border-radius:var(--r2); padding:13px 15px; }
#cc-root .res-metric.ok  { background:var(--ok-s);  border-color:color-mix(in srgb,var(--ok) 35%,transparent); }
#cc-root .res-metric.bad { background:var(--bad-s); border-color:color-mix(in srgb,var(--bad) 35%,transparent); }
#cc-root .res-metric.accent { background:var(--soft); border-color:color-mix(in srgb,var(--accent) 30%,transparent); }
#cc-root .res-metric .lbl { font-size:.7rem; letter-spacing:.05em; font-weight:600; color:var(--ink3); }
#cc-root .res-metric .val { font-family:var(--num); font-size:var(--fs-3xl); font-weight:600; margin-top:3px; line-height:1.1; color:var(--ink); overflow-wrap:anywhere; }
/* дуге вриједности (координате, текстуални облици) — мањи фонт умјесто
   одсијецања/ружног прелома на 1.5rem */
#cc-root .res-metric .val.long { font-size:var(--fs-xl); line-height:1.3; margin-top:6px; }
#cc-root .res-metric .verdict { font-size:1rem; font-weight:700; margin-top:6px; }
/* duži verdikti (npr. „ЗАДОВОЉАВА ≤ 2 mm") — da ne lome karticu u tri reda */
#cc-root .res-metric .verdict.sm { font-size:.76rem; line-height:1.35; }
#cc-root .res-metric.ok .verdict { color:var(--ok-ink); }
#cc-root .res-metric.bad .verdict { color:var(--bad-ink); }
#cc-root #results-container .res-sec-lbl { font-size:var(--fs-sm); color:var(--ink3); font-weight:600; letter-spacing:.05em; margin:18px 0 8px; text-transform:none; border:none; padding:0; }
#cc-root #results-container .res-sec-lbl:first-child { margin-top:0; }
#cc-root .res-params { display:grid; grid-template-columns:repeat(auto-fit,minmax(150px,1fr)); gap:10px; }
#cc-root .res-param { background:var(--elevated); border:1px solid var(--line-soft); border-radius:var(--r2); padding:11px 13px; }
#cc-root .res-param .lbl { font-size:var(--fs-xs); color:var(--ink3); font-weight:600; }
#cc-root .res-param .val { font-size:var(--fs-base); font-weight:600; margin-top:3px; }
#cc-root #results-container .res-legend { font-size:.72rem; color:var(--ink3); margin-top:8px; line-height:1.6; }
/* sekcijski naslovi unutar rezultatske kartice → mali "label" izgled (kao res-sec-lbl) */
#cc-root .res-body h2, #cc-root .res-body h3 { font-size:var(--fs-sm); font-weight:600; letter-spacing:.05em; color:var(--ink3); margin:18px 0 8px; padding:0; border:none; text-transform:none; }
#cc-root .res-body > h2:first-child, #cc-root .res-body > h3:first-child { margin-top:0; }

/* BAZNE (neskopirane) verzije — isti izgled i van #results-container, jer
   rezultatske kartice žive i u drugim kontejnerima (npr. #apri-osm-results u
   Projektovanju 1D, gdje su tabele do sada ostajale bez ikakvog stila).
   Inline kopije u pojedinim templejtima su specifičnije pa i dalje pobjeđuju. */
#cc-root .res-sec-lbl { font-size:var(--fs-sm); color:var(--ink3); font-weight:600; letter-spacing:.05em; margin:18px 0 8px; text-transform:none; border:none; padding:0; }
#cc-root .res-sec-lbl:first-child { margin-top:0; }
#cc-root .res-legend { font-size:.72rem; color:var(--ink3); margin-top:8px; line-height:1.6; }

/* Склопива табела мјерења (ccSklopivaTabela у cc_toast.js): напомена о броју
   сакривених редова + дугме „Прикажи свих N мјерења" испод табеле. */
#cc-root .obs-vise { display:flex; align-items:center; gap:12px; flex-wrap:wrap;
    margin-top:8px; font-size:.76rem; color:var(--ink3); }
#cc-root .obs-vise-btn { border:1px solid var(--line); background:var(--surface); color:var(--ink2);
    padding:6px 13px; border-radius:8px; cursor:pointer; font-family:inherit; font-size:.78rem; font-weight:600; }
#cc-root .obs-vise-btn:hover { border-color:var(--accent); color:var(--accent); }
#cc-root .res-table { width:100%; border-collapse:collapse; font-size:var(--fs-md); }
#cc-root .res-table th { background:var(--elevated); color:var(--ink3); font-size:var(--fs-xs); font-weight:700;
    letter-spacing:.05em; padding:.45rem .6rem; text-align:right; border-bottom:1px solid var(--line); white-space:nowrap; }
#cc-root .res-table th:first-child, #cc-root .res-table th:nth-child(2) { text-align:left; }
#cc-root .res-table td { padding:.34rem .6rem; border-bottom:1px solid var(--line-soft); text-align:right;
    font-family:var(--num); font-size:.79rem; }
#cc-root .res-table td:first-child, #cc-root .res-table td:nth-child(2) { text-align:left; font-family:inherit; }
#cc-root .res-scroll { overflow-x:auto; }

/* ============================================================
   KOMPATIBILNI SLOJ — stari .module-page/.navbar/.section pod #cc-root
   dobija cc izgled bez restrukturiranja (moduli se samo "umotaju").
   ============================================================ */
#cc-root .navbar { background:color-mix(in srgb,var(--surface) 88%,transparent); border-bottom:1px solid var(--line); backdrop-filter:blur(14px); }
#cc-root .nav-container { max-width:1340px; margin:0 auto; padding:0 28px; }
#cc-root .logo-section img { height:36px; width:36px; border-radius:50%; }
#cc-root .brand h1 { font-size:var(--fs-xl); font-weight:700; color:var(--ink); letter-spacing:-.02em; }
#cc-root .brand p { font-size:var(--fs-2xs); color:var(--ink3); letter-spacing:.12em; text-transform:uppercase; font-weight:600; }
#cc-root .nav-actions .btn { border-radius:9px; font-size:.82rem; font-weight:500; color:var(--ink2); background:transparent; border:1px solid transparent; }
#cc-root .nav-actions .btn:hover { background:var(--elevated); color:var(--ink); }
#cc-root .nav-actions .btn-secondary { color:var(--ink); background:var(--surface); border:1px solid var(--line); }
#cc-root .nav-actions .script-toggle, #cc-root #theme-toggle { border:1px solid var(--line); background:var(--surface); color:var(--ink2); }
#cc-root .nav-actions .script-toggle:hover, #cc-root #theme-toggle:hover { border-color:var(--accent); color:var(--accent); }

#cc-root .module-page { max-width:none; margin:0; padding:0 0 96px; background:var(--bg); color:var(--ink); }
#cc-root .module-page-header { max-width:1340px; margin:0 auto; padding:26px 28px 0; }
#cc-root .module-page-title { font-size:1.62rem; font-weight:700; letter-spacing:-.025em; color:var(--ink); }
#cc-root .module-page-title .icon-large { background:var(--soft); color:var(--accent); border:1px solid color-mix(in srgb,var(--accent) 24%,transparent); border-radius:15px; }
#cc-root .module-page-subtitle { color:var(--ink3); }
#cc-root .breadcrumb, #cc-root .breadcrumb a, #cc-root .breadcrumb .current { color:var(--ink3); }
#cc-root .main-content { max-width:1340px; margin:0 auto; padding:20px 28px 0; display:flex; flex-direction:column; gap:16px; }
/* Почетна (.dashboard-grid): main је grid-ставка — margin:auto би јој дао shrink-to-fit ширину
   коју одређује ШИРИНА ТЕКСТА (писмо/фонт/прегледач), па је број колона модула варирао
   између Firefox-а и Chrome-а (2026-09-05). У гриду main попуњава своју колону. */
#cc-root .dashboard-grid > .main-content { max-width:none; width:100%; margin:0; justify-self:stretch; padding:0; }
#cc-root .quick-stats-row { max-width:1340px; margin:0 auto 22px; padding:0 28px; }
#cc-root .quick-stats-row .qstat-card { background:var(--surface); border:1px solid var(--line); border-radius:var(--r3); box-shadow:var(--sh1); padding:16px 18px; }
#cc-root .quick-stats-row .qstat-icon { background:var(--soft); color:var(--accent); }
#cc-root .quick-stats-row .qstat-val { color:var(--ink); font-family:var(--num); }
#cc-root .quick-stats-row .qstat-label { color:var(--ink3); }

#cc-root .section { background:var(--surface); border:1px solid var(--line); border-radius:var(--r4); box-shadow:var(--sh1); padding:18px; margin:0; }
#cc-root .section-header { border:none; padding:0; margin:0 0 14px; }
#cc-root .section-title { font-size:var(--fs-lg); font-weight:600; color:var(--ink); }
#cc-root .section-title .icon i, #cc-root .section-title > i { color:var(--accent); }

#cc-root .stat-card-module { background:var(--elevated); border:1px solid var(--line-soft); border-radius:var(--r2); padding:14px; }
#cc-root .stat-card-module h3 { font-size:.82rem; font-weight:600; color:var(--ink); border-bottom:1px solid var(--line-soft); padding-bottom:8px; margin-bottom:10px; }
#cc-root .three-col-settings { display:grid; grid-template-columns:repeat(auto-fit,minmax(240px,1fr)); gap:14px; }
#cc-root .precision-grid { display:grid; grid-template-columns:repeat(auto-fit,minmax(140px,1fr)); gap:11px; }
#cc-root .field-label { color:var(--ink2); font-size:var(--fs-sm); font-weight:500; }
#cc-root .field-input, #cc-root .settings-grid input, #cc-root .settings-grid select { background:var(--elevated); border:1px solid var(--line); border-radius:var(--r1); color:var(--ink); font-family:var(--num); font-size:var(--fs-base); padding:8px 10px; outline:none; }
#cc-root .field-input:focus, #cc-root .settings-grid input:focus, #cc-root .settings-grid select:focus { border-color:var(--accent); }
#cc-root .settings-grid label { color:var(--ink2); font-size:.82rem; }

#cc-root .datum-radio-group label, #cc-root .weight-radio-group label { background:var(--elevated); border:1px solid var(--line-soft); border-radius:var(--r2); color:var(--ink); }
#cc-root .datum-radio-group label:has(input:checked), #cc-root .weight-radio-group label:has(input:checked) { border-color:var(--accent); background:var(--soft); color:var(--accent); }
#cc-root .weight-group-title { color:var(--ink3); }

#cc-root .upload-trigger { border:2px dashed var(--line); background:var(--elevated); border-radius:var(--r2); }
#cc-root .upload-trigger:hover { border-color:var(--accent); background:var(--soft); }
#cc-root .upload-action { background:var(--accent-fill); border:none; border-radius:var(--r1); color:#fff; }

#cc-root .table-wrap { overflow-x:auto; }
#cc-root .table-wrap table { width:100%; border-collapse:collapse; font-size:var(--fs-base); }
#cc-root .table-wrap table thead th { background:var(--elevated); color:var(--ink3); font-size:var(--fs-xs); font-weight:700; text-transform:uppercase; letter-spacing:.04em; padding:9px 10px; text-align:left; border-bottom:1px solid var(--line); white-space:nowrap; }
#cc-root .table-wrap table tbody td { padding:4px 8px; border-bottom:1px solid var(--line-soft); vertical-align:middle; }
#cc-root .table-wrap table tbody input, #cc-root .table-wrap table tbody select { width:100%; padding:5px 8px; border:1px solid transparent; background:transparent; color:var(--ink); border-radius:var(--r1); font-family:var(--num); font-size:.82rem; outline:none; }
#cc-root .table-wrap table tbody input:focus, #cc-root .table-wrap table tbody select:focus { border-color:var(--line); background:var(--elevated); }
#cc-root .table-wrap table tbody input[type="checkbox"] { width:17px; height:17px; accent-color:var(--accent); }
#cc-root .table-wrap table tbody button { border:1px solid var(--line); background:var(--surface); color:var(--ink3); border-radius:7px; cursor:pointer; padding:4px 8px; }
#cc-root .table-wrap table tbody button:hover { border-color:var(--bad); color:var(--bad); }

#cc-root .tabs-container { background:var(--elevated); border:1px solid var(--line-soft); border-radius:var(--r2); }
#cc-root .tabs-nav { border-bottom:1px solid var(--line-soft); }
#cc-root .tab-badge { background:var(--soft); color:var(--accent); border-radius:9px; font-family:var(--num); font-weight:700; }

#cc-root .section > button, #cc-root .tab-content > button { background:transparent; border:1px dashed var(--accent); color:var(--accent); border-radius:9px; padding:7px 13px; font-size:var(--fs-md); font-weight:600; cursor:pointer; font-family:'IBM Plex Sans',sans-serif; }
#cc-root .section > button:hover, #cc-root .tab-content > button:hover { background:var(--soft); }

#cc-root .sticky-toolbar { background:color-mix(in srgb,var(--surface) 92%,transparent); border-top:1px solid var(--line); box-shadow:none; backdrop-filter:blur(14px); }
#cc-root .sticky-toolbar-info { color:var(--ink2); }
#cc-root .btn-primary-action { background:linear-gradient(135deg,var(--accent-fill),var(--accent2)); border:none; border-radius:11px; color:#fff; font-weight:700; }
#cc-root .btn-secondary-action { background:var(--surface); border:1px solid var(--line); border-radius:11px; color:var(--ink); }

#cc-root .result-pane { background:var(--elevated); border:1px solid var(--line-soft); border-radius:var(--r2); padding:14px; }
#cc-root .results-panel .qstat-card, #cc-root .section .qstat-card { background:var(--elevated); border:1px solid var(--line-soft); border-radius:var(--r2); box-shadow:none; }

/* Sakrij auto floating TOC i prazne rezultate u cc modulima */
body:has(#cc-root) .module-toc { display:none !important; }
#cc-root #results-container:empty { display:none; }
#cc-root .results-panel:empty { display:none; }

/* Резултатска заглавља: σ (и друга грчка) остају мала слова — text-transform:uppercase
   претвара σ→Σ, па га искључујемо на th резултатских табела (исто као obelezavanje).
   Глобални штит: cacarot-theme има голо `th { uppercase }` које хвата и табеле ван
   thead/#results-container (нпр. прој 1Д резултати) — зато СВЕ th под #cc-root
   иду на none; специфичнија правила (нпр. .res-table th у analiza_mjerenja) и даље
   могу да га врате, а грчка слова тамо већ имају span-омотаче. */
#cc-root table th,
#cc-root #results-container thead th,
#cc-root .table-wrap table thead th { text-transform: none; }


/* ============================================================
   Tok osmatranja — timeline navigacija kroz radni tok
   (Projektovanje → Teren → Izravnanje → Osmatranje → Elaborat).
   Markup: templates/_tok_osmatranja.html; .on = tekući korak,
   .done = koraci prije tekućeg, .off = korak van aktivnog režima.
   ============================================================ */
.cc-flow { display:flex; align-items:stretch; background:var(--surface); border:1px solid var(--line); border-radius:var(--r2); margin-bottom:22px; overflow-x:auto; }
.cc-flow-step { position:relative; flex:1 1 0; min-width:118px; display:flex; flex-direction:column; align-items:center; gap:3px; padding:13px 10px 11px; text-decoration:none; text-align:center; cursor:pointer; }
.cc-flow-step::before { content:''; position:absolute; top:25px; left:0; right:0; height:2px; background:var(--line); }
.cc-flow-step:first-child::before { left:50%; }
.cc-flow-step:last-child::before { right:50%; }
.cc-flow-dot { position:relative; z-index:1; width:26px; height:26px; border-radius:50%; display:flex; align-items:center; justify-content:center; font-family:var(--num); font-size:.78rem; font-weight:700; background:var(--elevated); border:2px solid var(--line); color:var(--ink3); margin-bottom:3px; transition:border-color .15s ease, color .15s ease; }
.cc-flow-lab { font-size:var(--fs-sm); font-weight:600; color:var(--ink2); white-space:nowrap; }
.cc-flow-sub { font-size:.66rem; color:var(--ink3); white-space:nowrap; }
a.cc-flow-step:hover .cc-flow-dot { border-color:var(--accent); color:var(--accent); }
a.cc-flow-step:hover .cc-flow-lab { color:var(--accent); }
.cc-flow-step.on { cursor:default; }
.cc-flow-step.on .cc-flow-dot { background:var(--accent-fill); border-color:var(--accent-fill); color:#fff; }
.cc-flow-step.on .cc-flow-lab { color:var(--accent); }
.cc-flow-step.done .cc-flow-dot { background:var(--soft); border-color:var(--accent); color:var(--accent); }
.cc-flow-step.off { opacity:.4; }

/* ── Segment-navigacija modula (cc_seg_nav.js) ─────────────────────
   Vertikalna traka uz DESNU ivicu ekrana: tačka po segmentu stranice
   ([data-flow-step] na h3/kontejneru), labela na hover i za aktivni.
   Aktivni segment prati se IntersectionObserver-om (scrollspy). */
.cc-seg-nav { position:fixed; right:10px; top:50%; transform:translateY(-50%); z-index:var(--z-seg); display:flex; flex-direction:column; }
.cc-seg-step { position:relative; display:flex; align-items:center; justify-content:center; padding:6px; text-decoration:none; }
.cc-seg-step::before { content:''; position:absolute; left:50%; top:0; bottom:0; width:2px; transform:translateX(-50%); background:var(--line); }
.cc-seg-step:first-child::before { top:50%; }
.cc-seg-step:last-child::before { bottom:50%; }
.cc-seg-dot { position:relative; z-index:1; width:24px; height:24px; border-radius:50%; display:flex; align-items:center; justify-content:center; font-family:var(--num); font-size:.7rem; font-weight:700; background:var(--elevated); border:2px solid var(--line); color:var(--ink3); transition:border-color .15s ease, background .15s ease, color .15s ease; }
.cc-seg-lab { position:absolute; right:calc(100% + 6px); top:50%; transform:translateY(-50%); background:var(--surface); border:1px solid var(--line); border-radius:var(--r1); box-shadow:0 3px 10px rgba(15,23,42,.12); padding:4px 10px; font-size:.72rem; font-weight:600; color:var(--ink2); white-space:nowrap; opacity:0; pointer-events:none; transition:opacity .15s ease; }
.cc-seg-step:hover .cc-seg-dot { border-color:var(--accent); color:var(--accent); }
.cc-seg-step:hover .cc-seg-lab, .cc-seg-step.on .cc-seg-lab { opacity:1; }
.cc-seg-step.on .cc-seg-dot { background:var(--accent-fill); border-color:var(--accent-fill); color:#fff; }
.cc-seg-step.off { opacity:.35; cursor:default; }
/* Stalna etiketa aktivnog koraka na širinama <1600px prekriva sadržaj
   (audit M-19: „СТАТУС ОК" u analizi, trash dugme u vertikalnosti) —
   ispod 1600px etiketa se vidi samo na hover. */
@media (max-width:1599px) { .cc-seg-step.on .cc-seg-lab { opacity:0; } .cc-seg-step.on:hover .cc-seg-lab { opacity:1; } }
/* RESP-4: на уским екранима вертикална трака нема мјеста — сегменти постају
   хоризонтални ЧИПОВИ (пилуле са бројем и називом) у траци изнад cc-sticky
   акција, хоризонтално скроловој. Исти DOM (cc_seg_nav.js се не мијења). */
@media (max-width:1100px) {
    .cc-seg-nav { flex-direction:row; gap:6px; top:auto; transform:none;
        left:10px; right:10px; bottom:calc(64px + env(safe-area-inset-bottom, 0px));
        overflow-x:auto; padding:5px 6px; scrollbar-width:none; -webkit-overflow-scrolling:touch;
        background:color-mix(in srgb, var(--bg) 80%, transparent);
        backdrop-filter:blur(8px); border-radius:999px; }
    .cc-seg-nav::-webkit-scrollbar { display:none; }
    .cc-seg-step { flex:0 0 auto; gap:6px; padding:4px 10px 4px 5px; border-radius:999px;
        background:color-mix(in srgb, var(--surface) 94%, transparent);
        border:1px solid var(--line); box-shadow:0 2px 8px rgba(15,23,42,.10); }
    .cc-seg-step::before { display:none; }
    .cc-seg-dot { width:18px; height:18px; font-size:.6rem; border-width:1.5px; }
    .cc-seg-lab { position:static; transform:none; opacity:1; pointer-events:auto;
        background:transparent; border:none; box-shadow:none; padding:0; }
    .cc-seg-step.on { border-color:var(--accent); }
    .cc-seg-step.on .cc-seg-lab { color:var(--accent); }
    .cc-seg-step.off { opacity:.4; }
}

/* Sklopiva kartica: 
 sa
   

   … 
 */
.cc-card-head.cc-toggle { cursor:pointer; user-select:none; }
.cc-card-head.cc-toggle .cc-caret { margin-left:auto; color:var(--ink3); font-size:var(--fs-md); transition:transform .18s ease; }
.cc-card.cc-closed .cc-card-head { border-bottom-color:transparent; }
.cc-card.cc-closed .cc-card-body { display:none; }
.cc-card.cc-closed .cc-card-head.cc-toggle .cc-caret { transform:rotate(-90deg); }

/* ============================================================
   Mali ekrani (<=720px) — telefon/uski tablet.
   Konzervativno: nav se svodi na ikone, statistike u 2 kolone,
   header/sticky se prelamaju; desktop netaknut.
   ============================================================ */
@media (max-width: 720px) {
    .cc-nav { height:auto; padding:6px 0; }
    .cc-nav-inner { flex-wrap:wrap; gap:8px; padding:0 12px; }
    .cc-nav-link span, .cc-nav-home span { display:none; }   /* samo ikone */
    .cc-brand-sub { display:none; }
    .cc-content { padding:16px 12px 0; }
    .cc-shell { padding:0 12px; }
    .cc-stats { grid-template-columns:1fr 1fr; gap:10px; }
    .cc-head { flex-direction:column; align-items:flex-start; gap:12px; }
    .cc-head-actions { flex-wrap:wrap; }
    .cc-sticky-inner { flex-wrap:wrap; gap:8px; padding:10px 12px; }
    .cc-sticky-actions { flex-wrap:wrap; }
    /* tabele za unos: horizontalni scroll umjesto lomljenja layouta */
    #cc-root .cc-card-body { overflow-x:auto; }
}

/* ============================================================
   Toast (cc_toast.js) — stil ISKLJUČIVO ovdje (ranije inline cssText u JS-u,
   bez dark teme). DOM: #cc-toast-holder.cc-toast-holder > .cc-toast.{ok|warn|error|info}
   > i.bi + span (poruka) [+ button.cc-toast-action] [+ button.cc-toast-close]
   ============================================================ */
.cc-toast-holder { position:fixed; right:18px; bottom:18px; z-index:var(--z-toast,1100); font-family:var(--font-ui,sans-serif); display:flex; flex-direction:column; gap:8px;
    max-width:min(420px,calc(100vw - 36px)); }
.cc-toast { --tone:var(--accent,#2f6ad6); --tone-ink:var(--ink,#19212e); --tone-s:var(--soft,#e8eefb);
    display:flex; gap:9px; align-items:flex-start; padding:11px 14px; border-radius:var(--r2,10px);
    background:var(--tone-s); border:1px solid var(--tone); border-left:4px solid var(--tone); color:var(--tone-ink);
    font-family:'IBM Plex Sans',sans-serif; font-size:var(--fs-base); line-height:1.5; white-space:pre-line; cursor:pointer;
    box-shadow:var(--sh2,0 8px 24px -10px rgba(0,0,0,.35)); animation:ccup var(--t-base,.2s) var(--ease,ease); }
.cc-toast > i { margin-top:2px; flex-shrink:0; color:var(--tone); }
.cc-toast > span { flex:1 1 auto; min-width:0; }
.cc-toast.info  { --tone:var(--accent,#2f6ad6); --tone-ink:var(--ink,#19212e); --tone-s:var(--soft,#e8eefb); }
.cc-toast.ok    { --tone:var(--ok,#1f9d63); --tone-ink:var(--ok-ink,#17714a); --tone-s:var(--ok-s,#e8f6ee); }
.cc-toast.warn  { --tone:var(--warn,#c8963a); --tone-ink:var(--warn-ink,#8a6420); --tone-s:var(--warn-s,#fbf4e6); }
.cc-toast.error { --tone:var(--bad,#d95f5f); --tone-ink:var(--bad-ink,#b34848); --tone-s:var(--bad-s,#fbeded); }
/* toast na tamnom: prozirna -s pozadina bi pustila sadržaj ispod — podloži surface */
html[data-theme="dark"] .cc-toast { background-color:var(--surface); background-image:linear-gradient(var(--tone-s),var(--tone-s)); }
.cc-toast-action { flex-shrink:0; align-self:center; margin-left:4px; padding:5px 11px; border-radius:var(--r1,6px);
    border:1px solid var(--tone); background:var(--surface); color:var(--tone-ink); font:inherit; font-size:.78rem; font-weight:600; cursor:pointer; white-space:nowrap; }
.cc-toast-action:hover { background:var(--tone); color:#fff; }
.cc-toast-close { flex-shrink:0; align-self:flex-start; margin:-2px -4px 0 0; width:24px; height:24px; border:none; background:transparent;
    color:var(--tone-ink); opacity:.65; cursor:pointer; border-radius:var(--r1,6px); font-size:.9rem; line-height:1; }
.cc-toast-close:hover { opacity:1; background:color-mix(in srgb,var(--tone) 15%,transparent); }
.cc-toast-holder :is(button):focus-visible { outline:2px solid var(--accent); outline-offset:2px; }

/* ── Potvrda (ccConfirm u cc_toast.js) —  ili
   .cc-confirm-backdrop > .cc-confirm[role=dialog]; dugmad .cc-btn / .cc-btn-primary /.danger ── */
.cc-confirm-backdrop { position:fixed; inset:0; z-index:var(--z-modal,1000); background:rgba(12,15,21,.45); backdrop-filter:blur(3px);
    display:flex; align-items:center; justify-content:center; padding:16px; }
dialog.cc-confirm::backdrop { background:rgba(12,15,21,.45); backdrop-filter:blur(3px); }
.cc-confirm { width:min(440px,calc(100vw - 32px)); margin:auto; padding:0; border:1px solid var(--line); border-radius:var(--r3,14px);
    background:var(--surface); color:var(--ink); box-shadow:var(--sh3,0 18px 50px -28px rgba(0,0,0,.5));
    font-family:'IBM Plex Sans',sans-serif; animation:ccup var(--t-base,.2s) var(--ease,ease); }
.cc-confirm-head { display:flex; align-items:center; gap:10px; padding:16px 18px 0; font-weight:700; font-size:.95rem; }
.cc-confirm-head > i { color:var(--warn); font-size:1.1rem; }
.cc-confirm.danger .cc-confirm-head > i { color:var(--bad); }
.cc-confirm-body { padding:10px 18px 16px; font-size:.86rem; line-height:1.55; color:var(--ink2); white-space:pre-line; }
.cc-confirm-actions { display:flex; justify-content:flex-end; gap:8px; padding:12px 18px 16px; border-top:1px solid var(--line-soft); }
.cc-confirm-actions .cc-btn, .cc-confirm-actions .cc-btn-primary { padding:8px 14px; font-size:.82rem; }
.cc-confirm.danger .cc-btn-primary { background:var(--bad); box-shadow:none; }
.cc-confirm :is(button):focus-visible { outline:2px solid var(--accent); outline-offset:2px; }

/* ── Padajući meni (avatar na dashboardu) + modal: fokus i aria stanja ── */
.cc-dropdown { position:relative; }
.cc-dropdown-toggle[aria-expanded="true"] { border-color:var(--accent); color:var(--accent); }
.cc-dropdown-toggle[aria-expanded="true"] .bi-chevron-down { transform:rotate(180deg); }
.cc-dropdown-menu { display:none; position:absolute; right:0; top:calc(100% + 6px); min-width:220px; z-index:var(--z-nav,50);
    background:var(--surface); border:1px solid var(--line); border-radius:var(--r2,10px); box-shadow:var(--sh2); padding:6px; }
.cc-dropdown.open .cc-dropdown-menu, .cc-dropdown-toggle[aria-expanded="true"] + .cc-dropdown-menu { display:block; }
.cc-dropdown-menu a, .cc-dropdown-menu button { display:flex; align-items:center; gap:8px; width:100%; padding:8px 10px; border-radius:var(--r1,6px);
    color:var(--ink); font-size:var(--fs-base); border:none; background:transparent; cursor:pointer; text-align:left; font:inherit; }
.cc-dropdown-menu a:hover, .cc-dropdown-menu button:hover, .cc-dropdown-menu a:focus-visible, .cc-dropdown-menu button:focus-visible { background:var(--elevated); outline:none; }
.cc-dropdown-menu [role="menuitem"]:focus-visible { box-shadow:inset 0 0 0 2px var(--accent); }
#cc-root .modal:focus-visible, #cc-root [role="dialog"]:focus-visible { outline:none; }
#cc-root .modal-content:focus-visible { outline:2px solid var(--accent); outline-offset:-2px; }

/* ── Skeleton (izvestaj/izvestaj_edit) — jednom, umjesto 2 inline kopije ── */
@keyframes cc-shimmer { from { background-position:200% 0; } to { background-position:-200% 0; } }
.cc-skeleton { border-radius:var(--r1,6px); background:linear-gradient(90deg,var(--elevated) 25%,var(--line-soft) 50%,var(--elevated) 75%);
    background-size:200% 100%; animation:cc-shimmer 1.4s var(--ease,ease) infinite; min-height:1em; }
/* fadeUp — jedna globalna definicija (9 inline kopija u templejtima su ekvivalentne) */
@keyframes fadeUp { from { opacity:0; transform:translateY(10px); } to { opacity:1; transform:none; } }

/* ── B: cc_stale.js / cc_tabele.js / toast akcije ── */
.cc-stale-bar { display:flex; align-items:center; gap:10px; padding:8px 12px; margin:0 0 10px; border-radius:var(--r2,10px);
    background:var(--warn-s,#fbf4e6); border:1px solid var(--warn,#c8963a); border-left:4px solid var(--warn,#c8963a); color:var(--warn-ink,#8a6420); font-size:var(--fs-md); }
.cc-stale-bar > i { flex-shrink:0; }
.cc-stale-bar > span { flex:1 1 auto; }
.cc-stale .res-card, .cc-stale .cc-stat, .cc-stale .res-metric { opacity:.55; }
.cc-row-dup { outline:2px solid var(--warn); }
.cc-toast-akcija { flex-shrink:0; align-self:center; margin-left:4px; padding:5px 11px; border-radius:var(--r1,6px);
    border:1px solid var(--tone); background:var(--surface); color:var(--tone-ink); font:inherit; font-size:.78rem; font-weight:600; cursor:pointer; white-space:nowrap; }
.cc-toast-akcija:hover { background:var(--tone); color:#fff; }

/* === a11y (inspekcija 2026-08-28) === */
/* Visually-hidden tekst (caption tabela, imena ikoničkih kontrola) */
.sr-only { position:absolute !important; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip:rect(0,0,0,0); white-space:nowrap; border:0; }
/* Skip-link: skriven dok ne dobije fokus tastaturom */
.skip-link { position:absolute; left:8px; top:-100px; z-index:10000; padding:8px 14px; border-radius:8px;
    background:var(--accent, #2f6ad6); color:#fff; font-weight:600; font-size:.85rem; text-decoration:none; }
.skip-link:focus, .skip-link:focus-visible { top:8px; outline:3px solid #fff; outline-offset:2px; }
/* Kartice-sekcije: h2 u zaglavlju kartice izgleda kao dosadašnji h3 */
.cc-card-head h2 { font-size:var(--fs-lg); font-weight:600; margin:0; }
#cc-root .stat-card-module h2 { font-size:.82rem; font-weight:600; color:var(--ink); border-bottom:1px solid var(--line-soft); padding-bottom:8px; margin-bottom:10px; }
/* Makro polje(): hint + legenda obaveznih polja */
.cc-hint { font-size:var(--fs-sm); color:var(--text-secondary, var(--ink2)); margin-top:.3rem; }
.cc-req { color:var(--danger, #c0392b); font-weight:600; }
.cc-legenda { font-size:var(--fs-sm); color:var(--text-secondary, var(--ink2)); margin:.6rem 0 0; }
[aria-invalid="true"] { border-color:var(--danger, #c0392b) !important; }
/* Forme: submit u toku (cc_forme.js) */
form[data-cc-submit-once] [aria-busy="true"] { opacity:.6; cursor:progress; }
/* RESP-2: tabele sa inputima ne smiju da se sabijaju — omotač skroluje */
#cc-root .cc-table { min-width:560px; }
#cc-root .cc-table th { white-space:nowrap; }
/* RESP-3: sticky podnožje na telefonu u jedan red */
@media (max-width: 720px) {
    .cc-sticky-inner { flex-wrap:nowrap; align-items:center; }
    .cc-sticky-inner .cc-status { font-size:var(--fs-2xs); min-width:0; }
    .cc-sticky-actions { flex:1 1 auto; flex-wrap:nowrap; justify-content:flex-end; }
    .cc-sticky-actions .cc-btn, .cc-sticky-actions .cc-btn-primary { flex:1 1 auto; justify-content:center; padding-left:8px; padding-right:8px; }
}
/* RESP-5/9: touch-targeti na uređajima sa prstom */
@media (pointer: coarse) {
    #cc-root .cc-table tbody button { width:36px; height:36px; min-width:36px; }
    #cc-root .cc-table tbody input[type="checkbox"] { width:22px; height:22px; }
    .eye-btn { min-width:40px; min-height:40px; display:inline-flex; align-items:center; justify-content:center; }
    .cc-icon-btn { min-width:44px; min-height:40px; }
}