/* Review Scorecard-specific styles */

.sc-table { width: 100%; border-collapse: separate; border-spacing: 0; margin-bottom: 0; }
.sc-table thead th {
  background: linear-gradient(135deg, var(--slate) 0%, var(--grape) 100%);
  color: #fff; font-weight: 600; font-size: 12px; text-transform: uppercase;
  letter-spacing: 0.5px; padding: 12px 14px; text-align: left; white-space: nowrap;
}
.sc-table thead th:first-child { border-radius: 8px 0 0 0; }
.sc-table thead th:last-child { border-radius: 0 8px 0 0; text-align: center; }
.sc-table thead th.center { text-align: center; }
.sc-table tbody tr { animation: fadeIn 0.4s ease forwards; opacity: 0; }
.sc-table tbody tr:nth-child(even) { background: var(--pale-grey); }
.sc-table tbody tr:hover { background: #E8F8FF; }
.sc-table td {
  padding: 14px 14px; font-size: 14px; vertical-align: middle;
  border-bottom: 1px solid #eee;
}
.sc-table td.center { text-align: center; }

.sc-platform { font-weight: 600; color: var(--slate); }
.sc-platform a { color: var(--reddit-blue); text-decoration: none; }
.sc-platform a:hover { text-decoration: underline; }
.sc-platform-type { font-size: 11px; color: var(--light-grey); font-weight: 400; }

.sc-serp { font-size: 10px; color: var(--med-grey); background: var(--pale-grey); padding: 1px 6px; border-radius: 3px; font-weight: 600; white-space: nowrap; }

.sc-value { position: relative; cursor: help; }
.sc-value-score { font-weight: 700; font-size: 14px; color: var(--slate); }
.sc-value-bar { display: inline-block; width: 40px; height: 5px; background: var(--pale-grey); border-radius: 3px; vertical-align: middle; margin-left: 6px; overflow: hidden; position: relative; }
.sc-value-bar-fill { display: block; height: 100%; border-radius: 3px; background: linear-gradient(90deg, var(--brand-blue), var(--mint), var(--yellow), var(--orange), var(--plum)); background-size: 40px 100%; }
.sc-value-tip {
  visibility: hidden; opacity: 0; position: absolute; bottom: 100%; left: 50%; transform: translateX(-50%);
  background: var(--slate); color: #fff; font-size: 11px; padding: 8px 12px; border-radius: 6px;
  white-space: nowrap; z-index: 10; transition: opacity 0.2s; margin-bottom: 6px; line-height: 1.6;
}
.sc-value-tip::after {
  content: ''; position: absolute; top: 100%; left: 50%; transform: translateX(-50%);
  border: 5px solid transparent; border-top-color: var(--slate);
}
.sc-value:hover .sc-value-tip { visibility: visible; opacity: 1; }

.sc-rating-wrap { position: relative; cursor: default; display: inline-block; }
.sc-rating-wrap.has-tip { cursor: help; }
.sc-rating-tip {
  visibility: hidden; opacity: 0; position: absolute; bottom: 100%; left: 50%; transform: translateX(-50%);
  background: var(--slate); color: #fff; font-size: 11px; padding: 8px 12px; border-radius: 6px;
  white-space: nowrap; z-index: 10; transition: opacity 0.2s; margin-bottom: 6px; line-height: 1.6;
}
.sc-rating-tip::after {
  content: ''; position: absolute; top: 100%; left: 50%; transform: translateX(-50%);
  border: 5px solid transparent; border-top-color: var(--slate);
}
.sc-rating-wrap:hover .sc-rating-tip { visibility: visible; opacity: 1; }

.sc-rating { font-weight: 800; font-size: 18px; }
.sc-rating.on_track { color: var(--emerald); }
.sc-rating.at_risk { color: var(--yellow); }
.sc-rating.below_target { color: var(--orange); }
.sc-rating .scale { font-size: 12px; font-weight: 400; color: var(--light-grey); }

.sc-target { font-size: 13px; color: var(--med-grey); }

.sc-reviews { font-size: 13px; color: var(--med-grey); }
.sc-reviews strong { color: var(--slate); }
.sc-new { font-size: 11px; color: var(--emerald); }

.sc-favicon { width: 20px; height: 20px; border-radius: 4px; }

.sc-table tbody tr.disabled { opacity: 0.4; }
.sc-table tbody tr.disabled:hover { background: inherit; }
.sc-disabled-label { font-size: 11px; color: var(--light-grey); font-style: italic; }

.sc-att-favicon { width: 32px; height: 32px; border-radius: 6px; margin-bottom: 8px; }