/* ============================================================
   style.css — 万能工具箱 自定义样式
   ============================================================ */

/* ---------- 页面切换动画 ---------- */
.page-section {
  animation: fadeSlideIn 0.3s ease-out;
}

@keyframes fadeSlideIn {
  from { opacity: 0; transform: translateY(12px); }
  to   { opacity: 1; transform: translateY(0); }
}

/* ---------- 导航当前页高亮 ---------- */
.nav-link.active {
  color: #2563eb;
  border-bottom: 2px solid #2563eb;
  padding-bottom: 2px;
}

.tool-card { text-decoration: none; color: inherit; }
.ad-placeholder { font-family: system-ui, -apple-system, sans-serif; }

/* ---------- input[type=number] spinner ---------- */
input[type="number"]::-webkit-inner-spin-button,
input[type="number"]::-webkit-outer-spin-button { opacity: 1; }

/* ---------- 结果卡片 ---------- */
.result-card p[id$="-value"] { font-variant-numeric: tabular-nums; }

/* ---------- 输入错误状态 ---------- */
.input-error {
  border-color: #EF4444 !important;
  box-shadow: 0 0 0 3px rgba(239, 68, 68, 0.15);
}

/* ---------- 模式切换 Tab ---------- */
.mode-tab {
  color: #6B7280;
  background: transparent;
  border: none;
  cursor: pointer;
  white-space: nowrap;
}
.mode-tab.active {
  color: #1D4ED8;
  background: #FFFFFF;
  box-shadow: 0 1px 3px rgba(0,0,0,0.12);
}
.mode-tab:hover:not(.active) { color: #374151; }

/* ---------- 复制按钮 ---------- */
.btn-copy.copied {
  background: #D1FAE5 !important;
  border-color: #6EE7B7 !important;
  color: #059669 !important;
}

/* ---------- 折叠区按钮 ---------- */
#schedule-toggle-btn, #early-toggle-btn {
  background: none; border: none; outline: none;
  cursor: pointer; padding: 0;
}
#schedule-toggle-btn:hover span, #early-toggle-btn:hover span { color: #2563EB; }

/* ---------- 响应式微调 ---------- */
@media (max-width: 640px) {
  .result-card p[id$="-value"] { font-size: 1.25rem; }
  .mode-tab { padding: 0.5rem 0.75rem; font-size: 0.75rem; }
}