/* Sandbox-only styling. Only loaded/activated on sandbox.topotrace.org --
   see sandbox-overlay.js's hostname guard. */

#tt-sandbox-watermark {
  position: fixed;
  bottom: 12px;
  right: 12px;
  z-index: 99999;
  background: rgba(15, 23, 42, 0.92);
  color: #e2e8f0;
  font: 13px/1.4 -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  padding: 8px 14px;
  border-radius: 8px;
  box-shadow: 0 2px 10px rgba(0,0,0,0.25);
  pointer-events: none;
  user-select: none;
}
#tt-sandbox-watermark b {
  color: #fbbf24;
  font-variant-numeric: tabular-nums;
}

.tt-sandbox-callout {
  display: flex;
  gap: 10px;
  align-items: flex-start;
  background: #fff7ed;
  border: 1px solid #fdba74;
  border-left: 4px solid #ea580c;
  border-radius: 6px;
  padding: 10px 14px;
  margin: 10px 0 16px;
  font: 13px/1.5 -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  color: #7c2d12;
}
.tt-sandbox-callout .tt-icon {
  font-weight: 700;
  color: #ea580c;
}
.tt-sandbox-callout b { color: #9a3412; }

/* Feedback widget */
#tt-feedback-btn {
  position: fixed;
  bottom: 56px;
  right: 12px;
  z-index: 99999;
  background: #1d4ed8;
  color: #fff;
  border: none;
  border-radius: 999px;
  padding: 9px 18px;
  font: 600 13px -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  cursor: pointer;
  box-shadow: 0 2px 10px rgba(0,0,0,0.25);
}
#tt-feedback-btn:hover { background: #1e40af; }

