/* ===== 自定义工具类，与 Tailwind 互补 ===== */

.form-label {
  display: block;
  font-size: 0.75rem;
  font-weight: 500;
  color: rgb(71 85 105);
  margin-bottom: 0.375rem;
}

.form-input {
  width: 100%;
  border-radius: 0.5rem;
  border: 1px solid rgb(231 229 228);
  background-color: rgb(250 250 249 / 0.6);
  padding: 0.625rem 0.875rem;
  font-size: 0.875rem;
  color: rgb(15 23 42);
  outline: none;
  transition: all 0.15s;
}
.form-input:hover {
  border-color: rgb(214 211 209);
}
.form-input:focus {
  background-color: white;
  border-color: rgb(251 113 133);
  box-shadow: 0 0 0 3px rgb(255 228 230 / 0.6);
}
.form-input:disabled {
  opacity: 0.45;
  cursor: not-allowed;
}
.form-input-sm {
  padding: 0.375rem 0.625rem;
  font-size: 0.8125rem;
}
textarea.form-input { resize: vertical; }

.btn-primary {
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
  padding: 0.625rem 1.25rem;
  border-radius: 0.625rem;
  background-image: linear-gradient(to right, #ff5a5f, #fb7185);
  color: white;
  font-size: 0.875rem;
  font-weight: 500;
  box-shadow: 0 8px 24px -8px rgba(255, 90, 95, 0.5);
  transition: all 0.15s;
}
.btn-primary:hover { filter: brightness(1.05); transform: translateY(-1px); }
.btn-primary:active { filter: brightness(0.95); transform: translateY(0); }
.btn-primary:disabled { opacity: 0.6; cursor: not-allowed; transform: none; }

/* ===== Tab ===== */
.tab-btn {
  color: rgb(100 116 139);
  font-weight: 500;
  position: relative;
}
.tab-btn:hover { color: rgb(15 23 42); }
.tab-btn.is-active { color: rgb(225 29 72); }
.tab-btn.is-active::after {
  content: "";
  position: absolute;
  left: 1rem;
  right: 1rem;
  bottom: -1px;
  height: 2px;
  background: linear-gradient(to right, #ff5a5f, #fb7185);
  border-radius: 2px;
}

/* ===== 进度阶段 ===== */
.stage-item.is-active .stage-dot {
  background-color: rgb(255 90 95);
  color: white;
  box-shadow: 0 6px 16px -6px rgba(255, 90, 95, 0.55);
}
.stage-item.is-active .stage-label {
  color: rgb(15 23 42);
  font-weight: 500;
}
.stage-item.is-done .stage-dot {
  background-color: rgb(16 185 129);
  color: white;
}
.stage-item.is-done .stage-label {
  color: rgb(5 150 105);
}

/* 日志区滚动条 */
#progress-log::-webkit-scrollbar { width: 6px; }
#progress-log::-webkit-scrollbar-thumb {
  background: rgb(71 85 105);
  border-radius: 3px;
}

/* 复选框样式微调 */
input[type="checkbox"]:checked {
  background-color: rgb(255 90 95);
  border-color: rgb(255 90 95);
}
