body { background: #1a1a2e; color: #e0e0e0; font-family: 'Courier New', monospace; margin: 0; padding: 20px; }
h1 { color: #0f3460; background: #16213e; padding: 15px; border-radius: 8px; border-left: 4px solid #e94560; margin-bottom: 5px; }
.subtitle { color: #888; font-size: 0.85em; margin: 0 0 15px 5px; }
.status-card { background: #16213e; padding: 20px; border-radius: 8px; margin: 15px 0; }
.status-card h2 { color: #e94560; margin-top: 0; }
.stat { display: inline-block; margin: 10px 20px; text-align: center; }
.stat-value { font-size: 2em; font-weight: bold; color: #0f3460; background: #1a1a2e; padding: 10px 20px; border-radius: 8px; }
.stat-label { color: #888; font-size: 0.9em; }
.running { color: #4caf50; }
.paused { color: #ff9800; }
.stopped { color: #f44336; }
.log-box { background: #0d1117; color: #c9d1d9; padding: 15px; border-radius: 8px; max-height: 400px; overflow-y: auto; font-size: 0.85em; white-space: pre-wrap; border: 1px solid #30363d; }
.refresh-note { color: #666; font-size: 0.8em; text-align: center; margin: 10px; }
.progress-bar { background: #1a1a2e; border-radius: 4px; height: 30px; margin: 10px 0; overflow: hidden; border: 1px solid #30363d; }
.progress-fill { background: linear-gradient(90deg, #e94560, #0f3460); height: 100%; transition: width 0.5s; display: flex; align-items: center; justify-content: center; color: white; font-weight: bold; min-width: 30px; }
.progress-fill.file { background: linear-gradient(90deg, #4caf50, #2e7d32); }
.current-file { background: #0d1117; padding: 12px; border-radius: 6px; margin: 10px 0; font-size: 0.95em; border-left: 3px solid #e94560; word-break: break-all; }
.current-file .label { color: #e94560; font-weight: bold; }
.completed-list { background: #0d1117; padding: 15px; border-radius: 8px; max-height: 300px; overflow-y: auto; font-size: 0.85em; border: 1px solid #30363d; }
.completed-item { padding: 4px 0; border-bottom: 1px solid #1a1a2e; color: #4caf50; }
.completed-item .type-icon { color: #888; margin-right: 4px; }
.grid { display: grid; grid-template-columns: 1fr 1fr; gap: 15px; }
@media (max-width: 768px) { .grid { grid-template-columns: 1fr; } }
#content { display: none; }
.logout-btn { float: right; background: #e94560; color: white; border: none; padding: 5px 15px; border-radius: 6px; cursor: pointer; font-family: inherit; font-size: 0.85em; }
.logout-btn:hover { background: #c73650; }

/* Botones de control */
#btn-pause, #btn-resume, #btn-stop {
  background: #ff9800; color: white; border: none; padding: 8px 20px;
  border-radius: 6px; cursor: pointer; font-family: inherit; margin-right: 8px; font-size: 0.95em;
}
#btn-resume { background: #4caf50; }
#btn-stop { background: #f44336; }
#btn-pause:disabled, #btn-resume:disabled, #btn-stop:disabled { opacity: 0.3; cursor: not-allowed; }

/* Banner pause-wait */
#pause-wait-banner {
  margin-top: 10px; padding: 10px 15px; background: #1a1a2e;
  border: 1px solid #ff9800; border-radius: 6px; color: #ff9800; font-size: 0.9em;
}

#control-msg { margin-left: 10px; color: #888; font-size: 0.85em; }
