/* Šetnja — 3D preglednik (pano.js) */
.pv { position: absolute; inset: 0; overflow: hidden; background: #0c0f14; --accent: #FF6A2B; user-select: none; -webkit-user-select: none; }
.pv-stage { position: absolute; inset: 0; outline: none; cursor: grab; touch-action: none; }
.pv-stage.drag { cursor: grabbing; }
.pv-stage.hot { cursor: pointer; }
.pv-stage canvas { display: block; width: 100%; height: 100%; }
.pv-layer { position: absolute; inset: 0; pointer-events: none; }

.pv-hs { position: absolute; left: 0; top: 0; pointer-events: auto; will-change: transform; }
.pv-hs > * { transform: translate(-50%, -50%); }
.pv-ico { width: 40px; height: 40px; border-radius: 50%; display: grid; place-items: center; color: #fff; cursor: pointer;
  background: rgba(14,18,26,.55); border: 2px solid rgba(255,255,255,.9); backdrop-filter: blur(6px); -webkit-backdrop-filter: blur(6px);
  box-shadow: 0 4px 18px rgba(0,0,0,.35); transition: background .15s, transform .15s; position: absolute; left: 0; top: 0; }
.pv-ico svg { width: 20px; height: 20px; }
.pv-hs:hover .pv-ico, .pv-hs.hot .pv-ico { background: var(--accent); border-color: var(--accent); transform: translate(-50%, -50%) scale(1.08); }

.pv-tag { position: absolute; left: 0; top: 0; white-space: nowrap; font: 600 13px/1 "Inter Tight", system-ui, sans-serif; color: #fff; padding: 7px 11px;
  background: rgba(14,18,26,.72); border-radius: 999px; backdrop-filter: blur(6px); -webkit-backdrop-filter: blur(6px); pointer-events: none; }
.pv-go .pv-tag { transform: translate(-50%, 30px); opacity: 0; transition: opacity .15s; }
.pv-go:hover .pv-tag, .pv-go.hot .pv-tag { opacity: 1; }
.pv-floor { width: 0; height: 0; }
.pv-floor .pv-tag { transform: translate(-50%, -100%); opacity: 0; transition: opacity .15s; }
.pv-floor.hot .pv-tag { opacity: 1; }
.pv-floor:not(.pv-edit) { pointer-events: none; }

.pv-info .pv-ico { background: var(--ic, rgba(14,18,26,.55)); }
.pv-info:hover .pv-ico, .pv-info.hot .pv-ico { background: var(--ic, var(--accent)); border-color: #fff; }
.pv-tip { position: absolute; left: 0; top: 0; transform: translate(-50%, calc(-100% - 28px)); width: max-content; max-width: min(280px, 72vw); padding: 10px 13px;
  background: rgb(255 255 255 / var(--a, 1)); color: #0D1B2A; border-radius: 10px; font: 500 13.5px/1.4 "Inter Tight", system-ui, sans-serif; box-shadow: 0 8px 28px rgba(0,0,0,.3);
  opacity: 0; pointer-events: none; transition: opacity .15s; white-space: pre-line; display: grid; gap: 4px; }
.pv-tip.dark { background: rgb(14 18 26 / var(--a, 1)); color: #fff; }
.pv-tip.glass { backdrop-filter: blur(10px); -webkit-backdrop-filter: blur(10px); box-shadow: 0 6px 22px rgba(0,0,0,.22); }
.pv-tip b { font-weight: 700; font-size: 14.5px; white-space: normal; }
.pv-tip a { justify-self: start; margin-top: 3px; color: inherit; font-weight: 700; text-decoration: underline; text-underline-offset: 3px; }
.pv-info:hover .pv-tip, .pv-info.open .pv-tip, .pv-info.near .pv-tip { opacity: 1; }
.pv-info.open .pv-tip a, .pv-info.near .pv-tip a, .pv-info:hover .pv-tip a { pointer-events: auto; }
.pv-info.open, .pv-info:hover { z-index: 3; }
.pv-tip.pic { width: 240px; }
.pv-tip img { display: block; width: calc(100% + 26px); max-width: none; margin: -10px -13px 4px; height: 140px; object-fit: cover; border-radius: 10px 10px 0 0; cursor: zoom-in; }
.pv-info.open .pv-tip img, .pv-info.near .pv-tip img, .pv-info:hover .pv-tip img { pointer-events: auto; }
.pv-zoom { position: absolute; inset: 0; z-index: 40; display: grid; place-items: center; background: rgba(8,10,14,.82); cursor: zoom-out; }
.pv-zoom img { max-width: 92%; max-height: 88%; border-radius: 10px; box-shadow: 0 20px 60px rgba(0,0,0,.5); }

.pv-loading { position: absolute; inset: 0; display: grid; place-items: center; align-content: center; gap: 14px; background: rgba(12,15,20,.55);
  color: #fff; font: 500 14px "Inter Tight", system-ui, sans-serif; transition: opacity .3s; pointer-events: none; }
.pv-loading i { width: 34px; height: 34px; border-radius: 50%; border: 3px solid rgba(255,255,255,.25); border-top-color: var(--accent); animation: pvspin .8s linear infinite; }
.pv-loading.done { opacity: 0; }
.pv-loading.err { background: #0c0f14; opacity: 1; padding: 30px; text-align: center; }
.pv-loading.err i { display: none; }
@keyframes pvspin { to { transform: rotate(360deg); } }

.pv-toast { position: absolute; left: 50%; bottom: 120px; transform: translate(-50%, 10px); max-width: min(90%, 420px); text-align: center;
  background: rgba(14,18,26,.85); color: #fff; padding: 10px 16px; border-radius: 10px; font: 500 13.5px/1.4 "Inter Tight", system-ui, sans-serif;
  opacity: 0; pointer-events: none; transition: opacity .2s, transform .2s; z-index: 30; }
.pv-toast.on { opacity: 1; transform: translate(-50%, 0); }

/* Editor: oznake se mogu hvatati */
.pv-edit { cursor: grab; }
.pv-edit.drag { cursor: grabbing; }
.pv-floor.pv-edit::before { content: ""; position: absolute; left: 0; top: 0; width: 22px; height: 22px; transform: translate(-50%, -50%);
  border-radius: 50%; background: var(--accent); border: 3px solid #fff; box-shadow: 0 2px 10px rgba(0,0,0,.4); }
.pv-floor.pv-edit .pv-tag { opacity: 1; transform: translate(-50%, calc(-100% - 16px)); }
.pv-edit.sel .pv-ico, .pv-floor.pv-edit.sel::before { outline: 3px solid #fff; outline-offset: 3px; }
.pv-edit.oneway::after { content: "1 smjer"; position: absolute; left: 0; top: 0; transform: translate(-50%, 18px); font: 700 10.5px "Inter Tight", system-ui, sans-serif;
  background: #B3261E; color: #fff; padding: 3px 6px; border-radius: 6px; white-space: nowrap; }