/* ============================================================
   CyberStackHub – Data Integrity UI Components — Light Theme
   AI labels, freshness badges, source citations
   ============================================================ */

/* ---- Freshness Badges ------------------------------------ */
.freshness-badge {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  padding: 2px 8px;
  border-radius: 12px;
  font-size: 11px;
  font-weight: 600;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  vertical-align: middle;
  margin-left: 6px;
  cursor: default;
}

.freshness-badge .badge-dot {
  width: 6px;
  height: 6px;
  border-radius: 50%;
  flex-shrink: 0;
}

/* Current: verified within 30 days */
.freshness-badge.current {
  background: rgba(16, 185, 129, 0.08);
  color: #059669;
  border: 1px solid rgba(16, 185, 129, 0.20);
}
.freshness-badge.current .badge-dot { background: #10B981; }

/* Recent: 30-90 days */
.freshness-badge.recent {
  background: rgba(245, 158, 11, 0.08);
  color: #d97706;
  border: 1px solid rgba(245, 158, 11, 0.20);
}
.freshness-badge.recent .badge-dot { background: #f59e0b; }

/* Review pending: 90+ days */
.freshness-badge.review-pending {
  background: rgba(249, 115, 22, 0.08);
  color: #ea580c;
  border: 1px solid rgba(249, 115, 22, 0.20);
}
.freshness-badge.review-pending .badge-dot { background: #f97316; }

/* Tooltip on hover */
.freshness-badge[title] { cursor: help; }

/* ---- AI-Generated Labels --------------------------------- */
.ai-label {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  font-size: 11.5px;
  color: rgba(0, 0, 0, 0.40);
  font-family: 'Inter', sans-serif;
  font-weight: 400;
}

.ai-label .ai-icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 14px;
  height: 14px;
  border-radius: 3px;
  background: rgba(16, 185, 129, 0.10);
  color: #10B981;
  font-size: 9px;
  font-weight: 700;
  flex-shrink: 0;
  letter-spacing: 0;
}

/* Block placement (document header/footer) */
.ai-label-block {
  display: flex;
  align-items: flex-start;
  gap: 8px;
  padding: 10px 14px;
  background: rgba(0, 0, 0, 0.02);
  border: 1px solid rgba(0, 0, 0, 0.06);
  border-radius: 6px;
  margin: 12px 0;
}

.ai-label-block .ai-icon-block {
  width: 22px;
  height: 22px;
  border-radius: 5px;
  background: rgba(16, 185, 129, 0.08);
  color: #10B981;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 10px;
  font-weight: 800;
  flex-shrink: 0;
  margin-top: 1px;
  letter-spacing: 0;
}

.ai-label-block p {
  margin: 0;
  font-size: 12px;
  color: rgba(0, 0, 0, 0.45);
  line-height: 1.5;
}

.ai-label-block p strong {
  color: rgba(0, 0, 0, 0.60);
  font-weight: 500;
}

/* ---- Source Citations ------------------------------------ */
.data-source {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  font-size: 11px;
  color: rgba(0, 0, 0, 0.35);
  font-style: normal;
  cursor: default;
}

.data-source::before {
  content: '\00B7';
  margin-right: 2px;
}

.data-source a {
  color: #10B981;
  text-decoration: none;
  transition: color 0.15s;
}
.data-source a:hover { color: #059669; }

/* Source type badges */
.source-tag {
  display: inline-block;
  padding: 1px 5px;
  border-radius: 3px;
  font-size: 9.5px;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.05em;
  vertical-align: middle;
}

.source-tag.sourced {
  background: rgba(16, 185, 129, 0.06);
  color: #059669;
  border: 1px solid rgba(16, 185, 129, 0.15);
}

.source-tag.estimated {
  background: rgba(245, 158, 11, 0.06);
  color: #d97706;
  border: 1px solid rgba(245, 158, 11, 0.15);
}

.source-tag.calculated {
  background: rgba(59, 130, 246, 0.06);
  color: #2563eb;
  border: 1px solid rgba(59, 130, 246, 0.15);
}

/* ---- Research page source block -------------------------- */
.sources-block {
  background: rgba(0, 0, 0, 0.02);
  border: 1px solid rgba(0, 0, 0, 0.06);
  border-radius: 10px;
  padding: 20px 24px;
  margin-top: 16px;
}

.sources-block h4 {
  font-size: 12px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  color: rgba(0, 0, 0, 0.35);
  margin: 0 0 12px 0;
}

.sources-block ol {
  margin: 0;
  padding-left: 18px;
  display: flex;
  flex-direction: column;
  gap: 6px;
}

.sources-block li {
  font-size: 12.5px;
  color: rgba(0, 0, 0, 0.45);
  line-height: 1.5;
}

.sources-block li a {
  color: #10B981;
  text-decoration: none;
}
.sources-block li a:hover { color: #059669; }

/* ---- "Last reviewed" article byline --------------------- */
.article-reviewed {
  font-size: 12px;
  color: rgba(0, 0, 0, 0.35);
  margin-top: 4px;
  display: flex;
  align-items: center;
  gap: 6px;
}

/* ---- Methodology footer inside tool results ------------- */
.methodology-footer {
  margin-top: 24px;
  padding-top: 16px;
  border-top: 1px solid rgba(0, 0, 0, 0.06);
  display: flex;
  flex-direction: column;
  gap: 8px;
}

.methodology-footer .method-row {
  display: flex;
  align-items: flex-start;
  gap: 8px;
  font-size: 12px;
  color: rgba(0, 0, 0, 0.40);
  line-height: 1.5;
}

.methodology-footer .method-label {
  flex-shrink: 0;
  font-weight: 600;
  color: rgba(0, 0, 0, 0.50);
  min-width: 90px;
}
