/* ── SEO Score Badge ── */
.score-badge {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 2.6rem;
  height: 2.6rem;
  border-radius: 50%;
  font-family: var(--font-mono);
  font-size: 0.75rem;
  font-weight: 700;
  flex-shrink: 0;
  border: 2px solid currentColor;
}
.score-badge.score-good    { color: var(--success, #15803d); background: color-mix(in srgb, var(--success, #15803d) 12%, transparent); }
.score-badge.score-ok      { color: var(--warning, #b45309); background: color-mix(in srgb, var(--warning, #b45309) 12%, transparent); }
.score-badge.score-poor    { color: var(--error,   #b91c1c); background: color-mix(in srgb, var(--error,   #b91c1c) 12%, transparent); }

/* ── Fixed-layout table so all 8 columns fit ── */
.seo-data-table {
  table-layout: fixed;
  width: 100%;
}
.seo-data-table td {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.seo-data-table td:nth-child(3) {
  white-space: normal;
  overflow: visible;
}

/* ── Issue chips in table ── */
.issue-chips {
  display: flex;
  flex-wrap: wrap;
  gap: 0.25rem;
}
.issue-chip {
  font-family: var(--font-mono);
  font-size: 0.58rem;
  letter-spacing: 0.03em;
  padding: 0.15rem 0.4rem;
  border-radius: 3px;
  white-space: nowrap;
}
.issue-chip.chip-error   { background: color-mix(in srgb, var(--error,   #b91c1c) 12%, transparent); color: var(--error,   #b91c1c); }
.issue-chip.chip-warning { background: color-mix(in srgb, var(--warning, #b45309) 12%, transparent); color: var(--warning, #b45309); }
.issue-chip.chip-info    { background: color-mix(in srgb, var(--accent,  #4f46e5) 10%, transparent); color: var(--text-3); }

/* ── SEO table cell helpers ── */
.seo-check-ok   { color: var(--success, #15803d); font-size: 0.85rem; }
.seo-check-miss { color: var(--text-3); font-size: 0.85rem; }
.seo-check-warn { color: var(--warning, #b45309); font-size: 0.85rem; }

/* ── Score cell layout ── */
.td-score {
  display: flex;
  align-items: center;
  gap: 0.5rem;
}

/* ── Score summary bar ── */
.seo-score-bar {
  display: flex;
  align-items: center;
  gap: 0.75rem;
  margin-top: 0.5rem;
}
.seo-score-bar-track {
  flex: 1;
  height: 6px;
  border-radius: 3px;
  background: var(--border);
  overflow: hidden;
}
.seo-score-bar-fill {
  height: 100%;
  border-radius: 3px;
  transition: width 0.4s ease;
}

/* ── Design overrides ── */
[data-design="dossier"] .score-badge { border-radius: 0; }
[data-design="console"] .score-badge {
  border-radius: 0;
  border-width: 1px;
  font-size: 0.7rem;
}
[data-design="console"] .issue-chip { border-radius: 0; }