/* Client guide: tenant host uses draft colors (with tenant-chrome.js). */
body.cf-tenant-skin {
  background-color: var(--cf-tenant-bg, #0a0a0a) !important;
  color: var(--cf-tenant-text, #f5f5f5) !important;
}

body.cf-tenant-skin .lux-panel {
  border-color: color-mix(in srgb, var(--cf-accent, #d4af37) 32%, rgba(255, 255, 255, 0.12)) !important;
  background: rgba(0, 0, 0, 0.42) !important;
}

body.cf-tenant-skin .lux-kicker {
  color: color-mix(in srgb, var(--cf-accent, #d4af37) 75%, white) !important;
  letter-spacing: 0.35em;
}

body.cf-tenant-skin .lux-btn-primary {
  background-color: var(--cf-accent, #d4af37) !important;
  color: #0a0a0a !important;
  font-weight: 700;
}

body.cf-tenant-skin .lux-btn-secondary {
  border-color: color-mix(in srgb, var(--cf-accent, #d4af37) 45%, rgba(255, 255, 255, 0.2)) !important;
  color: var(--cf-tenant-text, #f5f5f5) !important;
}

body.cf-tenant-skin .lux-example {
  border-color: color-mix(in srgb, var(--cf-accent, #d4af37) 22%, rgba(255, 255, 255, 0.08)) !important;
}

body.cf-tenant-skin a.text-sky-300 {
  color: var(--cf-accent, #d4af37) !important;
}