/* MASH CI Platform - custom styles beyond Tailwind utility classes */

::-webkit-scrollbar { width: 8px; height: 8px; }
::-webkit-scrollbar-thumb { background: #cbd5e1; border-radius: 4px; }
::-webkit-scrollbar-track { background: #f1f5f9; }

.badge {
  display: inline-flex;
  align-items: center;
  gap: 0.25rem;
  padding: 0.125rem 0.5rem;
  border-radius: 9999px;
  font-size: 0.7rem;
  font-weight: 600;
  white-space: nowrap;
}

.badge-tier-1, .badge-approved, .badge-marketed, .badge-completed, .badge-positive,
.badge-reportedfact { background: #dcfce7; color: #166534; }
.badge-tier-2, .badge-phase3, .badge-phase2b, .badge-preregistration, .badge-active, .badge-expected, .badge-mixed,
.badge-companyclaim { background: #fef9c3; color: #854d0e; }
.badge-tier-3, .badge-phase2, .badge-phase2a, .badge-phase1, .badge-tier-4, .badge-discontinued, .badge-negative,
.badge-nodatadisclosed, .badge-overdue { background: #fee2e2; color: #991b1b; }
.badge-neutral, .badge-pending, .badge-unknown { background: #e2e8f0; color: #334155; }
.badge-demo { background: #ede9fe; color: #5b21b6; }

/* ---------- Dashboard infographics ---------- */
.sig-pill {
  display: inline-flex;
  align-items: center;
  padding: 1px 8px;
  border-radius: 9999px;
  font-size: 0.62rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.03em;
  white-space: nowrap;
}
.sig-major { background: #fee2e2; color: #991b1b; }
.sig-moderate { background: #fef3c7; color: #92400e; }
.sig-minor { background: #e2e8f0; color: #475569; }
.sig-neutral { background: #e2e8f0; color: #475569; }

.timeline-item { border-left: 3px solid #cbd5e1; transition: background-color 0.15s; }
.timeline-item:hover { background-color: #f8fafc; }
.timeline-item.significance-major { border-left-color: #ef4444; }
.timeline-item.significance-moderate { border-left-color: #f59e0b; }
.timeline-item.significance-minor { border-left-color: #94a3b8; }
.timeline-item.significance-neutral { border-left-color: #cbd5e1; }

.competitive-card {
  border: 1px solid #e2e8f0;
  border-left-width: 4px;
  border-radius: 0.75rem;
  padding: 0.9rem;
  background: #fff;
  transition: box-shadow 0.15s, transform 0.15s;
}
.competitive-card:hover { box-shadow: 0 4px 10px -2px rgba(0,0,0,0.08); transform: translateY(-1px); }
.competitive-card.tier-leader { border-left-color: #6366f1; background: linear-gradient(to right, rgba(99,102,241,0.05), #fff 16%); }
.competitive-card.tier-challenger { border-left-color: #0ea5e9; }

.tier-pill {
  font-size: 0.62rem;
  font-weight: 700;
  padding: 1px 8px;
  border-radius: 9999px;
  text-transform: uppercase;
  letter-spacing: 0.03em;
  white-space: nowrap;
}
.tier-pill.tier-leader { background: #e0e7ff; color: #3730a3; }
.tier-pill.tier-challenger { background: #e0f2fe; color: #075985; }

.line-clamp-3 {
  display: -webkit-box;
  -webkit-line-clamp: 3;
  -webkit-box-orient: vertical;
  overflow: hidden;
}

.leaderboard-bar {
  background: linear-gradient(to right, #6366f1, #818cf8);
  border-radius: 9999px;
  height: 100%;
  transition: width 0.4s ease;
}

.demo-watermark {
  position: fixed;
  top: 0; left: 0; right: 0; bottom: 0;
  pointer-events: none;
  z-index: 40;
  display: flex;
  align-items: center;
  justify-content: center;
  overflow: hidden;
}
.demo-watermark span {
  font-size: 7rem;
  font-weight: 800;
  color: rgba(99, 102, 241, 0.06);
  transform: rotate(-30deg);
  white-space: nowrap;
}

.data-table th {
  position: sticky;
  top: 0;
  background: #f8fafc;
  z-index: 10;
}

.data-table td, .data-table th {
  max-width: 320px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.data-table td.wrap, .data-table th.wrap {
  white-space: normal;
}

.tooltip-trigger { position: relative; cursor: help; }
.tooltip-trigger .tooltip-content {
  display: none;
  position: absolute;
  bottom: 100%;
  left: 50%;
  transform: translateX(-50%);
  background: #1e293b;
  color: white;
  padding: 0.5rem 0.75rem;
  border-radius: 0.375rem;
  font-size: 0.75rem;
  white-space: normal;
  width: max-content;
  max-width: 280px;
  z-index: 50;
  margin-bottom: 4px;
  box-shadow: 0 4px 6px -1px rgba(0,0,0,0.2);
}
.tooltip-trigger:hover .tooltip-content { display: block; }

.diff-added { background: #dcfce7; }
.diff-removed { background: #fee2e2; }
.diff-changed { background: #fef9c3; }

.sidebar-link.active {
  background: #312e81;
  color: white;
}
.sidebar-link:hover:not(.active) {
  background: #1e293b;
}

@keyframes fadeIn { from { opacity: 0; } to { opacity: 1; } }
.fade-in { animation: fadeIn 0.2s ease-in; }

.spinner {
  border: 3px solid #e2e8f0;
  border-top-color: #4f46e5;
  border-radius: 50%;
  width: 2rem;
  height: 2rem;
  animation: spin 0.8s linear infinite;
}
@keyframes spin { to { transform: rotate(360deg); } }
