/* Minimal custom styles alongside Tailwind utility classes. */
.message {
  border: 1px solid rgb(167 243 208);
  background: rgb(236 253 245);
  color: rgb(6 95 70);
  border-radius: 0.75rem;
  padding: 0.6rem 0.8rem;
}

dialog::backdrop {
  background: rgb(15 23 42 / 0.45);
}

/* Dark mode overrides for existing Tailwind utility-heavy templates. */
.dark {
  color-scheme: dark;
}

.dark body,
.dark.bg-slate-50,
.dark .bg-slate-50 {
  background: rgb(2 6 23) !important;
}

.dark .bg-white,
.dark .bg-white\/90 {
  background: rgb(15 23 42) !important;
}

.dark .text-slate-900 {
  color: rgb(226 232 240) !important;
}

.dark .text-slate-800,
.dark .text-slate-700,
.dark .text-slate-600,
.dark .text-slate-500 {
  color: rgb(148 163 184) !important;
}

.dark .border-slate-200,
.dark .border-slate-300 {
  border-color: rgb(51 65 85) !important;
}

.dark .hover\:bg-slate-50:hover {
  background: rgb(30 41 59) !important;
}

.dark input,
.dark textarea,
.dark select {
  background: rgb(15 23 42) !important;
  color: rgb(226 232 240) !important;
  border-color: rgb(71 85 105) !important;
}

.dark dialog > div {
  background: rgb(15 23 42) !important;
}