/* Harmonya API Keys — full-site overlay */

:root {
  --h-gold: #c4a84f;
  --h-gold-2: #a88b32;
  --h-gold-soft: #e4d08a;
  --h-green: #0a3b2d;
  --h-green-2: #1a6b4a;
  --h-bg: #000;
  --h-surface: #0c0c0c;
  --h-surface-2: #121212;
  --h-border: rgba(196, 168, 79, 0.22);
  --h-border-strong: rgba(196, 168, 79, 0.45);
  --h-muted: rgba(255, 255, 255, 0.64);
}

html,
html.dark,
.dark {
  color-scheme: dark;
  background: #000 !important;
}

html.dark body,
.dark body,
body,
body.dark {
  background: #000 !important;
  color: #fff !important;
}

html.dark body::before,
.dark body::before,
body::before {
  content: "";
  position: fixed;
  inset: 0;
  pointer-events: none;
  z-index: 0;
  background:
    radial-gradient(1200px 500px at 10% -10%, rgba(196, 168, 79, 0.14), transparent 55%),
    radial-gradient(900px 420px at 110% 0%, rgba(10, 59, 45, 0.5), transparent 50%),
    radial-gradient(rgba(196, 168, 79, 0.08) 0.6px, transparent 0.6px);
  background-size: auto, auto, 18px 18px;
}

#app {
  position: relative;
  z-index: 1;
}

/* Kill Sub2API navy / teal page washes */
.dark [class*="from-dark-950"],
.dark [class*="via-dark-900"],
.dark [class*="to-dark-950"],
.dark [class*="from-gray-50"],
[class*="bg-gradient-to-br"][class*="from-dark"],
[class*="bg-gradient-to-br"][class*="from-gray"] {
  background-image: none !important;
  background-color: transparent !important;
}

.dark .min-h-screen,
html.dark .min-h-screen {
  background-color: transparent !important;
}

.dark .bg-dark-950,
.dark .bg-dark-900,
.dark .bg-dark-800,
.dark aside,
.dark .sidebar,
.dark nav.sidebar {
  background-color: var(--h-surface) !important;
}

.dark .sidebar-header,
.dark .border-dark-800,
.dark .border-dark-700,
.dark .border-dark-600,
.dark [class*="border-dark-"],
.dark [class*="border-gray-"] {
  border-color: var(--h-border) !important;
}

/* Primary (teal) → gold */
[class*="text-primary-"] {
  color: var(--h-gold) !important;
}

[class*="bg-primary-500"],
[class*="bg-primary-600"],
[class*="bg-primary-700"] {
  background-color: var(--h-gold) !important;
  color: #000 !important;
}

[class*="bg-primary-50"],
[class*="bg-primary-100"],
[class*="bg-primary-200"],
[class*="bg-primary-800"],
[class*="bg-primary-900"],
[class*="bg-primary-950"] {
  background-color: rgba(196, 168, 79, 0.18) !important;
}

[class*="from-primary-"] {
  --tw-gradient-from: #c4a84f var(--tw-gradient-from-position) !important;
}

[class*="via-primary-"] {
  --tw-gradient-via: #a88b32 var(--tw-gradient-via-position) !important;
}

[class*="to-primary-"] {
  --tw-gradient-to: #a88b32 var(--tw-gradient-to-position) !important;
}

[class*="border-primary-"] {
  border-color: var(--h-border-strong) !important;
}

[class*="ring-primary-"] {
  --tw-ring-color: rgba(196, 168, 79, 0.45) !important;
}

[class*="shadow-primary-"] {
  --tw-shadow-color: rgba(196, 168, 79, 0.28) !important;
}

/* Rainbow marketing chips / icons → Harmonya gold */
[class*="from-blue-"],
[class*="from-purple-"],
[class*="from-orange-"],
[class*="from-green-"],
[class*="from-emerald-"],
[class*="from-rose-"],
[class*="from-pink-"],
[class*="from-indigo-"],
[class*="from-violet-"],
[class*="from-cyan-"],
[class*="from-teal-"],
[class*="from-sky-"],
[class*="from-amber-"],
[class*="from-lime-"],
[class*="from-fuchsia-"] {
  --tw-gradient-from: #c4a84f var(--tw-gradient-from-position) !important;
}

[class*="to-blue-"],
[class*="to-purple-"],
[class*="to-orange-"],
[class*="to-green-"],
[class*="to-emerald-"],
[class*="to-rose-"],
[class*="to-pink-"],
[class*="to-indigo-"],
[class*="to-violet-"],
[class*="to-cyan-"],
[class*="to-teal-"],
[class*="to-sky-"],
[class*="to-amber-"],
[class*="to-lime-"],
[class*="to-fuchsia-"] {
  --tw-gradient-to: #0a3b2d var(--tw-gradient-to-position) !important;
}

[class*="shadow-blue-"],
[class*="shadow-purple-"],
[class*="shadow-orange-"],
[class*="shadow-green-"],
[class*="shadow-pink-"],
[class*="shadow-rose-"],
[class*="shadow-indigo-"] {
  --tw-shadow-color: rgba(196, 168, 79, 0.28) !important;
}

[class*="text-blue-"]:not(input):not(textarea),
[class*="text-purple-"],
[class*="text-orange-"],
[class*="text-cyan-"],
[class*="text-teal-"],
[class*="text-indigo-"],
[class*="text-violet-"],
[class*="text-pink-"],
[class*="text-rose-"],
[class*="text-sky-"],
[class*="text-fuchsia-"],
[class*="text-emerald-"],
[class*="text-green-400"],
[class*="text-green-500"],
[class*="text-green-600"] {
  color: var(--h-gold) !important;
}

