:root {
  color-scheme: dark;
}

.theme-light {
  color-scheme: light;
}

.theme-light .text-white {
  color: #0f172a !important;
}

.theme-light .text-slate-500 {
  color: #64748b !important;
}

.theme-light .text-slate-400 {
  color: #475569 !important;
}

.theme-light .border-white\/10,
.theme-light .border-white\/5 {
  border-color: rgba(148, 163, 184, 0.35) !important;
}

.theme-light .bg-slate-900\/50,
.theme-light .bg-slate-900\/40,
.theme-light .bg-slate-900\/30,
.theme-light .bg-slate-900\/80,
.theme-light .bg-slate-950 {
  background-color: rgba(255, 255, 255, 0.88) !important;
}

.theme-light input,
.theme-light select,
.theme-light textarea {
  background-color: #ffffff !important;
  color: #0f172a !important;
  border-color: rgba(148, 163, 184, 0.45) !important;
}

@keyframes fade-in {
  from {
    opacity: 0;
    transform: translateY(6px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

.animate-fade-in {
  animation: fade-in 0.35s ease-out both;
}

.ot-nav-btn.active {
  background: rgba(34, 211, 238, 0.15);
  color: rgb(34, 211, 238);
}

.ot-scroll {
  scrollbar-width: thin;
  scrollbar-color: rgba(148, 163, 184, 0.4) transparent;
}