.dark {
  color-scheme: dark;
}

.dark body.bg-white {
  background-color: #0f172a;
}

.dark .bg-white {
  background-color: #1e293b;
}

.dark .bg-gray-50 {
  background-color: #24324a;
}

.dark .bg-gray-100 {
  background-color: #334155;
}

.dark .bg-gray-200 {
  background-color: #475569;
}

.dark .bg-gray-800 {
  background-color: #0f172a;
}

.dark .bg-slate-50 {
  background-color: #1e293b;
}

.dark .text-gray-900 {
  color: var(--color-gray-100);
}

.dark .text-gray-800 {
  color: var(--color-gray-200);
}

.dark .text-gray-700 {
  color: var(--color-gray-300);
}

.dark .text-gray-600 {
  color: var(--color-gray-400);
}

.dark .text-gray-500 {
  color: var(--color-gray-500);
}

.dark .text-blue-950 {
  color: var(--color-blue-200);
}

.dark .text-blue-700 {
  color: #93c5fd;
}

.dark .text-blue-600 {
  color: #60a5fa;
}

.dark .visited\:text-purple-600:visited {
  color: #c4b5fd;
}

.dark .hover\:text-purple-600:hover {
  color: #ddd6fe;
}

.dark .text-slate-700 {
  color: var(--color-slate-200);
}

.dark .border-gray-200 {
  border-color: #334155;
}

.dark .border-gray-300 {
  border-color: #334155;
}

.dark .border-gray-400 {
  border-color: #334155;
}

.dark .border-slate-300 {
  border-color: #334155;
}

.dark .hover\:bg-gray-50:hover {
  background-color: #334155;
}

.dark .hover\:bg-gray-100:hover {
  background-color: #475569;
}

.dark .hover\:bg-slate-50:hover {
  background-color: #334155;
}

.dark .hover\:text-gray-900:hover {
  color: var(--color-gray-100);
}

.dark .hover\:text-gray-700:hover {
  color: var(--color-gray-200);
}

.dark .hover\:border-gray-300:hover {
  border-color: #475569;
}

.dark .hover\:text-blue-700:hover {
  color: #bfdbfe;
}

.dark .site-header {
  background-color: #0b1220;
  border-bottom-color: #334155;
  box-shadow: 0 8px 20px -16px rgba(15, 23, 42, 0.9);
}

.dark .user-menu-button {
  background-color: #111827;
  border-color: #334155;
  color: #e2e8f0;
}

.dark .user-menu-button:hover {
  background-color: #1f2a44;
  color: #f8fafc;
}

.dark .user-menu-panel {
  background-color: #1e293b;
  border-color: #334155;
}

.dark .user-menu-item {
  color: #e2e8f0;
}

.dark .user-menu-item:hover {
  background-color: #24324a;
  color: #f8fafc;
}

.dark .user-menu-divider {
  border-color: #334155;
}

.dark .user-menu-logout {
  color: #fca5a5;
}

.dark .user-menu-logout:hover {
  color: #fecaca;
}

.dark .app-title {
  color: #f8fafc;
}

.dark a.bg-blue-600,
.dark button.bg-blue-600,
.dark a.bg-blue-500,
.dark button.bg-blue-500 {
  box-shadow:
    0 0 0 1px rgba(59, 130, 246, 0.35),
    0 10px 18px -12px rgba(59, 130, 246, 0.9);
}

.dark a.bg-blue-600:hover,
.dark button.bg-blue-600:hover,
.dark a.bg-blue-500:hover,
.dark button.bg-blue-500:hover {
  box-shadow:
    0 0 0 1px rgba(96, 165, 250, 0.45),
    0 12px 20px -12px rgba(59, 130, 246, 0.95);
}

.plan-summary-card {
  position: relative;
  overflow: hidden;
}

.plan-summary-content {
  position: relative;
  z-index: 1;
}

.plan-summary-icon {
  display: none;
  position: absolute;
  right: 1.25rem;
  bottom: 1rem;
  font-size: 2.25rem;
  opacity: 0.08;
  pointer-events: none;
}

.dark .plan-summary-card {
  border-left-width: 4px;
  border-left-color: #3b82f6;
}

.dark .plan-summary-icon {
  display: block;
  color: #3b82f6;
  opacity: 0.12;
}

.alternatives-toggle {
  border: 1px solid #e2e8f0;
}

.dark .alternatives-toggle {
  background-color: #24324a;
  border-color: #3b82f6;
  color: #bfdbfe;
  box-shadow: 0 0 0 1px rgba(59, 130, 246, 0.2);
}

.dark .alternatives-toggle:hover {
  background-color: #2b3b58;
  color: #dbeafe;
}

.dark .alternatives-popover {
  background-color: #1f2a44;
  border-color: #334155;
  color: #e2e8f0;
}

.dark .alternatives-title {
  color: #e2e8f0;
}

.dark .alternatives-empty {
  color: #94a3b8;
}

.mass-current-card {
  outline: 3px solid rgba(59, 130, 246, 0.35);
  outline-offset: 0;
}

.mass-current-link {
  box-shadow: inset 3px 0 0 #2563eb;
  background-color: #dbeafe;
  color: #1d4ed8;
}

.dark .mass-current-card {
  outline-color: rgba(147, 197, 253, 0.45);
}

.dark .mass-current-link {
  box-shadow: inset 3px 0 0 #93c5fd;
  background-color: #1e3a8a;
  color: #dbeafe;
}