:root {
  --onstream-primary: #DCFC35;
  --onstream-primary-hover: #C8EA2E;
  --onstream-primary-dark: #A8C51E;
  --onstream-bg: #0a0a0a;
}

html { color-scheme: dark; }
body { background: var(--onstream-bg); }
::selection { background: var(--onstream-primary); color: #050505; }

/* Map the original utility classes to the OnStream lime identity. */
.text-red-500, .text-red-600 { color: var(--onstream-primary) !important; }
.hover\:text-red-500:hover { color: var(--onstream-primary) !important; }
.bg-red-500, .bg-red-600 { background-color: var(--onstream-primary) !important; }
.bg-red-500\/10, .bg-red-600\/10 { background-color: rgba(220, 252, 53, .10) !important; }
.bg-red-600\/5 { background-color: rgba(220, 252, 53, .05) !important; }
.hover\:bg-red-600\/20:hover { background-color: rgba(220, 252, 53, .20) !important; }
.hover\:bg-red-700:hover { background-color: var(--onstream-primary-hover) !important; }
.border-red-500, .border-red-600 { border-color: var(--onstream-primary) !important; }
.border-red-500\/20 { border-color: rgba(220, 252, 53, .20) !important; }
.border-red-500\/30 { border-color: rgba(220, 252, 53, .30) !important; }
.focus\:border-red-500:focus { border-color: var(--onstream-primary) !important; }
.focus\:ring-red-500:focus, .focus\:ring-red-600\/50:focus { --tw-ring-color: rgba(220, 252, 53, .50) !important; }
.fill-red-600\/20 { fill: rgba(220, 252, 53, .20) !important; }

.shadow-red-600\/20 { --tw-shadow-color: rgba(220, 252, 53, .20) !important; --tw-shadow: var(--tw-shadow-colored) !important; }
.shadow-red-600\/30 { --tw-shadow-color: rgba(220, 252, 53, .30) !important; --tw-shadow: var(--tw-shadow-colored) !important; }
.shadow-red-900\/5 { --tw-shadow-color: rgba(168, 197, 30, .05) !important; --tw-shadow: var(--tw-shadow-colored) !important; }

.from-red-500, .from-red-600 {
  --tw-gradient-from: #DCFC35 var(--tw-gradient-from-position) !important;
  --tw-gradient-to: rgba(220, 252, 53, 0) var(--tw-gradient-to-position) !important;
  --tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to) !important;
}
.from-red-600\/10 {
  --tw-gradient-from: rgba(220, 252, 53, .10) var(--tw-gradient-from-position) !important;
  --tw-gradient-to: rgba(220, 252, 53, 0) var(--tw-gradient-to-position) !important;
  --tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to) !important;
}
.via-red-600 {
  --tw-gradient-to: rgba(220, 252, 53, 0) var(--tw-gradient-to-position) !important;
  --tw-gradient-stops: var(--tw-gradient-from), #DCFC35 var(--tw-gradient-via-position), var(--tw-gradient-to) !important;
}
.via-red-600\/50 {
  --tw-gradient-to: rgba(220, 252, 53, 0) var(--tw-gradient-to-position) !important;
  --tw-gradient-stops: var(--tw-gradient-from), rgba(220, 252, 53, .50) var(--tw-gradient-via-position), var(--tw-gradient-to) !important;
}
.to-red-600 { --tw-gradient-to: #DCFC35 var(--tw-gradient-to-position) !important; }
.to-red-600\/20 { --tw-gradient-to: rgba(220, 252, 53, .20) var(--tw-gradient-to-position) !important; }
.to-red-900 { --tw-gradient-to: var(--onstream-primary-dark) var(--tw-gradient-to-position) !important; }
.hover\:to-red-600:hover { --tw-gradient-to: #DCFC35 var(--tw-gradient-to-position) !important; }

/* Lime buttons and badges need dark text for contrast. */
.bg-red-500.text-white, .bg-red-600.text-white,
button.bg-red-500, button.bg-red-600,
a.bg-red-500, a.bg-red-600 { color: #050505 !important; }

img[src="/images/logo.png"] { object-fit: contain; }
