/* =============================================================
   智链导航 v3.0.0 · 申请收录即时化（滑块 / 当场抓取回填 / 友链预检 / 截图）
   ============================================================= */
.sl-verify { margin: 14px 0; }

/* 滑块容器 */
.sl-slider-box { position: relative; user-select: none; touch-action: none; }
.sl-slider-track {
  position: relative; height: 44px; border-radius: var(--sl-radius-s);
  background: #eef2f7; border: 1px solid #d6dee9; overflow: hidden;
  touch-action: none;
}
.sl-slider-fill {
  position: absolute; left: 0; top: 0; bottom: 0; width: 0;
  background: rgba(37, 99, 235, .14); pointer-events: none;
}
.sl-slider-text {
  position: absolute; inset: 0; display: flex; align-items: center; justify-content: center;
  font-size: var(--sl-fs-xs); color: #64748b; pointer-events: none; letter-spacing: .5px;
}
.sl-slider-handle {
  position: absolute; top: 0; left: 0; width: 44px; height: 100%;
  display: flex; align-items: center; justify-content: center;
  background: #2563eb; color: #fff; cursor: grab; touch-action: none; z-index: 2;
  border-radius: var(--sl-radius-s); box-shadow: var(--sl-shadow-s);
}
.sl-slider-handle:active { cursor: grabbing; }
.sl-slider-handle.sl-dragging { background: #1d4ed8; }
.sl-slider-grip { font-size: 18px; font-weight: 700; line-height: 1; letter-spacing: -2px; }

/* 到位通过：轨道与滑块变绿，高对比 */
.sl-slider-track.sl-done { background: #e8f6ef; border-color: #128a5a; }
.sl-slider-track.sl-done .sl-slider-fill { background: rgba(18, 138, 90, .22); }
.sl-slider-track.sl-done .sl-slider-handle { background: #128a5a; }
.sl-slider-track.sl-done .sl-slider-text { color: #128a5a; font-weight: 600; }

/* 暗色模式：轨道/滑块/文字均保持高对比 */
html[data-theme="dark"] .sl-slider-track { background: #1b2433; border-color: #2c3a52; }
html[data-theme="dark"] .sl-slider-fill { background: rgba(59, 130, 246, .28); }
html[data-theme="dark"] .sl-slider-text { color: #9fb0c8; }
html[data-theme="dark"] .sl-slider-handle { background: #3b82f6; }
html[data-theme="dark"] .sl-slider-handle.sl-dragging { background: #2563eb; }
html[data-theme="dark"] .sl-slider-track.sl-done { background: #102a1e; border-color: #1f9d63; }
html[data-theme="dark"] .sl-slider-track.sl-done .sl-slider-fill { background: rgba(31, 157, 99, .30); }
html[data-theme="dark"] .sl-slider-track.sl-done .sl-slider-handle { background: #1f9d63; }
html[data-theme="dark"] .sl-slider-track.sl-done .sl-slider-text { color: #4ade80; }

.sl-slider-tip { font-size: var(--sl-fs-xs); color: var(--sl-muted); margin-top: 6px; }

/* 抓取按钮 */
.sl-fetch-btn { width: 100%; margin-top: 10px; }
.sl-fetch-btn[disabled] { opacity: .55; cursor: not-allowed; }

/* 回填结果状态条（可达性 / HTTPS / ICP） */
.sl-probe {
  display: flex; flex-wrap: wrap; gap: var(--sl-space-2);
  margin: 12px 0;
}
.sl-probe-chip {
  font-size: var(--sl-fs-xs); padding: 3px 10px; border-radius: var(--sl-radius-pill);
  background: var(--sl-info-soft); color: var(--sl-muted);
}
.sl-probe-chip.ok { background: var(--sl-success-soft); color: var(--sl-success); }
.sl-probe-chip.bad { background: var(--sl-danger-soft); color: var(--sl-danger); }

/* 友链检测结果 */
.sl-lb {
  margin: 12px 0; padding: 12px 14px; border-radius: var(--sl-radius-s);
  font-size: var(--sl-fs-sm); line-height: 1.7; display: none;
}
.sl-lb.show { display: block; }
.sl-lb.ok { background: var(--sl-success-soft); color: var(--sl-success); }
.sl-lb.bad { background: var(--sl-danger-soft); color: var(--sl-danger); }
.sl-lb .sl-lb-row { display: flex; align-items: center; justify-content: space-between; gap: 8px; }
.sl-lb button {
  flex: none; font-size: var(--sl-fs-xs); padding: 4px 12px; cursor: pointer;
  border: 1px solid currentColor; background: transparent; border-radius: var(--sl-radius-s); color: inherit;
}

/* 截图预览 */
.sl-shot { margin: 12px 0; }
.sl-shot-preview {
  width: 100%; max-width: 320px; border-radius: var(--sl-radius-s); border: 1px solid var(--sl-border);
  display: block;
}
.sl-shot-row { display: flex; gap: 8px; margin-top: 8px; flex-wrap: wrap; }

/* 收录须知块 */
.sl-notice {
  background: var(--sl-info-soft); border: 1px solid var(--sl-border);
  border-radius: var(--sl-radius-s); padding: 12px 14px; margin-bottom: 16px;
  font-size: var(--sl-fs-sm); color: var(--sl-muted); line-height: 1.8;
}
.sl-notice b { color: var(--sl-text); }

.sl-loading { display: inline-block; width: 14px; height: 14px; border: 2px solid rgba(0,0,0,.2); border-top-color: currentColor; border-radius: 50%; animation: sl-spin .7s linear infinite; vertical-align: middle; }
@keyframes sl-spin { to { transform: rotate(360deg); } }