[class*="bg-blue-"],
[class*="bg-purple-"],
[class*="bg-orange-"],
[class*="bg-cyan-"],
[class*="bg-teal-"],
[class*="bg-indigo-"],
[class*="bg-violet-"],
[class*="bg-pink-"],
[class*="bg-rose-"],
[class*="bg-sky-"],
[class*="bg-fuchsia-"],
[class*="bg-emerald-"]:not(.btn-success) {
  background-color: rgba(196, 168, 79, 0.14) !important;
}

/* Hardcoded teal grid */
[class*="rgba(20,184,166"],
[class*="rgba(20, 184, 166"] {
  background-image:
    linear-gradient(rgba(196, 168, 79, 0.07) 1px, transparent 1px),
    linear-gradient(90deg, rgba(196, 168, 79, 0.07) 1px, transparent 1px) !important;
}

.btn-primary,
a.btn-primary,
button.btn-primary,
.btn.btn-primary,
.switch-active,
.progress-bar,
.navigation-progress-bar {
  background: linear-gradient(135deg, #c4a84f 0%, #a88b32 100%) !important;
  color: #000 !important;
  border: none !important;
  box-shadow: 0 8px 24px rgba(196, 168, 79, 0.22) !important;
  -webkit-text-fill-color: #000 !important;
}

.btn-primary:hover,
a.btn-primary:hover,
button.btn-primary:hover {
  background: linear-gradient(135deg, #e4d08a 0%, #c4a84f 100%) !important;
  color: #000 !important;
  -webkit-text-fill-color: #000 !important;
}

.btn-primary svg,
.btn-primary i,
a.btn-primary svg {
  color: #000 !important;
  stroke: #000 !important;
}

.sidebar-link-active,
.router-link-active {
  color: var(--h-gold) !important;
}

.badge-primary,
.stat-icon-primary {
  background: rgba(196, 168, 79, 0.16) !important;
  color: var(--h-gold) !important;
}

.text-gradient {
  background-image: linear-gradient(90deg, #c4a84f, #e4d08a) !important;
  -webkit-background-clip: text !important;
  background-clip: text !important;
  color: transparent !important;
  -webkit-text-fill-color: transparent !important;
}

.input:focus,
.btn:focus,
input:focus,
textarea:focus,
select:focus {
  --tw-ring-color: rgba(196, 168, 79, 0.4);
  border-color: var(--h-gold) !important;
  outline-color: var(--h-gold);
}

.dark .card,
.dark .glass-card,
.dark .card-glass,
.dark .modal-content,
.dark .dialog-container,
.dark .group.rounded-2xl {
  border-color: var(--h-border) !important;
  background-color: rgba(12, 12, 12, 0.88) !important;
  box-shadow: 0 18px 50px rgba(196, 168, 79, 0.06) !important;
}

.dark .group.rounded-2xl:hover {
  border-color: var(--h-border-strong) !important;
  box-shadow: 0 18px 50px rgba(196, 168, 79, 0.12) !important;
}

img[alt="Logo"],
img[alt*="Harmonya"],
img[src*="logo"] {
  background: #000;
}

::selection {
  background: rgba(196, 168, 79, 0.28);
  color: #fff;
}

/* Home terminal */
.terminal-window {
  background: linear-gradient(145deg, #121212 0%, #000 100%) !important;
  box-shadow:
    0 25px 50px -12px rgba(0, 0, 0, 0.7),
    0 0 0 1px rgba(196, 168, 79, 0.28),
    0 0 40px rgba(196, 168, 79, 0.08) !important;
}

.terminal-header {
  background: rgba(10, 59, 45, 0.55) !important;
  border-bottom: 1px solid rgba(196, 168, 79, 0.22) !important;
}

.terminal-title {
  color: rgba(196, 168, 79, 0.7) !important;
}

.code-prompt,
.code-success {
  color: var(--h-gold) !important;
}

.code-success {
  background: rgba(196, 168, 79, 0.16) !important;
}

.code-cmd {
  color: #e4d08a !important;
}

.code-flag {
  color: #a88b32 !important;
}

.code-url,
.code-response {
  color: var(--h-gold) !important;
}

.code-comment {
  color: rgba(255, 255, 255, 0.42) !important;
}

.cursor {
  background: var(--h-gold) !important;
}

/* Header login: outline, white label. Do not match the hero CTA (also href=/login). */
header a.rounded-full,
nav a.rounded-full {
  border: 1px solid var(--h-border-strong) !important;
  background: #000 !important;
  color: #fff !important;
}

/* Supported / Soon chips: gold fill + black type, never gold-on-black */
span.rounded[class*="bg-primary"],
span.rounded[class*="text-primary"],
span[class*="bg-primary-100"],
span[class*="bg-primary-900"],
span[class*="dark:bg-primary"] {
  background: #c4a84f !important;
  color: #000 !important;
  -webkit-text-fill-color: #000 !important;
}

span.rounded[class*="bg-gray"],
span.rounded[class*="bg-dark"],
span[class*="dark:bg-dark-700"] {
  background: #1a1a1a !important;
  color: #fff !important;
  -webkit-text-fill-color: #fff !important;
  border: 1px solid rgba(196, 168, 79, 0.35) !important;
}

/* Tables / dashboard chrome */
.dark table,
.dark thead,
.dark th {
  border-color: var(--h-border) !important;
}

a:not(.btn):not(.btn-primary) {
  text-underline-offset: 3px;
}

footer a:hover,
.dark a.text-primary-600,
.dark a[class*="hover:text-primary"] {
  color: var(--h-gold-soft) !important;
}

.dark .input,
.dark input.input,
.dark textarea.input,
.dark select {
  background-color: #0c0c0c !important;
  border-color: var(--h-border) !important;
  color: #fff !important;
}