style.css

/* =====================================================
   RAINBOW BACKGROUND STYLE
   ===================================================== */

body { background: red !important; }

/* Animated rainbow gradient background */
gradio-app,
.gradio-app,
.main,
#app,
[data-testid="app"] {
  background: linear-gradient(
    -45deg,
    #ff0000,
    #ff7f00,
    #ffff00,
    #00ff00,
    #0000ff,
    #4b0082,
    #8f00ff
  );
  background-size: 400% 400%;
  animation: rainbowShift 15s ease infinite;
  min-height: 100vh !important;
}

/* Smooth animated gradient */
@keyframes rainbowShift {
  0% { background-position: 0% 50%; }
  50% { background-position: 100% 50%; }
  100% { background-position: 0% 50%; }
}

/* Fallback body */
html, body {
  margin: 0 !important;
  padding: 0 !important;
  min-height: 100vh !important;
  background: transparent !important;
}

/* Keep main container readable */
.gradio-container {
  max-width: 1400px !important;
  width: 94vw !important;
  margin: 0 auto !important;
  padding-top: 120px !important;
  padding-bottom: 120px !important;
  background: rgba(255, 255, 255, 0.92) !important;
  border-radius: 16px !important;
}

/* Improve text contrast */
h1, h2, h3, h4, h5, h6 {
  color: #111 !important;
  font-weight: 700 !important;
}

p, label {
  color: #333 !important;
}

/* Buttons styling */
button.primary {
  background-color: #111 !important;
  color: #fff !important;
  border-radius: 12px !important;
}

button.primary:hover {
  background-color: #333 !important;
}

button.secondary {
  background-color: #fff !important;
  color: #111 !important;
  border: 2px solid #111 !important;
  border-radius: 12px !important;
}

/* ===== Pipeline Controls (left steps + right Run All) ===== */

/* Stack the three step buttons vertically with consistent spacing */
#steps_col {
  display: flex;
  flex-direction: column;
  gap: 14px;
}

/* Make the Run All button stand out in orange */
#run_all_btn button {
  background: #ff7a00 !important;
  color: #ffffff !important;
  border: 2px solid #ff7a00 !important;
  border-radius: 12px !important;
  font-weight: 700 !important;
  padding-top: 14px !important;
  padding-bottom: 14px !important;
  font-size: 1.05rem !important;
}

#run_all_btn button:hover {
  filter: brightness(0.95);
}