/* Wirtualna wędrówka 360 (tour) */

.tourBtn{
  display:inline-flex;
  align-items:center;
  gap:.5rem;
  padding:.75rem 1rem;
  border:1px solid rgba(255,255,255,.18);
  border-radius:10px;
  background:rgba(0,0,0,.35);
  color:#fff;
  cursor:pointer;
  font-weight:600;
}
.tourBtn:hover{ background:rgba(0,0,0,.5); }
.tourBtn:active{ transform:translateY(1px); }

.tourModal{
  position:fixed;
  inset:0;
  display:none;
  z-index:1000;
}
.tourModal.open{ display:block; }

.tourBackdrop{
  position:absolute;
  inset:0;
  background:rgba(0,0,0,.72);
}

.tourStage{
  position:absolute;
  inset:0;
  display:flex;
  flex-direction:column;
}

.tourTop{
  position:relative;
  z-index:2;
  padding:10px 12px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:10px;
  background:linear-gradient(to bottom, rgba(0,0,0,.65), rgba(0,0,0,0));
}

.tourTitle{
  font-weight:700;
  letter-spacing:.2px;
  user-select:none;
}

.tourBtns{
  display:flex;
  gap:8px;
}
.tourBtns .pbtn{
  width:40px;
  height:34px;
}

.tourViewer{
  position:relative;
  flex:1;
  min-height:0;
}

#tourViewer{
  position:absolute;
  inset:0;
}

/* Celownik + kółko odliczania */
.tourReticle{
  position:absolute;
  inset:0;
  pointer-events:none;
  display:flex;
  align-items:center;
  justify-content:center;
  z-index:5;
}
.tourReticle .dot{
  width:6px;
  height:6px;
  border-radius:50%;
  background:rgba(255,255,255,.95);
  box-shadow:0 0 10px rgba(0,0,0,.6);
}
.tourReticle svg{
  position:absolute;
  width:72px;
  height:72px;
  filter:drop-shadow(0 0 10px rgba(0,0,0,.55));
}
.tourReticle .ringBg{
  stroke:rgba(255,255,255,.18);
  stroke-width:6;
  fill:none;
}
.tourReticle .ring{
  stroke:rgba(255,255,255,.95);
  stroke-width:6;
  fill:none;
  stroke-linecap:round;
  transform:rotate(-90deg);
  transform-origin:50% 50%;
  stroke-dasharray: 188.5;
  stroke-dashoffset: 188.5;
  opacity:0;
  transition:opacity .12s linear;
}
.tourReticle.active .ring{ opacity:1; }


/* Hotpoint wygląd */
.tourHotspot{width:22px;height:22px;border-radius:50%;background:rgba(255,255,255,.92);border:2px solid rgba(0,0,0,.35);box-shadow:0 0 14px rgba(0,0,0,.55);}


/* Przycisk GYRO */
.tourGyroBtn{
  width:auto !important;
  padding:0 10px;
  font-size:12px;
  letter-spacing:.08em;
  font-weight:700;
}
.tourGyroBtn.isOff{
  opacity:.55;
}