/* Basic styles for web loading */
body {
  margin: 0;
  padding: 0;
  font-family: 'Poppins', sans-serif;
  background-color: #ffffff;
}

.preloader {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-color: #ffffff;
  display: flex;
  justify-content: center;
  align-items: center;
  z-index: 9999;
}

.preloader-container {
  text-align: center;
}


.green-loader {
  border: 4px solid #f3f3f3;
  border-top: 4px solid #4CAF50;
  border-radius: 50%;
  width: 40px;
  height: 40px;
  animation: spin 1s linear infinite;
  margin: 0 auto 14px;
}

.preloader-text {
  color: #4CAF50;
  font-weight: 600;
  font-size: 16px;
  margin-bottom: 6px;
}

.preloader-subtext {
  color: #6b7280;
  font-size: 14px;
  margin-top: 6px;
}

@keyframes spin {
  0% { transform: rotate(0deg); }
  100% { transform: rotate(360deg); }
}

/* Hide Flutter's default loading elements */
flutter-loader,
.flutter-loader,
#flutter-loader,
flutter-view::before,
flt-loader,
.flt-loader,
#loading,
.loading {
  display: none !important;
  visibility: hidden !important;
}

/* Hide Flutter loading progress bar */
flutter-view .progress-bar,
flutter-view .loading-progress,
#flutter_bootstrap_main_element .progress-bar,
.flutter-loading .progress-bar,
flt-scene-host .progress-bar,
canvas + div,
canvas + .progress-bar {
  display: none !important;
}

/* Hide any loading indicators that might appear before Flutter */
body > div[style*="background"] {
  display: none !important;
}

/* Ensure our preloader stays on top */
.preloader {
  z-index: 99999 !important;
}

.header {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  height: 60px;
  background-color: #ffffff;
  box-shadow: 0 2px 4px rgba(0,0,0,0.1);
  z-index: 1000;
  padding: 0 20px;
}

.header-container {
  max-width: 1200px;
  margin: 0 auto;
  height: 100%;
  display: flex;
  align-items: center;
  justify-content: space-between;
}

.header-start {
  display: flex;
  align-items: center;
  gap: 20px;
}

.header-end {
  display: flex;
  align-items: center;
  gap: 20px;
}

.logo {
  height: 40px;
  width: auto;
}

.placeholder {
  background-color: #f0f0f0;
  border-radius: 4px;
  height: 20px;
  width: 80px;
  animation: pulse 1.5s ease-in-out infinite;
}

.placeholder-wide {
  width: 120px;
}

@keyframes pulse {
  0% { opacity: 1; }
  50% { opacity: 0.5; }
  100% { opacity: 1; }
}

.d-flex { display: flex; }
.align-items-center { align-items: center; }
.justify-content-between { justify-content: space-between; }
.gap-5 { gap: 20px; }

/* Dark theme support */
.theme-dark {
  background-color: #1a1a1a;
  color: #ffffff;
}

.theme-dark .preloader {
  background-color: #1a1a1a;
}


.theme-dark .green-loader {
  border: 4px solid #3a3a3a;
  border-top: 4px solid #4CAF50;
}

.theme-dark .header {
  background-color: #2d2d2d;
}

.theme-dark .placeholder {
  background-color: #3a3a3a;
}

.theme-dark .preloader-text {
  color: #4CAF50;
}

.theme-dark .preloader-subtext {
  color: #9ca3af;
}