:root {
  color-scheme: light;
}

html[data-theme="dark"] {
  color-scheme: dark;
  background: #070b13;
  --color-gray-50: #101827;
  --color-gray-100: #253246;
  --color-gray-200: #314158;
  --color-gray-300: #3c4f6a;
  --color-slate-50: #101827;
  --color-slate-100: #253246;
  --color-slate-200: #314158;
  --color-blue-50: #142033;
  --color-blue-100: #253b63;
  --color-blue-200: #345681;
}

html[data-theme="dark"] body {
  background:
    radial-gradient(900px 520px at 50% -20%, rgba(37, 99, 235, 0.14), transparent 60%),
    #070b13 !important;
  color: #e5edf8 !important;
}

html[data-theme="dark"] #taildo-main-content,
html[data-theme="dark"] .taildo-page-shell,
html[data-theme="dark"] .taildo-layout-row,
html[data-theme="dark"] .taildo-layout-content {
  background: transparent !important;
}

html[data-theme="dark"] :where(.bg-white, .bg-white\/95, .bg-white\/90, .bg-white\/80, .bg-white\/70, .bg-gray-50, .bg-gray-100, .bg-gray-200, .bg-slate-50, .bg-slate-100, .bg-slate-200) {
  background-color: #101827 !important;
}

html[data-theme="dark"] :where(.bg-blue-50, .bg-blue-100, .bg-sky-50, .bg-sky-100, .bg-emerald-50, .bg-emerald-100, .bg-rose-50, .bg-rose-100, .bg-amber-50, .bg-amber-100, .bg-orange-50, .bg-orange-100, .bg-violet-50, .bg-violet-100) {
  background-color: #142033 !important;
}

html[data-theme="dark"] :where(.bg-blue-50\/50, .bg-blue-50\/60, .bg-blue-50\/70, .bg-sky-50\/50, .bg-sky-50\/60, .bg-emerald-50\/50, .bg-emerald-50\/60, .bg-emerald-50\/70, .bg-orange-50\/50, .bg-orange-50\/60, .bg-amber-50\/60, .bg-violet-50\/60, .bg-rose-50\/70, .bg-slate-50\/40, .bg-slate-50\/50, .bg-slate-50\/70, .bg-slate-50\/80, .bg-gray-50\/40) {
  background-color: rgba(16, 24, 39, 0.82) !important;
}

