/* Assethea theme overrides for embedded SuperSplat Viewer (MIT).
 * Brand accent: #00f2ff — keep SuperSplat logo orange (#ff6600). */

:root {
  --assethea-accent: #00f2ff;
  --assethea-accent-soft: rgba(0, 242, 255, 0.35);
  --assethea-accent-muted: rgba(0, 242, 255, 0.7);
  --assethea-grip: #66e8ff;
}

#viewerBranding {
  cursor: default !important;
  pointer-events: none;
}

.controlButton.active:not(.toggle) {
  color: var(--assethea-accent) !important;
}

.controlButton.toggle {
  background-image: linear-gradient(
    90deg,
    transparent 0%,
    transparent 50%,
    var(--assethea-accent) 50%,
    var(--assethea-accent) 100%
  ) !important;
}

#controlsWrap > #timelineContainer > #handle {
  background-color: var(--assethea-grip) !important;
}

#settingsPanel > .settingsRow > div.toggleSwitch.active .toggleTrack {
  background-color: var(--assethea-accent-soft) !important;
}

#settingsPanel > .settingsRow > div.toggleSwitch.active .toggleThumb {
  background-color: var(--assethea-accent) !important;
}

#infoPanel > #infoPanelContent > #infoPanels h1 {
  color: var(--assethea-accent) !important;
}

#infoPanel > #infoPanelContent > #tabs > .tab.active {
  border-bottom-color: var(--assethea-accent) !important;
}

#xrModal > #xrModalContent > #xrModalButtons > button#xrModalOk {
  background-color: var(--assethea-accent-muted) !important;
  border-color: var(--assethea-accent) !important;
}

#xrModal > #xrModalContent > #xrModalButtons > button#xrModalOk:hover {
  background-color: var(--assethea-accent) !important;
}

/* SuperSplat logo stays orange */
#viewerBranding svg .fill,
#infoPanel #viewerTitle svg .fill {
  fill: #ff6600 !important;
}