/* Shared accessibility theme for mutantwork.com */
html[data-theme="light"] {
  --bg: #ffffff;
  --surface: #ffffff;
  --border: #d8ddea;
  --text: #182033;
  --white: #121827;
  --dark: #ffffff;
  --dark2: #ffffff;
  --muted: #536176;
  --green: #111827;
  --scan-green: #297a00;
}

html[data-theme="light"] [style*="#AAFF00"],
html[data-theme="light"] [style*="color:#AAFF00"] {
  color: #111827 !important;
  border-color: rgba(17, 24, 39, .28) !important;
}

html[data-theme="light"] h1,
html[data-theme="light"] .stat-val,
html[data-theme="light"] .btn-export,
html[data-theme="light"] .btn-copy {
  color: #111827;
}

html[data-theme="light"] body {
  background: var(--bg, #ffffff);
  color: var(--text, #182033);
}

html[data-theme="light"] nav {
  background: rgba(247, 248, 252, 0.90);
  border-bottom-color: rgba(255, 31, 120, 0.22);
}

html[data-theme="light"] .btn-ghost,
html[data-theme="light"] .btn-clear {
  color: var(--text, #182033);
  border-color: var(--border, #d8ddea);
}

html[data-theme="light"] textarea,
html[data-theme="light"] input,
html[data-theme="light"] select {
  background: #ffffff;
  color: var(--text, #182033);
}

html[data-theme="light"] .chrome-mockup {
  background: #edf0f7;
  border-color: #d8ddea;
}

html[data-theme="light"] .chrome-bar {
  border-bottom-color: #d8ddea;
}

html[data-theme="light"] .prompt-bubble {
  color: var(--text, #182033);
}

header { position: relative; }

#theme-toggle {
  position: absolute;
  top: .25rem;
  right: 0;
  z-index: 9999;
  display: flex;
  width: max-content;
  margin: 0;
  align-items: center;
  gap: .45rem;
  padding: .72rem .95rem;
  border: 1px solid rgba(255, 31, 120, .42);
  border-radius: 999px;
  background: #11111f;
  color: #f5f5ff;
  font-family: Arial, sans-serif;
  font-size: .8rem;
  font-weight: 700;
  letter-spacing: .02em;
  cursor: pointer;
  box-shadow: 0 8px 24px rgba(7, 7, 15, .25);
}

html[data-theme="light"] #theme-toggle {
  background: #ffffff;
  color: #182033;
  border-color: #cbd3e3;
}

#theme-toggle:hover,
#theme-toggle:focus-visible {
  outline: none;
  border-color: #ff1f78;
  box-shadow: 0 0 0 3px rgba(255, 31, 120, .18), 0 8px 24px rgba(7, 7, 15, .25);
}

@media (max-width: 600px) {
  #theme-toggle {
    margin: 0 1rem 1rem auto;
    width: 2.8rem;
    height: 2.8rem;
    justify-content: center;
    padding: 0;
  }
  #theme-toggle span { display: none; }
}
