/* Anti-Flash CSS - Prevents white flash during page navigation */

/* Set default background color on html element to prevent white flash */
html {
  background-color: #000000; /* Black background for dark mode */
  transition: background-color 0.2s ease;
}

/* Optional: Light mode support if you add theme switching */
html.light-mode {
  background-color: #ffffff;
}

/* Ensure body inherits the background */
body {
  background-color: inherit;
  min-height: 100vh;
}

/* Prevent flash of unstyled content */
html.loading {
  visibility: hidden;
  opacity: 0;
}

html.loaded {
  visibility: visible;
  opacity: 1;
  transition: opacity 0.2s ease-in;
}

/* Alpine.js - Hide elements with x-cloak until Alpine is ready */
[x-cloak] {
  display: none !important;
}