/* 人才库页面样式（原 talent.html 内联 <style> 外置）
   依赖 css/main.css 的变量层，本文件须在 main.css 之后引入。 */

/* =============================================
   人才库 专属样式
   ============================================= */

/* Hero 区域（复用主站风格，改绿色调区分） */
.talent-hero {
  background: linear-gradient(155deg, var(--success-ink) 0%, var(--success-strong) 40%, var(--green) 70%, var(--success-light) 100%);
  padding: 56px 0 0;
  position: relative;
  overflow: hidden;
}
.talent-hero .hero-bg {
  background: url("data:image/svg+xml,%3Csvg width='60' height='60' viewBox='0 0 60 60' xmlns='http://www.w3.org/2000/svg'%3E%3Cg fill='none' fill-rule='evenodd'%3E%3Cg fill='%23ffffff' fill-opacity='0.04'%3E%3Cpath d='M36 34v-4h-2v4h-4v2h4v4h2v-4h4v-2h-4zm0-30V0h-2v4h-4v2h4v4h2V6h4V4h-4zM6 34v-4H4v4H0v2h4v4h2v-4h4v-2H6zM6 4V0H4v4H0v2h4v4h2V6h4V4H6z'/%3E%3C/g%3E%3C/g%3E%3C/svg%3E") repeat;
}
.talent-hero .hero-content {
  padding-bottom: 56px;
}
.talent-hero .hero-title { font-size: clamp(30px, 5vw, 52px); }
.talent-hero .hero-badge {
  background: rgba(255,255,255,0.18);
  border-color: rgba(255,255,255,0.3);
}
.talent-hero .hero-actions .btn-primary {
  background: #fff;
  color: var(--success-strong);
  border-color: #fff;
}
.talent-hero .hero-actions .btn-primary:hover {
  background: var(--success-soft);
}
.talent-hero .hero-actions .btn-outline {
  border-color: rgba(255,255,255,0.7);
  color: #fff;
}
.talent-hero .hero-actions .btn-outline:hover {
  background: rgba(255,255,255,0.15);
}
.talent-hero .hero-wave svg path { fill: var(--primary-bg); }

/* 人才库主区域 */
.talents-section {
  background: var(--primary-bg);
  padding: 40px 0 60px;
}
.talents-section .container {
  max-width: 1320px;
  padding: 0 32px;
}

/* 筛选栏（复用主站结构） */
.talent-filter-bar {
  display: flex;
  flex-direction: column;
  gap: 12px;
  margin-bottom: 28px;
  background: #fff;
  padding: 16px 20px;
  border-radius: var(--radius-lg);
  box-shadow: 0 2px 16px rgba(37,99,235,0.06);
  border: 1px solid var(--primary-border);
}

/* ---- 人才卡片（卡片视图） ---- */
.talents-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(300px, 1fr));
  gap: 20px;
}

.talent-card {
  background: #fff;
  border-radius: var(--radius);
  box-shadow: var(--shadow-sm);
  border: none;
  transition: var(--transition);
  overflow: hidden;
  cursor: pointer;
}
.talent-card:hover {
  box-shadow: 0 4px 20px rgba(16,185,129,0.15), inset 0 0 0 1.5px var(--green);
  transform: translateY(-3px);
}

.talent-card-header {
  background: linear-gradient(135deg, var(--success-ink) 0%, var(--success-strong) 100%);
  padding: 20px;
  position: relative;
  overflow: hidden;
  display: flex;
  align-items: center;
  gap: 16px;
}
.talent-card-header::after {
  content: '';
  position: absolute;
  right: -20px;
  top: -20px;
  width: 80px;
  height: 80px;
  border-radius: 50%;
  background: rgba(255,255,255,0.1);
}

