/* Shared marketing theme control.
   Scope: static homepage/template discovery only. Does not affect studio/editor internals. */
.theme-toggle {
  position: relative;
  min-width: 92px;
  isolation: isolate;
}

.theme-toggle [data-theme-icon] {
  width: 1.1em;
  display: inline-grid;
  place-items: center;
  font-weight: 950;
}

.theme-toggle [data-theme-label] {
  white-space: nowrap;
}

.theme-toggle::after {
  content: "";
  position: absolute;
  inset: 4px;
  z-index: -1;
  border-radius: inherit;
  background: linear-gradient(135deg, rgba(110, 91, 255, 0.14), rgba(0, 194, 255, 0.08));
  opacity: 0;
  transition: opacity 160ms ease;
}

.theme-toggle:hover::after,
.theme-toggle:focus-visible::after {
  opacity: 1;
}

html[data-theme-choice="auto"] .theme-toggle {
  border-style: dashed;
}

html[data-theme-choice="light"] .theme-toggle,
html[data-theme-choice="dark"] .theme-toggle {
  border-style: solid;
}

@media (max-width: 520px) {
  .theme-toggle {
    min-width: 44px;
    padding-inline: 12px;
  }
  .theme-toggle [data-theme-label] {
    position: absolute;
    inline-size: 1px;
    block-size: 1px;
    overflow: hidden;
    clip: rect(0 0 0 0);
    white-space: nowrap;
  }
}