#tt-feedback-panel {
  position: fixed;
  bottom: 100px;
  right: 12px;
  z-index: 99999;
  width: 280px;
  background: #fff;
  border: 1px solid #cbd5e1;
  border-radius: 10px;
  box-shadow: 0 8px 24px rgba(0,0,0,0.2);
  padding: 14px;
  font: 13px/1.4 -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  color: #1e293b;
}
.tt-fb-header { font-weight: 700; margin-bottom: 10px; }
.tt-fb-ratings {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 6px;
  margin-bottom: 10px;
}
.tt-fb-rating {
  border: 1px solid #cbd5e1;
  background: #f8fafc;
  border-radius: 6px;
  padding: 6px 0;
  cursor: pointer;
  font: 12px -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
}
.tt-fb-rating.tt-fb-selected {
  background: #1d4ed8;
  color: #fff;
  border-color: #1d4ed8;
}
.tt-fb-comment {
  width: 100%;
  box-sizing: border-box;
  min-height: 56px;
  resize: vertical;
  border: 1px solid #cbd5e1;
  border-radius: 6px;
  padding: 6px 8px;
  font: 12px -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  margin-bottom: 10px;
}
.tt-fb-actions { display: flex; justify-content: flex-end; gap: 8px; }
.tt-fb-cancel, .tt-fb-submit {
  border-radius: 6px;
  padding: 6px 12px;
  font: 12px -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  cursor: pointer;
}
.tt-fb-cancel { background: #f1f5f9; border: 1px solid #cbd5e1; }
.tt-fb-submit { background: #1d4ed8; color: #fff; border: none; }
.tt-fb-submit:disabled { background: #93c5fd; cursor: not-allowed; }
.tt-fb-thanks { text-align: center; padding: 12px 0; font-weight: 600; color: #15803d; }

/* Report Builder sample-report callout buttons */
.tt-sandbox-report-actions button,
.tt-sandbox-report-actions a {
  border-radius: 6px;
  padding: 6px 12px;
  font: 600 12px -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  cursor: pointer;
  text-decoration: none;
  display: inline-block;
}
#tt-report-preview, #tt-report-pdf {
  background: #ea580c;
  color: #fff;
  border: none;
}
#tt-report-preview:hover, #tt-report-pdf:hover { background: #c2410c; }
#tt-report-install {
  background: #fff;
  color: #9a3412;
  border: 1px solid #fdba74;
}

/* Guided demo sidebar entry -- matches the other view-tabs links */
#tt-guided-demo-link { color: inherit; }

/* Exit-sandbox / About-this-demo links replacing the account control */
.auth-control a.ghost { display: inline-flex; align-items: center; }

/* Guided tour panel */
#tt-tour-panel {
  position: fixed;
  top: 16px;
  left: 50%;
  transform: translateX(-50%);
  z-index: 100000;
  width: min(420px, calc(100vw - 32px));
  background: #0f172a;
  color: #e2e8f0;
  border-radius: 10px;
  box-shadow: 0 8px 30px rgba(0,0,0,0.35);
  padding: 16px 18px;
  font: 13px/1.5 -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
}
.tt-tour-progress {
  font: 700 11px -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  color: #93c5fd;
  margin-bottom: 4px;
}
#tt-tour-panel h2 { margin: 0 0 8px; font-size: 16px; color: #fff; }
#tt-tour-panel h2:focus { outline: 2px solid #93c5fd; outline-offset: 2px; }
.tt-visually-hidden {
  position: absolute !important;
  width: 1px; height: 1px;
  padding: 0; margin: -1px;
  overflow: hidden;
  clip: rect(0,0,0,0);
  white-space: nowrap;
  border: 0;
}
#tt-tour-panel p { margin: 0 0 12px; color: #cbd5e1; }
.tt-tour-actions { display: flex; align-items: center; gap: 8px; }
.tt-tour-actions button {
  border-radius: 6px;
  padding: 6px 14px;
  font: 600 12px -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  cursor: pointer;
  border: 1px solid #334155;
  background: #1e293b;
  color: #e2e8f0;
}
.tt-tour-actions button:hover:not(:disabled) { background: #334155; }
.tt-tour-actions button:disabled { opacity: 0.4; cursor: not-allowed; }
#tt-tour-next { background: #1d4ed8; border-color: #1d4ed8; color: #fff; }
#tt-tour-next:hover { background: #1e40af; }
.tt-tour-exit { background: transparent !important; border: none !important; color: #94a3b8 !important; text-decoration: underline; padding: 6px 4px !important; }

.work-group-cluster > summary { cursor: pointer; font-weight: 600; margin: 10px 0 6px; }

/* Guided tour: spotlight ring on the step's target element -- the box-shadow
   trick doubles as the dim backdrop (a huge spread radius covers the rest of
   the page) so no separate overlay element is needed. */
.tt-tour-spotlight {
  position: relative !important;
  /* Below #tt-tour-panel's z-index (100000) -- this only needs to sit
     above normal page content for its dim-backdrop box-shadow trick to
     work, never above the tour dialog itself. It was previously 100001,
     one higher than the panel, which put spotlighted content (e.g. the
     Work queue's finding cards) on top of the dialog instead of behind
     it -- the tour text rendered as a sliver peeking out from under the
     cards it was supposed to be dimming. */
  z-index: 99000 !important;
  border-radius: 8px;
  box-shadow: 0 0 0 4px #fff, 0 0 0 7px #1d4ed8, 0 0 0 9999px rgba(15, 23, 42, 0.6) !important;
  transition: box-shadow 0.2s ease;
}

/* Simulated live telemetry badge -- sandbox only, values are hardcoded to
   demonstrate the concept, not measured from a real scan. */
#tt-telemetry-badge {
  position: fixed;
  top: 12px;
  right: 12px;
  z-index: 99999;
  display: flex;
  align-items: center;
  gap: 8px;
  flex-wrap: wrap;
  background: rgba(15, 23, 42, 0.92);
  color: #e2e8f0;
  font: 12px/1.4 -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  padding: 8px 12px;
  border-radius: 8px;
  box-shadow: 0 2px 10px rgba(0,0,0,0.25);
  max-width: 360px;
}
#tt-telemetry-badge .tt-telemetry-dot {
  width: 8px; height: 8px; border-radius: 50%;
  background: #34d399;
  box-shadow: 0 0 0 0 rgba(52, 211, 153, 0.6);
  animation: tt-telemetry-pulse 2s infinite;
  flex-shrink: 0;
}
@keyframes tt-telemetry-pulse {
  0% { box-shadow: 0 0 0 0 rgba(52, 211, 153, 0.55); }
  70% { box-shadow: 0 0 0 6px rgba(52, 211, 153, 0); }
  100% { box-shadow: 0 0 0 0 rgba(52, 211, 153, 0); }
}
#tt-telemetry-badge b { color: #fbbf24; font-variant-numeric: tabular-nums; }
@media (max-width: 620px) {
  #tt-telemetry-badge { display: none; }
}

/* Design-partner CTA link now lives inline in the #tt-sandbox-watermark bar. */
