html.dark {
  background: #0b1220;
  color: #e5e7eb;
}

html.dark body {
  background: #0b1220;
  color: #e5e7eb;
}

html.dark .bg-hopper-bg {
  background-color: #0b1220 !important;
}
html.dark .bg-gray-50\/80,
html.dark .card-hopper,
html.dark .bg-white {
  background-color: #0f172a !important;
  border-color: #7b2cbf !important;
}

html.dark .border,
html.dark .border-gray-50,
html.dark .border-gray-100,
html.dark .border-gray-200,
html.dark .border-gray-300,
html.dark .border-gray-400,
html.dark .border-white,
html.dark .border-white\/10,
html.dark .border-white\/20,
html.dark .border-white\/30,
html.dark .bg-gray-50\/80 {
  border-color: #1f2937 !important;
}

html.dark .text-hopper-text,
html.dark .text-black,
html.dark .text-gray-900,
html.dark .text-gray-800,
html.dark .text-gray-700,
html.dark .text-gray-600,
html.dark .text-gray-500 {
  color: #e5e7eb !important;
}

html.dark .text-hopper-muted,
html.dark .text-gray-400,
html.dark .text-gray-300 {
  color: #9ca3af !important;
}

html.dark .section-title,
html.dark .section-title span,
html.dark .section-title h2,
html.dark .section-title h3,
html.dark h1,
html.dark h2,
html.dark h3 {
  color: #e5e7eb !important;
}

html.dark .sidebar-link {
  color: #9ca3af !important;
}

html.dark .sidebar-link.active {
  color: #e5e7eb !important;
}

html.dark .table-mobile-pad {
  background-color: #0f172a !important;
}

html.dark .bg-gray-50,
html.dark .bg-gray-50\/50,
html.dark .bg-gray-50\/70,
html.dark .bg-gray-100,
html.dark .bg-gray-100\/80 {
  background-color: #111827 !important;
}

html.dark [class*="border-hopper-purple"] {
  border-color: rgba(123, 44, 191, 0.35) !important;
}

html.dark [class*="border-hopper-green"] {
  border-color: rgba(0, 184, 148, 0.35) !important;
}

html.dark [class*="hover:bg-gray-50"]:hover,
html.dark [class*="hover:bg-gray-100"]:hover {
  background-color: rgba(17, 24, 39, 0.85) !important;
}

html.dark [class*="hover:bg-hopper-purple/5"]:hover {
  background-color: rgba(123, 44, 191, 0.12) !important;
}

html.dark [class*="bg-gradient"] {
  background-image: none !important;
  background-color: #0f172a !important;
}

html.dark .bg-red-50 {
  background-color: rgba(220, 38, 38, 0.12) !important;
}

html.dark .bg-green-50 {
  background-color: rgba(16, 185, 129, 0.12) !important;
}

html.dark .bg-orange-50 {
  background-color: rgba(249, 115, 22, 0.12) !important;
}

html.dark .border-red-100,
html.dark .border-red-200,
html.dark .border-green-200,
html.dark .border-orange-200 {
  border-color: rgba(148, 163, 184, 0.18) !important;
}

html.dark .input-hopper,
html.dark input,
html.dark select,
html.dark textarea {
  background-color: #0b1220 !important;
  color: #e5e7eb !important;
  border-color: #1f2937 !important;
}

html.dark input::placeholder,
html.dark textarea::placeholder {
  color: #6b7280 !important;
}

html.dark nav.bg-white,
html.dark .bg-white\/95 {
  background-color: rgba(15, 23, 42, 0.92) !important;
}

html.dark table,
html.dark thead,
html.dark tbody,
html.dark tr,
html.dark td,
html.dark th {
  border-color: #1f2937 !important;
}

html.dark .shadow-sm,
html.dark .shadow-md,
html.dark .shadow-xl,
html.dark .shadow-2xl {
  box-shadow: 0 10px 30px rgba(0,0,0,0.35) !important;
}

html.dark .btn-hopper-outline {
  border-color: #374151 !important;
  color: #e5e7eb !important;
}

html.dark .btn-hopper-outline:hover {
  background-color: rgba(123, 44, 191, 0.12) !important;
  border-color: rgba(123, 44, 191, 0.35) !important;
}