/* ===================== Proizvodni tok – dodaci ===================== */
.pt-grana-chip { display: inline-flex; align-items: center; gap: 6px; font-size: .78rem; font-weight: 600; padding: 5px 11px; border-radius: 999px;
    background: rgba(255, 255, 255, .07); border: 1px solid rgba(255, 255, 255, .12); color: #E2E8F0; }
.pt-linija-tacka { animation: ptLinija 7s cubic-bezier(.6, 0, .4, 1) infinite; offset-path: path("M 20 60 L 580 60"); offset-rotate: 0deg; }
@keyframes ptLinija { 0% { offset-distance: 0%; } 18% { offset-distance: 25%; } 25% { offset-distance: 25%; } 43% { offset-distance: 50%; } 50% { offset-distance: 50%; } 68% { offset-distance: 75%; } 75% { offset-distance: 75%; } 95%, 100% { offset-distance: 100%; } }

/* Uživo oznaka */
.pt-uzivo { display: inline-flex; align-items: center; gap: 6px; font-size: .72rem; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; color: #4ADE80; }
.pt-uzivo::before { content: ""; width: 8px; height: 8px; border-radius: 50%; background: #22C55E; box-shadow: 0 0 0 0 rgba(34, 197, 94, .6); animation: ptPuls 1.8s infinite; }
@keyframes ptPuls { 0% { box-shadow: 0 0 0 0 rgba(34, 197, 94, .55); } 70% { box-shadow: 0 0 0 9px rgba(34, 197, 94, 0); } 100% { box-shadow: 0 0 0 0 rgba(34, 197, 94, 0); } }

/* Traka statusa */
.pt-traka { display: flex; height: 10px; border-radius: 999px; overflow: hidden; background: var(--mud-palette-lines-default); }
.pt-traka > div { height: 100%; transition: width .5s ease; }
.pt-traka-velika { height: 14px; }
.pt-legenda { display: flex; flex-wrap: wrap; gap: 6px 14px; font-size: .75rem; color: var(--mud-palette-text-secondary); }
.pt-legenda span { display: inline-flex; align-items: center; gap: 6px; }
.pt-legenda i { width: 10px; height: 10px; border-radius: 3px; display: inline-block; }

/* Tok kroz pogon */
.pt-tok { display: grid; grid-auto-flow: column; grid-auto-columns: minmax(118px, 1fr); gap: 12px; overflow-x: auto; padding: 4px 2px 8px; }
.pt-faza { position: relative; border-radius: 12px; padding: 12px 12px 10px 16px; background: var(--mud-palette-surface); border: 1px solid var(--mud-palette-lines-default); cursor: pointer; transition: transform .15s, box-shadow .15s; }
.pt-faza:hover { transform: translateY(-2px); box-shadow: var(--rt-sjena-hover); }
.pt-faza::before { content: ""; position: absolute; left: 0; top: 0; bottom: 0; width: 4px; border-radius: 12px 0 0 12px; background: var(--pt-boja, #64748B); }
.pt-faza-broj { font-size: 1.6rem; font-weight: 800; letter-spacing: -.03em; line-height: 1.1; font-variant-numeric: tabular-nums; }
.pt-faza-naziv { font-size: .78rem; font-weight: 600; color: var(--mud-palette-text-secondary); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.pt-faza-danas { font-size: .7rem; font-weight: 700; color: #16A34A; }

/* Živi feed */
.pt-feed-stavka { display: flex; gap: 12px; align-items: flex-start; padding: 10px 20px; border-top: 1px solid var(--mud-palette-lines-default); cursor: pointer; transition: background .12s; }
.pt-feed-stavka:hover { background: var(--mud-palette-action-default-hover); }
.pt-feed-nova { animation: ptNovo 2.4s ease; }
@keyframes ptNovo { 0% { background: rgba(34, 197, 94, .22); } 100% { background: transparent; } }
.pt-feed-ikona { width: 30px; height: 30px; border-radius: 9px; display: grid; place-items: center; flex-shrink: 0; }

/* 2D plan */
.pt-plan { width: 100%; height: auto; max-height: 68vh; display: block; user-select: none; }
.pt-plan .el { cursor: pointer; transition: opacity .15s; }
.pt-plan .el:hover { opacity: .75; }
.pt-plan .el.odabran { stroke: #F59E0B !important; stroke-width: .4 !important; }
.pt-plan .el.blok { stroke: #DC2626; stroke-width: .25; }
.pt-plan .el.prigusen { opacity: .15; }
.pt-plan-okvir { position: relative; border-radius: 12px; background: var(--mud-palette-background-gray); padding: 12px; overflow: auto; }

/* 3D */
.pt-3d { width: 100%; height: 560px; border-radius: 12px; overflow: hidden; position: relative; background: var(--mud-palette-background-gray); }
.pt-3d canvas { display: block; touch-action: none; }
.pt-3d-info { position: absolute; left: 12px; top: 12px; font-size: .72rem; color: var(--mud-palette-text-secondary); background: var(--mud-palette-surface); border: 1px solid var(--mud-palette-lines-default); border-radius: 8px; padding: 4px 8px; pointer-events: none; }

/* Kanban tabla */
.pt-kanban { display: grid; grid-auto-flow: column; grid-auto-columns: minmax(230px, 1fr); gap: 12px; overflow-x: auto; padding-bottom: 12px; align-items: start; }
.pt-kolona { background: var(--mud-palette-background-gray); border-radius: 14px; padding: 10px; min-height: 200px; border: 1px solid var(--mud-palette-lines-default); }
.pt-kolona-glava { display: flex; align-items: center; justify-content: space-between; gap: 8px; padding: 2px 4px 10px; }
.pt-kartica-el { background: var(--mud-palette-surface); border-radius: 10px; padding: 9px 10px; margin-bottom: 8px; border: 1px solid var(--mud-palette-lines-default); border-left: 3px solid var(--pt-boja, #94A3B8); cursor: pointer; transition: transform .12s, box-shadow .12s; }
.pt-kartica-el:hover { transform: translateY(-1px); box-shadow: var(--rt-sjena-hover); }
.pt-kartica-el.kasni { border-left-color: #DC2626; }
.pt-kartica-el.blok { background: rgba(220, 38, 38, .06); }

/* Liste za odabir */
.pt-odabir { display: flex; align-items: center; gap: 12px; padding: 10px 16px; border-top: 1px solid var(--mud-palette-lines-default); cursor: pointer; transition: background .1s; }
.pt-odabir:hover { background: var(--mud-palette-action-default-hover); }
.pt-odabir.da { background: rgba(15, 76, 129, .07); }

/* Check-lista kontrole */
.pt-stavka { display: flex; align-items: center; gap: 10px; padding: 10px 12px; border-radius: 10px; border: 1px solid var(--mud-palette-lines-default); margin-bottom: 8px; }
.pt-stavka.ok { border-color: rgba(22, 163, 74, .45); background: rgba(22, 163, 74, .06); }
.pt-stavka.ne { border-color: rgba(220, 38, 38, .45); background: rgba(220, 38, 38, .06); }

/* Moduli */
.pt-modul { height: 100%; padding: 20px; display: flex; flex-direction: column; gap: 10px; }
.pt-modul.ukljucen { border-color: rgba(245, 158, 11, .55); box-shadow: 0 10px 30px -18px rgba(245, 158, 11, .7) !important; }
.pt-modul-ikona { width: 46px; height: 46px; border-radius: 13px; display: grid; place-items: center; }

/* Plan proizvodnje */
.pt-plan-tabela { width: 100%; border-collapse: separate; border-spacing: 6px; }
.pt-plan-tabela th { font-size: .72rem; text-transform: uppercase; letter-spacing: .05em; color: var(--mud-palette-text-secondary); text-align: left; font-weight: 600; padding: 4px 6px; }
.pt-plan-celija { vertical-align: top; background: var(--mud-palette-background-gray); border-radius: 10px; padding: 8px; min-width: 150px; }
.pt-plan-celija.danas { box-shadow: inset 0 0 0 2px rgba(245, 158, 11, .6); }
.pt-plan-celija.puno { background: rgba(220, 38, 38, .07); }
.pt-chip-el { display: inline-flex; align-items: center; gap: 4px; font-size: .72rem; font-weight: 600; padding: 2px 7px; border-radius: 6px; margin: 0 4px 4px 0; cursor: pointer; background: var(--mud-palette-surface); border: 1px solid var(--mud-palette-lines-default); }

/* Kod / API */
.pt-kod { font-family: ui-monospace, "Cascadia Mono", Consolas, monospace; font-size: .8rem; background: #0B1220; color: #E2E8F0; border-radius: 10px; padding: 12px 14px; overflow-x: auto; white-space: pre; }
.pt-qr svg { width: 100%; height: auto; display: block; }

/* Deponija */
.pt-deponija { display: grid; grid-template-columns: 28px repeat(8, minmax(92px, 1fr)); gap: 8px; min-width: 820px; }
.pt-deponija-osa { display: grid; place-items: center; font-weight: 800; font-size: .8rem; color: var(--mud-palette-text-secondary); }
.pt-polje { border-radius: 10px; padding: 8px 9px; background: var(--mud-palette-background-gray); border: 1px solid var(--mud-palette-lines-default); cursor: pointer; transition: transform .12s, box-shadow .12s, opacity .2s; min-height: 64px; }
.pt-polje:hover { transform: translateY(-1px); box-shadow: var(--rt-sjena-hover); }
.pt-polje.puno { background: rgba(220, 38, 38, .07); border-color: rgba(220, 38, 38, .35); }
.pt-polje.odabrano { box-shadow: 0 0 0 2px #0F4C81; }
.pt-polje.pogodak { box-shadow: 0 0 0 3px #F59E0B, 0 0 24px rgba(245, 158, 11, .55); animation: ptNovo 1.6s ease; }
.pt-polje.prigusen { opacity: .35; }
.pt-polje-slotovi { display: grid; grid-template-columns: repeat(5, 1fr); gap: 3px; margin-top: 7px; }
.pt-polje-slotovi i { height: 9px; border-radius: 2px; display: block; }

/* Ekran za halu */
.pt-ekran { min-height: 100vh; background: radial-gradient(900px 500px at 100% 0%, rgba(245, 158, 11, .14), transparent 60%), #070F1F; color: #E2E8F0; padding: 28px 34px; font-family: Inter, sans-serif; }
.pt-ekran-kpi { border-radius: 18px; padding: 20px 24px; background: rgba(255, 255, 255, .04); border: 1px solid rgba(255, 255, 255, .08); }
.pt-ekran-kpi b { display: block; font-size: clamp(2.2rem, 4.2vw, 4rem); font-weight: 800; letter-spacing: -.04em; line-height: 1; font-variant-numeric: tabular-nums; }
.pt-ekran-kpi span { color: #94A3B8; font-size: 1rem; }
.pt-ekran-naslov { font-size: 1.05rem; font-weight: 700; color: #CBD5E1; margin-bottom: 12px; text-transform: uppercase; letter-spacing: .08em; }
.pt-ekran-faza { border-radius: 14px; padding: 14px 16px; background: rgba(255, 255, 255, .04); border: 1px solid rgba(255, 255, 255, .07); border-top: 4px solid var(--pt-boja); }
.pt-ekran-faza b { font-size: 2.4rem; font-weight: 800; line-height: 1.05; display: block; font-variant-numeric: tabular-nums; }
.pt-ekran-red { display: flex; gap: 14px; align-items: center; padding: 10px 0; border-bottom: 1px solid rgba(255, 255, 255, .06); font-size: 1.05rem; }

/* Demo vodič */
.pt-vodic-dugme { position: fixed; left: 272px; bottom: 22px; z-index: 1300; height: 44px; padding: 0 16px; border-radius: 22px; display: flex; align-items: center; gap: 8px; cursor: pointer;
    color: #0A1F3D; background: #fff; border: 1px solid var(--mud-palette-lines-default); box-shadow: 0 10px 24px -12px rgba(10, 31, 61, .45); font-weight: 700; font-size: .88rem; }
.pt-vodic { position: fixed; left: 272px; bottom: 76px; z-index: 1300; width: min(360px, calc(100vw - 32px)); border-radius: 16px; overflow: hidden; background: var(--mud-palette-surface);
    border: 1px solid var(--mud-palette-lines-default); box-shadow: 0 30px 60px -20px rgba(10, 31, 61, .45); animation: rtUlaz .25s ease both; }
.pt-vodic-glava { padding: 14px 16px; color: #fff; background: linear-gradient(120deg, #0A1F3D, #1D4E89); }
.pt-vodic-korak { display: flex; gap: 12px; padding: 11px 16px; border-top: 1px solid var(--mud-palette-lines-default); cursor: pointer; transition: background .12s; }
.pt-vodic-korak:hover { background: var(--mud-palette-action-default-hover); }
.pt-vodic-broj { width: 24px; height: 24px; border-radius: 50%; display: grid; place-items: center; font-size: .75rem; font-weight: 800; color: #fff; background: #F59E0B; flex-shrink: 0; }
@media (max-width: 960px) { .pt-vodic-dugme, .pt-vodic { left: 14px; } .pt-vodic-dugme { bottom: 14px; } }

@media (max-width: 600px) {
    .pt-3d { height: 400px; }
    .pt-kanban { grid-auto-columns: 82vw; }
}

/* Telefon: ništa ne smije biti šire od ekrana */
.mud-grid-item, .rt-kartica, .mud-main-content, .mud-container { min-width: 0; }
.mud-main-content { overflow-x: hidden; }
.rt-koraci, .pt-tok { max-width: 100%; }
@media (max-width: 600px) {
    .rt-hero-brojke { gap: 14px 22px; }
    .rt-hero-brojka b { font-size: 1.25rem; }
    .rt-zaglavlje > div:first-child { min-width: 0; }
    .pt-tok { grid-auto-columns: 104px; }
    .rt-korak { min-width: 64px; }
}