/* Loading Screen Color Fixes - Force White Colors */

/* Target the specific loading animation progress bar */
div[style*="background-color: white"],
div[style*="background-color:#00ff88"],
div[style*="background-color: #00ff88"],
div[style*="background-color:rgb(0,255,136)"],
div[style*="background-color: rgb(0,255,136)"] {
  background-color: white !important;
}

/* Force white color for progress bar fills */
.loading-animation .progress-bar-fill,
.loading-container .progress-bar-fill,
[class*="ProgressBarFill"] {
  background-color: white !important;
  background: white !important;
}

/* Force white color for progress text */
.loading-animation .progress-text,
.loading-container .progress-text,
[class*="ProgressText"] {
  color: white !important;
}

/* Force white color for loading text */
.loading-animation .loading-text,
.loading-container .loading-text,
[class*="LoadingText"] {
  color: white !important;
}

/* Target any green/cyan progress bars specifically */
div[style*="background: linear-gradient"][style*="00ff88"],
div[style*="background-color"][style*="00ff88"],
div[style*="background"][style*="cyan"],
div[style*="background"][style*="green"] {
  background: white !important;
  background-color: white !important;
}

/* Force white for any triangle elements in loading */
[class*="Triangle"] {
  border-bottom-color: white !important;
}

/* Override any styled-components with green/cyan */
div[class*="sc-"][style*="00ff88"],
div[class*="sc-"][style*="cyan"],
div[class*="sc-"][style*="green"] {
  background-color: white !important;
  color: white !important;
}

/* Specific targeting for the progress bar container */
div[style*="width: 300px"][style*="height: 4px"] + div {
  background-color: white !important;
}

/* Target progress percentage text */
div[style*="font-family: 'Chakra Petch'"][style*="0.9rem"] {
  color: white !important;
}

/* Target main loading text */
div[style*="font-family: 'Chakra Petch'"][style*="1.2rem"] {
  color: white !important;
}