html {
  position: relative;
  min-height: 100%;
  color-scheme: light;
  background-color: #fff;
  color: #111827;
}

html[data-theme="dark"] {
  color-scheme: dark;
  background-color: #111827;
  color: #e5e7eb;
}

body {
  margin-bottom: 60px;
  background-color: inherit;
  color: inherit;
}

p {
    padding-top: 15px;
}
.theme-toggle { cursor: pointer; }
.theme-toggle:focus-visible { outline: 2px solid #60a5fa; outline-offset: 3px; }
.theme-toggle:hover { background-color: #f3f4f6; }
html[data-theme="dark"] .theme-label-light,
html:not([data-theme="dark"]) .theme-label-dark { display: none; }
html[data-theme="dark"] dialog { color: inherit; }
html[data-theme="dark"] .bg-white,
html[data-theme="dark"] .bg-gray-50 { background-color: #1f2937; }
html[data-theme="dark"] .from-gray-50 { --tw-gradient-from: #1f2937; }
html[data-theme="dark"] .to-white { --tw-gradient-to: #1f2937; }
html[data-theme="dark"] .bg-gray-100 { background-color: #283548; }
html[data-theme="dark"] .bg-gray-200,
html[data-theme="dark"] .hover\:bg-gray-50:hover,
html[data-theme="dark"] .hover\:bg-gray-100:hover,
html[data-theme="dark"] .theme-toggle:hover { background-color: #374151; }
html[data-theme="dark"] .text-gray-900,
html[data-theme="dark"] .text-gray-800,
html[data-theme="dark"] .hover\:text-gray-900:hover { color: #f9fafb; }
html[data-theme="dark"] .text-gray-700,
html[data-theme="dark"] .hover\:text-gray-700:hover,
html[data-theme="dark"] .hover\:text-gray-600:hover { color: #e5e7eb; }
html[data-theme="dark"] .text-gray-600 { color: #d1d5db; }
html[data-theme="dark"] .text-gray-500,
html[data-theme="dark"] .text-gray-400,
html[data-theme="dark"] input::placeholder,
html[data-theme="dark"] textarea::placeholder { color: #9ca3af; }
html[data-theme="dark"] header,
html[data-theme="dark"] footer,
html[data-theme="dark"] .border-gray-100,
html[data-theme="dark"] .border-gray-200,
html[data-theme="dark"] .divide-gray-100 > :not(:last-child) { border-color: #374151; }
html[data-theme="dark"] .border-gray-300:not(:focus) { border-color: #6b7280; }
html[data-theme="dark"] .hover\:border-gray-400:hover:not(:focus) { border-color: #9ca3af; }
html[data-theme="dark"] .ring-gray-100,
html[data-theme="dark"] .ring-gray-200 { --tw-ring-color: #374151; }
html[data-theme="dark"] .bg-blue-50,
html[data-theme="dark"] .bg-blue-100,
html[data-theme="dark"] .hover\:bg-blue-50:hover { background-color: #172554; }
html[data-theme="dark"] .text-blue-600,
html[data-theme="dark"] .text-blue-700,
html[data-theme="dark"] .text-blue-800 { color: #93c5fd; }
html[data-theme="dark"] .border-blue-100,
html[data-theme="dark"] .border-blue-200 { border-color: #1e40af; }
html[data-theme="dark"] .bg-red-50,
html[data-theme="dark"] .bg-red-100,
html[data-theme="dark"] .hover\:bg-red-50:hover { background-color: #450a0a; }
html[data-theme="dark"] .text-red-500,
html[data-theme="dark"] .text-red-600,
html[data-theme="dark"] .text-red-700,
html[data-theme="dark"] .text-red-800 { color: #fca5a5; }
html[data-theme="dark"] .border-red-200 { border-color: #991b1b; }
html[data-theme="dark"] .bg-green-100 { background-color: #052e16; }
html[data-theme="dark"] .bg-green-50 { background-color: #052e16; }
html[data-theme="dark"] .text-green-700 { color: #86efac; }
html[data-theme="dark"] .bg-yellow-100 { background-color: #422006; }
html[data-theme="dark"] .text-yellow-700 { color: #fde047; }
html[data-theme="dark"] .bg-orange-100 { background-color: #431407; }
html[data-theme="dark"] .text-orange-700 { color: #fdba74; }