/* Skylens Viewer — Panorama Workspace (scripts/panorama/panorama-workspace.js).
 *
 * Owns only the workspace surface. Photo lightbox styling for STILLS stays in
 * styles/viewer.css (.photo-lightbox) — the two surfaces are separate on
 * purpose: a still is a flat image, a confirmed panorama is a sphere.
 */

/* The workspace sits INSIDE the viewer chrome, never over it: the top bar and
   the bottom menu stay reachable while a panorama is open. The offsets are
   measured from #cesiumContainer at open/resize time (panorama-workspace.js
   _syncGeometry) rather than hardcoded, so the surface tracks the real layout
   if the chrome ever changes. The fallbacks match today's shell —
   index.html:299 sizes the container as calc(100vh - 50px - 60px). */
.panorama-workspace {
  position: fixed;
  top: var(--pano-top, 50px);
  bottom: var(--pano-bottom, 60px);
  left: var(--pano-left, 0px);
  right: var(--pano-right, 0px);
  z-index: 1200;
  display: grid;
  grid-template-rows: 48px 1fr;
  background: rgba(8, 15, 28, 0.97);
  color: #e2e8f0;
  font-size: 12px;
}

/* Fullscreen is the one case where covering everything is the point. */
.panorama-workspace:fullscreen {
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
}

.panorama-workspace.hidden { display: none; }

.panorama-workspace__toolbar {
  display: flex;
  align-items: center;
  gap: 16px;
  justify-content: space-between;
  padding: 0 14px;
  border-bottom: 1px solid rgba(255, 255, 255, 0.14);
  min-width: 0;
}

.panorama-workspace__identity {
  display: flex;
  align-items: baseline;
  gap: 10px;
  min-width: 0;
  overflow: hidden;
}

.panorama-workspace__identity strong {
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

/* Placement / orientation / measurement state is never hidden — an
   approximate panorama must read as approximate. */
.panorama-workspace__status {
  color: #94a3b8;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.panorama-workspace__nav,
.panorama-workspace__actions {
  display: flex;
  align-items: center;
  gap: 6px;
  flex: none;
}

.panorama-workspace__nav.hidden { display: none; }

.panorama-workspace__toolbar button {
  background: rgba(255, 255, 255, 0.08);
  border: 1px solid rgba(255, 255, 255, 0.16);
  border-radius: 6px;
  color: #e2e8f0;
  cursor: pointer;
  font-size: 12px;
  line-height: 1;
  padding: 6px 10px;
}

.panorama-workspace__toolbar button:hover {
  background: rgba(255, 255, 255, 0.16);
}

.panorama-workspace__toolbar button[aria-pressed="true"] {
  background: rgba(56, 189, 248, 0.28);
  border-color: rgba(56, 189, 248, 0.55);
}

/* Gated, not removed: the button stays visible and explains itself on click. */
.panorama-workspace__toolbar button.is-unavailable {
  opacity: 0.45;
  cursor: not-allowed;
}

/* Approximate coupling ("Follow view") is amber, never the calibrated blue —
   the control must not look like a surveyed alignment when the heading was
   typed by hand. Matches the amber sight line the bridge draws on the globe. */
.panorama-workspace__toolbar button.is-approximate {
  border-color: rgba(251, 146, 60, 0.55);
  color: #fdba74;
}
.panorama-workspace__toolbar button.is-approximate[aria-pressed="true"] {
  background: rgba(251, 146, 60, 0.28);
  border-color: rgba(251, 146, 60, 0.7);
  color: #fed7aa;
}

.panorama-workspace__viewer {
  min-height: 0;
  width: 100%;
  height: 100%;
}

/* Split screen: the workspace takes the right half of the VIEWER AREA, Cesium
   keeps the left. The horizontal split is expressed through the same measured
   custom properties, so it stays inside the chrome like the full-width state.
   panorama-workspace.js calls viewer.resize() after toggling this class. */
body.panorama-split-mode #cesiumContainer {
  width: 50% !important;
}

.skylens-panorama-hotspot { cursor: pointer; }