html[data-theme="dark"] [class*="bg-"][class*="linear-gradient"],
html[data-theme="dark"] [class*="bg-\[linear-gradient"] {
  background: linear-gradient(135deg, #111827 0%, #0f172a 52%, #0b1120 100%) !important;
}

html[data-theme="dark"] :where(.border-white, .border-white\/70, .border-white\/80, .border-gray-50, .border-gray-100, .border-gray-200, .border-gray-300, .border-slate-100, .border-slate-200, .border-slate-300, .border-blue-100, .border-blue-200, .border-blue-300, .border-sky-100, .border-sky-200, .border-sky-300, .border-emerald-100, .border-emerald-200, .border-emerald-300, .border-rose-100, .border-rose-200, .border-rose-300, .border-amber-100, .border-amber-200, .border-amber-300, .border-orange-100, .border-orange-200, .border-orange-300, .border-violet-100, .border-violet-200, .border-violet-300) {
  border-color: #253246 !important;
}

html[data-theme="dark"] :where(.text-gray-900, .text-slate-950, .text-slate-900, .text-gray-800, .text-slate-800, .text-gray-700, .text-slate-700) {
  color: #e5edf8 !important;
}

html[data-theme="dark"] :where(.text-gray-600, .text-slate-600, .text-gray-500, .text-slate-500, .text-gray-400, .text-slate-400) {
  color: #a8b4c7 !important;
}

html[data-theme="dark"] :where(.text-blue-600, .text-blue-700, .text-sky-600, .text-sky-700) {
  color: #6aa8ff !important;
}

html[data-theme="dark"] :where(.text-emerald-600, .text-emerald-700) {
  color: #5ee0a8 !important;
}

html[data-theme="dark"] :where(.text-orange-600, .text-orange-700, .text-amber-600, .text-amber-700) {
  color: #f6b76b !important;
}

html[data-theme="dark"] :where(.text-violet-600, .text-violet-700) {
  color: #c4a7ff !important;
}

html[data-theme="dark"] :where(.text-rose-600, .text-rose-700, .text-red-600, .text-red-700) {
  color: #ff9aad !important;
}

html[data-theme="dark"] :where(input, textarea, select) {
  background-color: #0f172a !important;
  border-color: #314158 !important;
  color: #e5edf8 !important;
}

html[data-theme="dark"] :where(input, textarea, select)::placeholder {
  color: #7f8ea3 !important;
}

html[data-theme="dark"] :where(.shadow-sm, .shadow-md, .shadow-lg, .shadow-xl, .shadow-2xl) {
  box-shadow: 0 14px 36px rgba(0, 0, 0, 0.34) !important;
}

html[data-theme="dark"] [data-taildo-header-root] {
  background: rgba(9, 14, 24, 0.94) !important;
  border-color: #253246 !important;
}

html[data-theme="dark"] :where(.taildo-left-sidebar, .taildo-right-sidebar [data-right-sidebar-expanded-card], .taildo-right-sidebar [data-right-sidebar-collapsed-card]) {
  background: rgba(15, 23, 42, 0.96) !important;
  border-color: #334155 !important;
  box-shadow: 0 18px 48px rgba(0, 0, 0, 0.36) !important;
}

html[data-theme="dark"] .taildo-right-sidebar :where([class*="bg-gradient-to"], [class*="from-slate-50"], [class*="via-white"], [class*="to-blue-50"]) {
  background: linear-gradient(145deg, #121c2d 0%, #101827 56%, #0c1422 100%) !important;
}

html[data-theme="dark"] :where(article, section, aside, [data-post-id], [data-comment-card]) {
  border-color: #253246;
}

html[data-theme="dark"] :where(.reaction-btn, button[class*="bg-gray-50"], button[class*="bg-white"], a[class*="bg-white"], a[class*="bg-slate-50"]) {
  background-color: #111c2d !important;
  border-color: #314158 !important;
  color: #cbd6e6 !important;
}

html[data-theme="dark"] .reaction-btn,
html[data-theme="dark"] .reaction-btn.border,
html[data-theme="dark"] .reaction-btn.border-gray-100,
html[data-theme="dark"] .reaction-btn.border-gray-200,
html[data-theme="dark"] button.border,
html[data-theme="dark"] a.border {
  border-color: #314158 !important;
}

html[data-theme="dark"] :where(.reaction-btn:hover, button[class*="hover:bg-gray-50"]:hover, button[class*="hover:bg-gray-100"]:hover, a[class*="hover:bg-gray-50"]:hover, a[class*="hover:bg-gray-100"]:hover) {
  background-color: #172337 !important;
  border-color: #3c4f6a !important;
}

html[data-theme="dark"] :where(mark) {
  background-color: rgba(251, 191, 36, 0.24) !important;
  color: #fde68a !important;
}

html[data-theme="dark"] :where(img) {
  color-scheme: light;
}

@layer components {
  html[data-theme="dark"] .taildo-layout-row :where(.border-gray-100, .border-slate-100, .border-gray-200, .border-slate-200, .border-blue-100, .border-blue-200, .border-emerald-100, .border-emerald-200, .border-orange-100, .border-orange-200, .border-violet-100, .border-violet-200, .border-rose-100, .border-rose-200, .border-amber-100, .border-amber-200) {
    border-color: #253246 !important;
  }
}

.taildo-theme-toggle {
  position: relative;
  overflow: hidden;
}

.taildo-theme-toggle svg {
  transition: opacity 160ms ease, transform 180ms ease;
}

.taildo-theme-toggle [data-theme-icon="moon"] {
  opacity: 0;
  transform: rotate(-45deg) scale(0.72);
  position: absolute;
}

html[data-theme="dark"] .taildo-theme-toggle [data-theme-icon="sun"] {
  opacity: 0;
  transform: rotate(45deg) scale(0.72);
}

html[data-theme="dark"] .taildo-theme-toggle [data-theme-icon="moon"] {
  opacity: 1;
  transform: rotate(0) scale(1);
}