.talent-avatar {
  width: 56px;
  height: 56px;
  border-radius: 50%;
  background: rgba(255,255,255,0.2);
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: var(--font-3xl);
  flex-shrink: 0;
  border: 2px solid rgba(255,255,255,0.4);
  overflow: hidden;
}
.talent-avatar img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.talent-card-name-wrap {
  flex: 1;
  min-width: 0;
  position: relative;
  z-index: 1;
}
.talent-card-name {
  font-size: var(--font-title-lg);
  font-weight: 800;
  color: #fff;
  margin-bottom: 4px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.talent-card-meta-top {
  font-size: var(--font-md);
  color: rgba(255,255,255,0.85);
  display: flex;
  align-items: center;
  gap: 8px;
  flex-wrap: wrap;
}
.talent-card-meta-top span { display: flex; align-items: center; gap: 3px; }

.talent-card-body {
  padding: 16px 20px;
}

.talent-expect-salary {
  font-size: var(--font-xl);
  font-weight: 900;
  color: var(--success-strong);
  margin-bottom: 12px;
  letter-spacing: -0.5px;
}
.talent-expect-salary span {
  font-size: var(--font-md);
  font-weight: 400;
  color: var(--text-muted);
}

.talent-expect-job {
  font-size: var(--font-base);
  font-weight: 600;
  color: var(--text-primary);
  margin-bottom: 10px;
  display: flex;
  align-items: center;
  gap: 6px;
}
.talent-expect-job::before {
  content: '';
  display: inline-block;
  width: 3px;
  height: 14px;
  background: var(--success-strong);
  border-radius: var(--radius-2xs);
  flex-shrink: 0;
}

.talent-skills {
  display: flex;
  gap: 6px;
  flex-wrap: wrap;
  margin-bottom: 12px;
}
.talent-skill-tag {
  padding: 3px 9px;
  background: var(--success-bg);
  color: var(--success-ink);
  border-radius: var(--radius-pill);
  font-size: var(--font-xs);
  font-weight: 500;
}

.talent-source-badge {
  display: inline-block;
  padding: 2px 8px;
  border-radius: var(--radius-pill);
  font-size: var(--font-xs);
  font-weight: 600;
  white-space: nowrap;
  flex-shrink: 0;
}

.talent-summary {
  font-size: var(--font-md);
  color: var(--text-secondary);
  line-height: 1.6;
  overflow: hidden;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  margin-bottom: 12px;
}

.talent-card-footer {
  padding: 12px 20px;
  background: var(--bg-light);
  border-top: 1px solid var(--border);
  display: flex;
  align-items: center;
  justify-content: space-between;
}

.talent-footer-meta {
  display: flex;
  align-items: center;
  gap: 10px;
  font-size: var(--font-sm);
  color: var(--text-muted);
}

.talent-status-badge {
  padding: 3px 10px;
  border-radius: var(--radius-pill);
  font-size: var(--font-sm);
  font-weight: 600;
}
.talent-status-badge.seeking {
  background: var(--success-bg);
  color: var(--success-ink);
}
.talent-status-badge.hired {
  background: var(--indigo-bg);
  color: var(--indigo-ink);
}
.talent-status-badge.paused {
  background: var(--bg-muted);
  color: var(--text-tertiary);
}

.talent-view-count {
  font-size: var(--font-xs);
  color: var(--text-muted);
  display: flex;
  align-items: center;
  gap: 3px;
}

/* ---- 简约列表视图 ---- */
.talents-list {
  display: flex;
  flex-direction: column;
  gap: 8px;
}

.talent-list-item {
  display: grid;
  grid-template-columns: 44px 2fr 1fr 1fr 1fr auto;
  align-items: center;
  gap: 14px;
  padding: 14px 20px;
  background: #fff;
  border-radius: var(--radius-sm);
  box-shadow: 0 1px 3px rgba(0,0,0,0.06);
  border: 1.5px solid transparent;
  cursor: pointer;
  transition: all 0.2s ease;
}
.talent-list-item:hover {
  border-color: var(--green);
  box-shadow: 0 4px 12px rgba(16,185,129,0.1);
  transform: translateX(4px);
}

.talent-list-avatar {
  width: 40px;
  height: 40px;
  border-radius: 50%;
  background: var(--success-bg);
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: var(--font-title-lg);
  flex-shrink: 0;
  overflow: hidden;
}
.talent-list-avatar img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.talent-list-main { min-width: 0; }
.talent-list-name {
  font-size: var(--font-lg);
  font-weight: 700;
  color: var(--text-primary);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.talent-list-sub {
  font-size: var(--font-sm);
  color: var(--text-muted);
  margin-top: 2px;
}

.talent-list-salary {
  font-size: var(--font-lg);
  font-weight: 800;
  color: var(--success-strong);
  white-space: nowrap;
}
.talent-list-salary span {
  font-size: var(--font-xs);
  font-weight: 400;
  color: var(--text-muted);
}

.talent-list-tags {
  display: flex;
  gap: 5px;
  flex-wrap: wrap;
}

.talent-list-exp {
  font-size: var(--font-sm);
  color: var(--text-secondary);
  white-space: nowrap;
}

.talent-list-status { flex-shrink: 0; }

/* ---- 人才详情弹窗 ---- */
.talent-detail-header {
  display: flex;
  align-items: center;
  gap: 20px;
  padding: 24px;
  background: linear-gradient(135deg, var(--success-ink) 0%, var(--success-strong) 100%);
  border-radius: var(--radius) var(--radius) 0 0;
  margin: -40px -40px 24px;
}
.talent-detail-avatar {
  width: 72px;
  height: 72px;
  border-radius: 50%;
  background: rgba(255,255,255,0.2);
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: var(--font-hero);
  flex-shrink: 0;
  border: 3px solid rgba(255,255,255,0.4);
  overflow: hidden;
}
.talent-detail-avatar img {
  width: 100%; height: 100%; object-fit: cover;
}
.talent-detail-name-wrap {}
.talent-detail-name {
  font-size: var(--font-2xl);
  font-weight: 800;
  color: #fff;
  margin-bottom: 6px;
}
.talent-detail-meta {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  font-size: var(--font-md);
  color: rgba(255,255,255,0.85);
}
.talent-detail-meta span {
  display: flex;
  align-items: center;
  gap: 4px;
}

.talent-detail-salary {
  font-size: var(--font-4xl);
  font-weight: 900;
  color: var(--success-strong);
  margin-bottom: 16px;
}

.talent-detail-section {
  margin-bottom: 20px;
}
.talent-detail-section h4 {
  font-size: var(--font-base);
  font-weight: 700;
  color: var(--text-primary);
  margin-bottom: 10px;
  padding-bottom: 8px;
  border-bottom: 1px solid var(--border);
  display: flex;
  align-items: center;
  gap: 6px;
}
.talent-detail-section h4::before {
  content: '';
  display: inline-block;
  width: 3px;
  height: 14px;
  background: var(--success-strong);
  border-radius: var(--radius-2xs);
}

.talent-work-item {
  padding: 12px 14px;
  background: var(--bg-light);
  border-radius: var(--radius-sm);
  border-left: 3px solid var(--success-strong);
  margin-bottom: 10px;
}
.talent-work-company {
  font-size: var(--font-base);
  font-weight: 700;
  color: var(--text-primary);
  margin-bottom: 4px;
}
.talent-work-info {
  font-size: var(--font-md);
  color: var(--text-secondary);
  margin-bottom: 4px;
}
.talent-work-desc {
  font-size: var(--font-md);
  color: var(--text-muted);
  line-height: 1.6;
}

.talent-phone-box {
  display: flex;
  align-items: center;
  gap: 14px;
  padding: 14px 18px;
  background: var(--success-soft);
  border: 1.5px solid var(--success-border);
  border-radius: var(--radius-sm);
  margin-top: 8px;
}
.talent-phone-num {
  font-size: var(--font-title-lg);
  font-weight: 800;
  color: var(--success-ink);
  letter-spacing: 1px;
}
.talent-phone-copy {
  padding: 6px 14px;
  background: var(--success-strong);
  color: #fff;
  border: none;
  border-radius: var(--radius-xs);
  font-size: var(--font-sm);
  font-weight: 600;
  cursor: pointer;
  transition: all 0.2s;
  font-family: var(--font);
}
.talent-phone-copy:hover { background: var(--success-deep); }

.talent-login-tip {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 14px 16px;
  background: var(--warning-bg);
  border: 1.5px solid var(--warning-border-strong);
  border-radius: var(--radius-sm);
  font-size: var(--font-md);
  color: var(--warning-deep);
  margin-top: 8px;
}

/* 骨架屏 */
.talent-skeleton-card {
  background: #fff;
  border-radius: var(--radius);
  border: 1px solid var(--border);
  overflow: hidden;
  animation: skeleton-pulse 1.5s ease-in-out infinite;
}
.talent-skeleton-header {
  height: 90px;
  background: linear-gradient(90deg, var(--border) 25%, var(--bg-muted) 50%, var(--border) 75%);
  background-size: 200% 100%;
  animation: shimmer 1.5s infinite;
}
.talent-skeleton-body {
  padding: 16px 18px;
}

/* 统计栏 */
.talent-stats-row {
  display: flex;
  align-items: center;
  gap: 24px;
  padding: 16px 20px;
  background: #fff;
  border-radius: var(--radius);
  margin-bottom: 20px;
  box-shadow: var(--shadow-sm);
  flex-wrap: wrap;
}
.talent-stat-item {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 2px;
}
.talent-stat-num {
  font-size: var(--font-3xl);
  font-weight: 900;
  color: var(--success-strong);
  line-height: 1;
}
.talent-stat-label {
  font-size: var(--font-sm);
  color: var(--text-muted);
}
.talent-stat-divider {
  width: 1px;
  height: 32px;
  background: var(--border);
}

/* 响应式 */
@media (max-width: 768px) {
  .talent-hero { padding: 40px 0 0; }
  .talent-hero .hero-content { padding-bottom: 48px; }
  .talents-grid { grid-template-columns: 1fr; gap: 14px; }
  .talent-list-item {
    grid-template-columns: 40px 1fr auto;
    grid-template-rows: auto auto;
    gap: 8px 12px;
    padding: 12px 14px;
  }
  .talent-list-avatar { grid-row: 1 / 3; }
  .talent-list-main { grid-column: 2; grid-row: 1; }
  .talent-list-salary { grid-column: 3; grid-row: 1; font-size: var(--font-base); }
  .talent-list-tags { grid-column: 2; grid-row: 2; }
  .talent-list-exp { display: none; }
  .talent-list-status { display: none; }
  .talent-detail-header { margin: -28px -20px 20px; padding: 20px; }
  .talent-detail-name { font-size: var(--font-title-lg); }
  .talent-detail-salary { font-size: var(--font-2xl); }
  .talent-stats-row { gap: 16px; }
  .talent-stat-num { font-size: var(--font-xl); }
}

@media (max-width: 480px) {
  .talent-filter-bar { padding: 12px; }
  .talent-detail-header { flex-direction: column; align-items: flex-start; gap: 12px; }
  .talent-detail-avatar { width: 56px; height: 56px; font-size: var(--font-3xl); }
}

/* ---- 分页导航 ---- */
#talentPagination { margin-top: 32px; }
.pagination-wrapper {
  display: flex;
  align-items: center;
  justify-content: space-between;
  flex-wrap: wrap;
  gap: 16px;
  background: #fff;
  padding: 16px 20px;
  border-radius: var(--radius);
  box-shadow: 0 2px 16px rgba(37,99,235,0.06);
}
.pagination-info { font-size: var(--font-base); color: var(--text-tertiary); }
.pagination-info strong { color: var(--text-strong); }
.pagination-controls { display: flex; align-items: center; gap: 4px; }
.page-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 36px;
  height: 36px;
  padding: 0 8px;
  border-radius: var(--radius-xs);
  border: 1px solid var(--border);
  background: #fff;
  font-size: var(--font-base);
  font-weight: 500;
  color: var(--text-secondary);
  cursor: pointer;
  transition: all 0.15s;
}
.page-btn:hover:not(:disabled):not(.active) { background: var(--bg-muted); border-color: var(--text-muted); }
.page-btn.active { background: var(--success-strong); color: #fff; border-color: var(--success-strong); }
.page-btn:disabled { opacity: 0.4; cursor: default; }
.page-ellipsis { display: inline-block; padding: 0 4px; color: var(--text-muted); font-size: var(--font-base); }

@media (max-width: 480px) {
  .pagination-wrapper { flex-direction: column; align-items: center; }
  .pagination-controls { flex-wrap: wrap; justify-content: center; }
}

/* ---- 内联样式收敛后的页面级类（几何与颜色统一走 main.css 变量） ---- */
.text-gradient-gold {
  background: linear-gradient(90deg, var(--accent-light), var(--accent));
  -webkit-background-clip: text; background-clip: text;
  -webkit-text-fill-color: transparent;
}
.talent-stat-num.is-blue { color: var(--primary); }
.talent-stat-num.is-page { color: var(--text-tertiary); font-size: var(--font-base); font-weight: 600; }
.talent-search { flex: 1; min-width: 200px; }
.search-btn-new.is-green { background: var(--success-strong); }
.search-btn-new.is-green:hover { background: var(--success-deep); }
.talent-modal-actions {
  flex-shrink: 0; margin-top: var(--sp-2);
  display: flex; gap: 10px; flex-wrap: wrap;
}
.talent-source-badge.is-application { background: var(--primary-soft); color: var(--primary); }
.talent-source-badge.is-referrer { background: var(--warning-bg); color: var(--warning-deep); }
.talent-source-badge.is-talent { background: var(--success-bg); color: var(--success-ink); }
.talent-meta-sep { color: rgba(255,255,255,0.4); }
.talent-card-badge { position: absolute; top: 8px; right: 12px; z-index: 2; }
.talent-expect-salary.is-empty { font-size: var(--font-base); color: var(--text-muted); }
.talent-card-date { font-size: var(--font-xs); color: var(--text-muted); }
.talent-name-age { font-weight: 400; font-size: var(--font-sm); color: var(--text-muted); }
.job-tag-sm.is-muted { background: var(--bg-muted); color: var(--text-muted); }
.talent-state { padding: var(--sp-10); text-align: center; color: var(--text-muted); }
.talent-state.is-error { color: var(--danger); }
.talent-link-warn { color: var(--warning-deep); font-weight: 700; text-decoration: underline; }
.talent-category-chip {
  display: inline-block; margin-left: var(--sp-2);
  background: var(--bg-muted); color: var(--text-tertiary);
  padding: 2px 10px; border-radius: var(--radius-pill); font-size: var(--font-sm);
}
.talent-salary-unit { font-size: var(--font-base); font-weight: 400; color: var(--text-muted); }
.talent-referrer-box {
  background: var(--warning-bg-soft); border: 1px solid var(--warning-border);
  border-radius: var(--radius-sm); padding: 10px 16px; margin-bottom: var(--sp-2);
}
.talent-referrer-row {
  display: flex; align-items: center; gap: var(--sp-4); flex-wrap: wrap;
  font-size: var(--font-md); color: var(--text-secondary);
}
.talent-referrer-key { color: var(--text-muted); }
.talent-referrer-name { color: var(--warning-deep); }
.talent-detail-text { font-size: var(--font-base); color: var(--text-secondary); }
.talent-detail-text.is-loose { line-height: 1.8; }
.talent-login-note {
  text-align: center; padding: var(--sp-2);
  color: var(--warning-deep); font-size: var(--font-md);
}