/* ClinVista Platform — Kardigan-branded dashboard CSS
   Premium design system aligned with kardigan.bio visual identity.
   Warm cream palette, refined typography, editorial card layouts. */

/* System font stack — offline-safe for BPS (no CDN dependency) */

:root {
  /* Kardigan brand — palette extracted from kardigan.bio:
     crimson #8B002E (primary heading), rose-crimson #C4004A (links/accents),
     deep wine #310410, warm cream #f4f3f0 (page bg) */
  --kg-bg: #f4f3f0;
  --kg-surface: #ffffff;
  --kg-surface-2: #edecea;
  --kg-border: #d8d5d0;
  --kg-cream: #2d2926;
  --kg-cream-muted: #6b6560;
  --kg-accent: #8B002E;
  --kg-accent-lt: #C4004A;
  --kg-accent-2: #6A0023;
  --kg-accent-2-lt: #8B002E;
  --kg-wine: #310410;
  --kg-cream-brand: #f4f3f0;
  --kg-success: #1a7a3a;
  --kg-warn: #c87000;
  --kg-danger: #b91c1c;
  --kg-info: #0e6e8c;

  /* Gradients — subtler, more sophisticated */
  --kg-gradient-accent: linear-gradient(135deg, #8B002E 0%, #6A0023 100%);
  --kg-gradient-accent-hover: linear-gradient(135deg, #6A0023 0%, #310410 100%);
  --kg-gradient-surface: linear-gradient(180deg, rgba(139,0,46,0.03) 0%, var(--kg-surface) 60%);

  /* Glassmorphism */
  --kg-glass-blur: 16px;
  --kg-glass-bg: rgba(244,243,240,0.88);
  --kg-glass-border: rgba(216,213,208,0.5);

  /* Shadows — refined, less aggressive */
  --kg-shadow-soft: 0 1px 3px rgba(0,0,0,0.04), 0 4px 16px rgba(0,0,0,0.03);
  --kg-shadow-elevated: 0 4px 12px rgba(0,0,0,0.06), 0 12px 40px rgba(0,0,0,0.04);
  --kg-shadow-interactive: 0 2px 8px rgba(139,0,46,0.08);
  --kg-shadow-hover: 0 8px 28px rgba(139,0,46,0.10);

  /* Motion */
  --kg-ease: 0.2s cubic-bezier(0.4,0,0.2,1);
  --kg-spring: 0.3s cubic-bezier(0.34,1.56,0.64,1);

  /* Typography scale */
  --kg-font-display: Georgia, 'Times New Roman', serif;
  --kg-font-body: Inter, system-ui, -apple-system, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;
  --kg-radius: 12px;
  --kg-radius-lg: 16px;
}

[data-bs-theme="dark"] {
  --kg-bg: #121110;
  --kg-surface: #1c1a18;
  --kg-surface-2: #262420;
  --kg-border: #3a3632;
  --kg-cream: #e8e5e0;
  --kg-cream-muted: #9a958e;
  --kg-accent: #e85a7e;
  --kg-accent-lt: #f07898;
  --kg-accent-2: #C4004A;
  --kg-accent-2-lt: #e85a7e;
  --kg-wine: #4a0a1c;
  --kg-cream-brand: #f4f3f0;
  --kg-success: #34d399;
  --kg-warn: #fbbf24;
  --kg-danger: #f87171;
  --kg-info: #60a5fa;
  --kg-gradient-accent: linear-gradient(135deg, #e85a7e 0%, #C4004A 100%);
  --kg-gradient-accent-hover: linear-gradient(135deg, #C4004A 0%, #8B002E 100%);
  --kg-glass-bg: rgba(28,26,24,0.90);
  --kg-glass-border: rgba(58,54,50,0.5);
  --kg-shadow-soft: 0 1px 3px rgba(0,0,0,0.15), 0 4px 16px rgba(0,0,0,0.10);
  --kg-shadow-elevated: 0 4px 12px rgba(0,0,0,0.15), 0 12px 40px rgba(0,0,0,0.12);
  --kg-shadow-interactive: 0 2px 8px rgba(232,90,126,0.12);
  --kg-shadow-hover: 0 8px 28px rgba(232,90,126,0.15);
}

/* ── Base ── */
* { box-sizing: border-box; }

body {
  font-family: var(--kg-font-body);
  font-size: 14px;
  background: var(--kg-bg);
  color: var(--kg-cream);
  margin: 0; padding: 0;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  transition: background var(--kg-ease), color var(--kg-ease);
}

/* ── Login ── */
.login-container {
  min-height: 100vh;
  display: flex; align-items: center; justify-content: center;
  background: var(--kg-wine);
  background-image:
    radial-gradient(ellipse at 30% 20%, rgba(139,0,46,0.4) 0%, transparent 60%),
    radial-gradient(ellipse at 70% 80%, rgba(106,0,35,0.3) 0%, transparent 50%);
  padding: 20px;
}

@keyframes gradientShift {
  0%,100% { background-position: 0% 50%; }
  50% { background-position: 100% 50%; }
}

.login-card {
  background: rgba(255,255,255,0.97);
  border-radius: 20px;
  box-shadow: 0 24px 80px rgba(0,0,0,0.35), 0 0 0 1px rgba(255,255,255,0.08);
  width: 100%; max-width: 400px;
  overflow: hidden;
  transition: transform var(--kg-spring), box-shadow var(--kg-spring);
}

.login-card:hover { transform: translateY(-2px); box-shadow: 0 28px 90px rgba(0,0,0,0.4); }

.login-header { padding: 40px; }

.logo-section { text-align: center; margin-bottom: 30px; }

.brand-title {
  font-family: var(--kg-font-display);
  font-size: 34px; font-weight: 700;
  color: var(--kg-wine);
  margin-bottom: 8px;
}

.brand-subtitle { color: var(--kg-cream-muted); font-size: 14px; margin: 0; }

.login-divider { height: 1px; background: var(--kg-border); margin: 30px 0; }

.form-floating { margin-bottom: 20px; }

.form-floating > .form-control {
  border: 2px solid var(--kg-border); border-radius: 10px;
  background: var(--kg-surface); color: var(--kg-cream);
  transition: border-color var(--kg-ease), box-shadow var(--kg-ease);
}

.form-floating > .form-control:focus {
  border-color: var(--kg-accent);
  box-shadow: 0 0 0 .25rem rgba(224,0,77,0.15);
}

.btn-primary {
  background: var(--kg-gradient-accent) !important;
  border: none !important; border-radius: 10px;
  font-weight: 600; color: #fff !important;
  transition: transform var(--kg-ease), box-shadow var(--kg-ease);
}

.btn-primary:hover {
  background: var(--kg-gradient-accent-hover) !important;
  transform: translateY(-2px);
  box-shadow: 0 .5rem 1rem rgba(224,0,77,0.25);
}

.login-hint { text-align: center; margin-top: 20px; font-size: 12px; color: var(--kg-cream-muted); letter-spacing: 0.02em; }
.alert-hidden { display: none; }

/* ── Main shell ── */
.main-app { min-height: 100vh; padding-top: 56px; }

/* ── Top navbar ── */
.top-navbar {
  background: var(--kg-gradient-accent) !important;
  border: none;
  box-shadow: 0 2px 12px rgba(224,0,77,0.2);
  z-index: 1030;
}

.top-navbar .navbar-brand {
  font-weight: 700; font-size: 20px; color: #fff !important;
  display: inline-flex; align-items: center; gap: .4rem;
}

.top-navbar .nav-link {
  color: rgba(255,255,255,0.8) !important;
  font-weight: 500; font-size: .85rem;
  padding: .4rem .7rem !important;
  transition: color var(--kg-ease), background var(--kg-ease);
}

.top-navbar .nav-link:hover { color: #fff !important; }

.top-navbar .nav-link.active,
.top-navbar .nav-link[aria-current="page"] {
  color: #fff !important;
  background: rgba(255,255,255,0.15) !important;
  border-radius: 6px;
}

/* ── Sidebar ── */
.sidebar {
  background: var(--kg-surface) !important;
  border-right: 1px solid var(--kg-border);
  min-height: calc(100vh - 56px);
  padding: 20px 0;
}

.sidebar-heading {
  font-size: 11px; text-transform: uppercase;
  letter-spacing: 1px; color: var(--kg-cream-muted);
  margin-bottom: 15px; font-weight: 600;
}

.sidebar .nav-link {
  color: var(--kg-cream); padding: 10px 15px;
  border-radius: 8px; margin-bottom: 4px;
  transition: all var(--kg-ease);
  display: flex; align-items: center; font-size: .88rem;
}

.sidebar .nav-link:hover {
  background: rgba(224,0,77,0.06);
  color: var(--kg-accent);
  transform: translateX(3px);
}

.sidebar .nav-link.active {
  background: var(--kg-gradient-accent);
  color: #fff;
  box-shadow: var(--kg-shadow-interactive);
}

.sidebar .nav-link i { margin-right: 10px; font-size: 16px; }

/* ── Page content ── */
.content-header { background: var(--kg-bg); }

.page-content { animation: fadeIn .4s ease; }

@keyframes fadeIn {
  from { opacity: 0; transform: translateY(12px); }
  to   { opacity: 1; transform: translateY(0); }
}

/* ── Stats cards ── */
.stats-card {
  border: none; border-radius: 12px;
  box-shadow: var(--kg-shadow-soft);
  background: var(--kg-surface);
  transition: transform var(--kg-spring), box-shadow var(--kg-spring);
  overflow: hidden;
}

.stats-card:hover {
  transform: translateY(-4px);
  box-shadow: var(--kg-shadow-hover);
}

.stats-card .card-body { padding: 20px; }

.stats-icon {
  width: 48px; height: 48px; border-radius: 12px;
  display: flex; align-items: center; justify-content: center;
  font-size: 22px; color: #fff;
}

.stats-icon.bg-primary  { background: var(--kg-gradient-accent); }
.stats-icon.bg-success  { background: linear-gradient(135deg, var(--kg-success) 0%, #20c997 100%); }
.stats-icon.bg-info     { background: linear-gradient(135deg, #fa709a 0%, #fee140 100%); }
.stats-icon.bg-warning  { background: linear-gradient(135deg, var(--kg-warn) 0%, #fcb69f 100%); }

.stats-label {
  font-size: 12px; color: var(--kg-cream-muted);
  font-weight: 500; text-transform: uppercase;
  letter-spacing: .04em; margin-bottom: 4px;
}

.stats-value {
  font-size: 26px; font-weight: 700;
  color: var(--kg-cream);
  font-variant-numeric: tabular-nums;
}

/* ── Chart cards ── */
.chart-card {
  border: 1px solid var(--kg-border); border-radius: 12px;
  box-shadow: var(--kg-shadow-soft);
  background: var(--kg-surface);
  transition: box-shadow var(--kg-ease);
}

.chart-card:hover { box-shadow: var(--kg-shadow-elevated); }

.chart-card .card-header {
  background: var(--kg-surface); border-bottom: 1px solid var(--kg-border);
  border-radius: 12px 12px 0 0; padding: 14px 20px;
  display: flex; justify-content: space-between; align-items: center;
}

.chart-card .card-title { margin: 0; font-size: 15px; font-weight: 600; }

.chart-container { height: 300px; width: 100%; }

/* ── Study cards ── */
.studies-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(300px, 1fr));
  gap: 20px;
}

.study-card {
  background: var(--kg-surface);
  border-radius: 12px; padding: 20px;
  box-shadow: var(--kg-shadow-soft);
  border: 1px solid var(--kg-border);
  cursor: pointer;
  transition: transform var(--kg-spring), box-shadow var(--kg-spring), border-color var(--kg-ease);
}

.study-card:hover {
  transform: translateY(-4px);
  box-shadow: var(--kg-shadow-hover);
  border-color: var(--kg-accent);
}

.study-card-header {
  display: flex; justify-content: space-between;
  align-items: start; margin-bottom: 15px;
}

.study-title { font-family: var(--kg-font-display); font-weight: 600; font-size: 17px; color: var(--kg-cream); margin-bottom: 5px; }
.study-id { font-size: 12px; color: var(--kg-cream-muted); font-weight: 500; }

.study-status {
  padding: 4px 12px; border-radius: 20px;
  font-size: 11px; font-weight: 600;
  letter-spacing: .02em;
}

.study-status.active  { background: rgba(40,167,69,0.1);  color: var(--kg-success); }
.study-status.pending { background: rgba(253,126,20,0.1); color: var(--kg-warn); }
.study-status.completed { background: rgba(224,0,77,0.1); color: var(--kg-accent); }

.study-card-body { padding-top: 15px; border-top: 1px solid var(--kg-border); }

/* Per-study data chips — enrollment is always shown in the study's own context */
.study-card-stats { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 12px; }
.study-chip {
  display: inline-flex; align-items: center; gap: 6px;
  padding: 4px 10px; border-radius: 8px;
  font-size: 12px; font-weight: 600;
  color: var(--kg-cream);
  background: var(--kg-surface-2);
  border: 1px solid var(--kg-border);
}
.study-chip i { font-size: 12px; color: var(--card-accent, var(--kg-accent)); }
.study-chip-muted { color: var(--kg-cream-muted); font-weight: 500; }
.study-chip-muted i { color: var(--kg-cream-muted); }

/* ═══════════════════════════════════════════════════════════════════════════
   Clinical Program Portfolio — Kardigan-style program cards (kardigan.bio)
   ═══════════════════════════════════════════════════════════════════════════ */
.cv-program-list { display: grid; gap: 22px; }

.cv-program-card {
  position: relative; display: flex;
  background: var(--kg-surface);
  border: 1px solid var(--kg-border);
  border-radius: var(--kg-radius-lg);
  box-shadow: var(--kg-shadow-soft);
  overflow: hidden;
  transition: transform var(--kg-ease), box-shadow var(--kg-ease), border-color var(--kg-ease);
}
.cv-program-card:hover {
  transform: translateY(-2px);
  box-shadow: var(--kg-shadow-elevated);
  border-color: var(--accent);
}
.cv-program-rail {
  width: 4px; flex-shrink: 0;
  background: linear-gradient(180deg, var(--accent), var(--accent-dk));
  border-radius: 4px 0 0 4px;
}
.cv-program-body { flex: 1; padding: 30px 36px; min-width: 0; }

.cv-program-head {
  display: flex; align-items: center; justify-content: space-between;
  gap: 16px; margin-bottom: 20px;
}
.cv-program-logo-wrap { display: flex; align-items: center; min-height: 42px; }
.cv-program-logo { height: 40px; width: auto; max-width: 260px; object-fit: contain; }
.cv-program-wordmark { font-size: 23px; font-weight: 800; letter-spacing: .02em; }

.cv-program-status {
  display: inline-flex; align-items: center; gap: 7px;
  padding: 5px 13px; border-radius: 999px;
  font-size: 12px; font-weight: 600; white-space: nowrap;
}
.cv-status-dot { width: 8px; height: 8px; border-radius: 50%; }
.cv-program-status.is-live { background: rgba(40,167,69,.10); color: var(--kg-success); }
.cv-program-status.is-live .cv-status-dot { background: var(--kg-success); box-shadow: 0 0 0 3px rgba(40,167,69,.15); }
.cv-program-status.is-pending { background: rgba(108,117,125,.12); color: var(--kg-cream-muted); }
.cv-program-status.is-pending .cv-status-dot { background: var(--kg-cream-muted); }

.cv-program-indication {
  font-family: var(--kg-font-display);
  font-size: 24px; font-weight: 700; line-height: 1.25;
  color: var(--kg-wine); margin: 0 0 5px; letter-spacing: -.01em;
}
.cv-program-compound { font-size: 14px; color: var(--kg-cream-muted); margin: 0 0 15px; }
.cv-program-compound strong { color: var(--accent); font-weight: 700; }

.cv-program-overview {
  font-size: 14.5px; line-height: 1.65; color: var(--kg-cream);
  opacity: .82; margin: 0 0 20px; max-width: 72ch;
}

.cv-program-meta { display: flex; flex-wrap: wrap; gap: 10px; margin-bottom: 22px; }
.cv-prog-chip {
  display: inline-flex; align-items: center; gap: 7px;
  padding: 6px 13px; border-radius: 9px;
  font-size: 13px; font-weight: 600; color: var(--kg-cream);
  background: var(--kg-surface-2); border: 1px solid var(--kg-border);
}
.cv-prog-chip i { color: var(--accent); font-size: 13px; }
.cv-prog-chip-phase {
  color: #fff; border: none;
  background: linear-gradient(135deg, var(--accent), var(--accent-dk));
}
.cv-prog-chip-phase i { color: #fff; }
.cv-prog-chip-muted { color: var(--kg-cream-muted); }
.cv-prog-chip-muted i { color: var(--kg-cream-muted); }

.cv-program-foot {
  display: flex; align-items: center; justify-content: space-between;
  gap: 16px; flex-wrap: wrap;
  padding-top: 20px; border-top: 1px solid var(--kg-border);
}
.cv-prog-open {
  display: inline-flex; align-items: center; gap: 9px;
  padding: 11px 24px; border-radius: 10px; border: none;
  font-size: 14px; font-weight: 600; color: #fff; cursor: pointer;
  background: var(--kg-accent);
  box-shadow: 0 2px 8px -2px rgba(0,0,0,.20);
  transition: transform var(--kg-ease), box-shadow var(--kg-ease), background var(--kg-ease);
}
.cv-prog-open:hover { transform: translateY(-1px); background: var(--kg-accent-2); box-shadow: 0 4px 14px -4px rgba(0,0,0,.30); }
.cv-prog-open i { transition: transform var(--kg-ease); }
.cv-prog-open:hover i { transform: translateX(3px); }
.cv-prog-open-disabled {
  background: var(--kg-surface-2); color: var(--kg-cream-muted);
  border: 1px dashed var(--kg-border); box-shadow: none; cursor: not-allowed;
}
.cv-prog-open-disabled:hover { transform: none; filter: none; }

.cv-program-links { display: flex; align-items: center; gap: 18px; flex-wrap: wrap; }
.cv-prog-link {
  display: inline-flex; align-items: center; gap: 6px;
  font-size: 13px; font-weight: 500; color: var(--kg-cream-muted);
  text-decoration: none; transition: color var(--kg-ease);
}
.cv-prog-link:hover { color: var(--accent); }
.cv-prog-link i { font-size: 13px; }

@media (max-width: 768px) {
  .cv-program-body { padding: 20px; }
  .cv-program-indication { font-size: 19px; }
  .cv-program-head { flex-wrap: wrap; }
  .cv-program-foot { flex-direction: column; align-items: stretch; }
  .cv-prog-open { justify-content: center; }
  .cv-program-links { justify-content: center; }
}

.study-meta {
  display: flex; justify-content: space-between;
  font-size: 13px; color: var(--kg-cream-muted);
}

/* ── Study detail ── */
.study-header { animation: fadeIn .5s ease; }

.study-badges { display: flex; gap: 10px; flex-wrap: wrap; }

.badge-study {
  padding: 6px 14px; border-radius: 20px;
  font-size: 13px; font-weight: 500;
  background: var(--kg-gradient-accent); color: #fff;
}

/* ── Tabs ── */
.nav-tabs { border-bottom: 2px solid var(--kg-border); margin-bottom: 30px; }

.nav-tabs .nav-link {
  border: none; color: var(--kg-cream-muted);
  padding: 10px 18px; font-weight: 500; font-size: .88rem;
  transition: color var(--kg-ease), border-color var(--kg-ease);
}

.nav-tabs .nav-link:hover {
  color: var(--kg-accent);
  border-bottom: 2px solid rgba(224,0,77,0.3);
}

.nav-tabs .nav-link.active {
  background: transparent;
  border-bottom: 2px solid var(--kg-accent);
  color: var(--kg-accent);
}

/* ── Tables ── */
.table { border-radius: 8px; overflow: hidden; }

.table thead th {
  background: var(--kg-surface-2); border-bottom: 2px solid var(--kg-border);
  font-weight: 600; font-size: 12px;
  text-transform: uppercase; letter-spacing: .04em;
  color: var(--kg-cream-muted); padding: .6rem .75rem;
}

.table tbody tr { transition: background var(--kg-ease); }
.table tbody tr:hover { background: rgba(224,0,77,0.04); }
.table td { vertical-align: middle; }

/* ── Milestones ── */
.milestones-list { display: flex; flex-direction: column; gap: 12px; }

.milestone-item {
  background: var(--kg-surface);
  border: 1px solid var(--kg-border); border-radius: 10px;
  padding: 18px; display: flex; justify-content: space-between;
  align-items: center; transition: all var(--kg-ease);
}

.milestone-item:hover { border-color: var(--kg-accent); box-shadow: var(--kg-shadow-soft); }

.milestone-name { font-weight: 600; font-size: 15px; margin-bottom: 4px; }
.milestone-date { font-size: 13px; color: var(--kg-cream-muted); }

.milestone-status {
  padding: 5px 14px; border-radius: 20px;
  font-size: 12px; font-weight: 600;
}

.milestone-status.complete    { background: rgba(40,167,69,0.1);  color: var(--kg-success); }
.milestone-status.in-progress { background: rgba(224,0,77,0.1);  color: var(--kg-accent); }
.milestone-status.pending     { background: rgba(253,126,20,0.1); color: var(--kg-warn); }

/* ── Stat items ── */
.stat-item {
  display: flex; justify-content: space-between;
  padding: 14px 0; border-bottom: 1px solid var(--kg-border);
}
.stat-item:last-child { border-bottom: none; }
.stat-label { font-size: 14px; color: var(--kg-cream-muted); }
.stat-value { font-size: 16px; font-weight: 600; color: var(--kg-cream); }

/* ── Toasts ── */
.toast-container { z-index: 1060; }
.toast { background: var(--kg-surface); border-radius: 10px; box-shadow: var(--kg-shadow-elevated); }
.toast-header { background: var(--kg-surface-2); border-bottom: 1px solid var(--kg-border); border-radius: 10px 10px 0 0; }

.toast-error   { border-left: 4px solid var(--kg-danger); }
.toast-warning { border-left: 4px solid var(--kg-warn); }
.toast-success { border-left: 4px solid var(--kg-success); }
.toast-info    { border-left: 4px solid var(--kg-info); }

/* ── Loading ── */
.loading-overlay {
  position: fixed; top: 0; left: 0; width: 100%; height: 100%;
  background: rgba(255,255,255,0.92); display: flex;
  align-items: center; justify-content: center; z-index: 9999;
}
.loading-content { text-align: center; }
.loading-message { font-size: 15px; color: var(--kg-cream-muted); margin-top: 18px; }

.spinner-border {
  display: inline-block; width: 2rem; height: 2rem;
  vertical-align: -.125em; border: .25em solid currentColor;
  border-right-color: transparent; border-radius: 50%;
  animation: spinner-border .75s linear infinite;
}
@keyframes spinner-border { 100% { transform: rotate(360deg); } }
.spinner-border-sm { width: 1rem; height: 1rem; border-width: .15em; }

.loading-overlay .spinner-border { width: 3rem; height: 3rem; color: var(--kg-accent); }

/* ── Cards ── */
.card {
  border: 1px solid var(--kg-border); border-radius: 12px;
  box-shadow: var(--kg-shadow-soft); background: var(--kg-surface);
  transition: box-shadow var(--kg-ease);
}
.card:hover { box-shadow: var(--kg-shadow-elevated); }
.card-header {
  background: var(--kg-surface-2); border-bottom: 1px solid var(--kg-border);
  border-radius: 12px 12px 0 0; font-weight: 600;
}

/* ── Buttons ── */
.btn {
  border-radius: 8px; font-weight: 500;
  transition: all var(--kg-ease);
}
.btn:hover { transform: translateY(-1px); }
.btn:disabled { cursor: not-allowed; opacity: .65; }

.btn-outline-primary:hover {
  background: var(--kg-gradient-accent); border-color: transparent; color: #fff;
}

.btn-outline-secondary {
  color: var(--kg-cream); border-color: var(--kg-border);
  background: var(--kg-surface);
}
.btn-outline-secondary:hover {
  background: var(--kg-surface-2); border-color: var(--kg-accent);
  color: var(--kg-cream);
}

/* ── Alerts ── */
.alert { border-radius: 8px; border: none; box-shadow: var(--kg-shadow-soft); }
.alert i { font-size: 18px; vertical-align: middle; }
.alert-danger  { background: linear-gradient(135deg, #fee 0%, #fcc 100%); color: #721c24; }
.alert-warning { background: linear-gradient(135deg, #fff8e6 0%, #ffe6cc 100%); color: #856404; }
.alert-success { background: linear-gradient(135deg, #e6ffea 0%, #cce6ff 100%); color: #155724; }
.alert-info    { background: linear-gradient(135deg, #e6f4ff 0%, #cce6ff 100%); color: #0c5460; }

/* ── Shiny iframe embed ── */
.shiny-embed-frame {
  width: 100%; border: none; border-radius: 8px;
  min-height: calc(100vh - 180px);
  box-shadow: var(--kg-shadow-soft);
}

/* ── Progress ── */
.progress { height: 8px; border-radius: 4px; background: rgba(0,0,0,0.08); }
.progress-bar { border-radius: 4px; background: var(--kg-gradient-accent); transition: width .6s ease; }

/* ── Skeleton ── */
.skeleton {
  background: linear-gradient(90deg, var(--kg-surface-2) 25%, var(--kg-border) 50%, var(--kg-surface-2) 75%);
  background-size: 200% 100%; animation: skeleton-loading 1.5s infinite; border-radius: 4px;
}
@keyframes skeleton-loading { 0% { background-position: 200% 0; } 100% { background-position: -200% 0; } }
.skeleton-text  { height: 16px; margin-bottom: 8px; }
.skeleton-title { height: 24px; width: 60%; margin-bottom: 16px; }
.skeleton-card  { height: 100px; width: 100%; }

/* ── Empty states ── */
.empty-state { text-align: center; padding: 3rem 1rem; color: var(--kg-cream-muted); }
.empty-state i { font-size: 48px; margin-bottom: 1rem; opacity: .5; }
.empty-state h4 { margin-bottom: .5rem; font-weight: 600; }

/* ── Dark mode overrides ── */
[data-bs-theme="dark"] .login-card { background: var(--kg-surface); color: var(--kg-cream); }
[data-bs-theme="dark"] .brand-subtitle { color: var(--kg-cream-muted); }
[data-bs-theme="dark"] .form-floating > .form-control { background: var(--kg-bg); border-color: var(--kg-border); color: var(--kg-cream); }
[data-bs-theme="dark"] .form-floating label { color: var(--kg-cream-muted); }
[data-bs-theme="dark"] .sidebar { background: var(--kg-surface) !important; border-right-color: var(--kg-border); }
[data-bs-theme="dark"] .sidebar .nav-link { color: var(--kg-cream); }
[data-bs-theme="dark"] .sidebar .nav-link:hover { background: rgba(255,61,117,0.1); }
[data-bs-theme="dark"] .study-card, [data-bs-theme="dark"] .card { background: var(--kg-surface); border-color: var(--kg-border); }
[data-bs-theme="dark"] .table thead th { background: var(--kg-surface-2); border-color: var(--kg-border); }
[data-bs-theme="dark"] .milestone-item { background: var(--kg-surface); border-color: var(--kg-border); }
[data-bs-theme="dark"] .loading-overlay { background: rgba(15,17,21,0.92); }
[data-bs-theme="dark"] .alert-danger  { background: linear-gradient(135deg, #5c1a1a 0%, #7d2a2a 100%); color: #f8d7da; }
[data-bs-theme="dark"] .alert-warning { background: linear-gradient(135deg, #5c4a1a 0%, #7d5a2a 100%); color: #fff3cd; }
[data-bs-theme="dark"] .alert-success { background: linear-gradient(135deg, #1a5c1a 0%, #2a7d2a 100%); color: #d4edda; }
[data-bs-theme="dark"] .alert-info    { background: linear-gradient(135deg, #1a4a5c 0%, #2a6a7d 100%); color: #d1ecf1; }

/* ── Utility ── */
.d-none { display: none !important; }
.w-100 { width: 100%; }
.text-center { text-align: center; }

/* ── Compound Tabs ── */
.compound-tab {
  font-size: 13px; font-weight: 500;
  padding: 5px 14px; border-radius: 20px;
  color: var(--kg-cream-muted);
  border: 1px solid transparent;
  transition: all var(--kg-ease);
  display: inline-flex; align-items: center; gap: 6px;
}
.compound-tab:hover {
  color: var(--compound-color, var(--kg-accent));
  background: color-mix(in srgb, var(--compound-color, var(--kg-accent)) 8%, transparent);
}
.compound-tab.active {
  background: var(--compound-color, var(--kg-accent)) !important;
  color: #fff !important;
  border-color: var(--compound-color, var(--kg-accent));
  box-shadow: 0 2px 8px color-mix(in srgb, var(--compound-color, var(--kg-accent)) 30%, transparent);
}
.compound-dot {
  width: 8px; height: 8px; border-radius: 50%;
  display: inline-block; flex-shrink: 0;
}
.compound-tab.active .compound-dot { background: #fff !important; }

.compound-badge {
  display: inline-block; padding: 3px 10px;
  border-radius: 12px; font-size: 11px;
  font-weight: 600; color: #fff;
  letter-spacing: .03em; text-transform: uppercase;
}

.compound-meta-pill {
  display: inline-flex; align-items: center; gap: 5px;
  padding: 3px 10px; border-radius: 12px;
  font-size: 11px; font-weight: 600;
  color: var(--pill-accent, var(--kg-cream));
  background: var(--kg-surface-2);
  border: 1px solid var(--kg-border);
}
.compound-meta-pill i { font-size: 11px; opacity: .85; }

.compound-header {
  padding-bottom: 12px;
  border-bottom: 1px solid var(--kg-border);
}

/* Study card — clean, no left-border accent */
.study-card {
  border-left: none;
}
.study-card:hover {
  border-color: var(--card-accent, var(--kg-accent));
}

/* Tab content panes */
.tab-content > .tab-pane,
.cv-tab-content > .tab-pane { display: none; }
.tab-content > .tab-pane.active,
.cv-tab-content > .tab-pane.active { display: block; animation: fadeIn .3s ease; }

/* ── Responsive ── */
@media (max-width: 768px) {
  .sidebar { position: fixed; z-index: 1040; left: -100%; transition: left .3s ease; }
  .sidebar.show { left: 0; }
  .studies-grid { grid-template-columns: 1fr; }
  .chart-container { height: 250px; }
  .compound-tab { font-size: 12px; padding: 4px 10px; }
  .cv-navbar-inner { padding: 0 12px; }
  .cv-stats-grid { grid-template-columns: 1fr 1fr; }
  .cv-study-hero { flex-direction: column; gap: 16px; }
  .cv-overview-grid { grid-template-columns: 1fr; }
  .cv-navbar-nav { display: none; }
  .cv-user-name { display: none; }
}

/* ═══════════════════════════════════════════════════════════════════════════
   cv-* Namespace — Apple-Quality Design System for Redesigned HTML
   ═══════════════════════════════════════════════════════════════════════════ */

/* ── cv-navbar ── */
.cv-navbar {
  position: sticky; top: 0; z-index: 1030;
  background: var(--kg-surface);
  border-bottom: 1px solid var(--kg-border);
  transition: background var(--kg-ease), border-color var(--kg-ease);
}
.cv-navbar-inner {
  max-width: 1400px; margin: 0 auto;
  display: flex; align-items: center; justify-content: space-between;
  padding: 0 32px; height: 60px; gap: 24px;
}

/* Brand area — Kardigan wordmark + ClinVista badge */
.cv-navbar-brand {
  display: flex; align-items: center; gap: 14px;
  text-decoration: none; flex-shrink: 0;
}
.cv-brand-wordmark {
  height: 22px; width: auto; display: block;
  opacity: 0.9;
}
[data-bs-theme="dark"] .cv-brand-wordmark { filter: invert(1) brightness(1.8); opacity: 0.85; }
.cv-brand-badge {
  font-size: 11px; font-weight: 700; letter-spacing: 0.06em; text-transform: uppercase;
  padding: 3px 9px; border-radius: 5px;
  background: var(--kg-wine); color: #fff;
  line-height: 1.2;
}
[data-bs-theme="dark"] .cv-brand-badge { background: var(--kg-accent); }

/* Keep old classes for compatibility but hide them */
.cv-brand-icon { display: none; }
.cv-brand-name { display: none; }
.cv-brand-divider { display: none; }
.cv-brand-sub { display: none; }

/* Center nav */
.cv-navbar-nav { display: flex; align-items: center; gap: 4px; }
.cv-nav-link {
  display: inline-flex; align-items: center; gap: 6px;
  padding: 7px 16px; border-radius: 8px;
  font-size: 13px; font-weight: 500;
  color: var(--kg-cream-muted); text-decoration: none;
  transition: all var(--kg-ease); cursor: pointer;
  background: none; border: none;
  letter-spacing: 0.01em;
}
.cv-nav-link:hover { color: var(--kg-cream); background: var(--kg-surface-2); }
.cv-nav-link.active {
  color: var(--kg-accent); background: rgba(139,0,46,0.07);
  font-weight: 600;
}

/* Right-side actions */
.cv-navbar-actions { display: flex; align-items: center; gap: 8px; flex-shrink: 0; }
.cv-navbar-sep {
  width: 1px; height: 24px; background: var(--kg-border);
  margin: 0 4px; flex-shrink: 0;
}

.cv-user-chip {
  display: flex; align-items: center; gap: 8px;
  padding: 4px 12px 4px 4px; border-radius: 20px;
  background: var(--kg-surface-2); border: 1px solid var(--kg-border);
  font-size: 13px; transition: all var(--kg-ease);
}
.cv-user-chip:hover { border-color: var(--kg-accent); }
.cv-user-avatar {
  width: 28px; height: 28px; border-radius: 50%;
  display: flex; align-items: center; justify-content: center;
  background: var(--kg-accent); color: #fff;
  font-size: 12px; font-weight: 600;
}
.cv-user-name { font-weight: 500; color: var(--kg-cream); }
.cv-user-role {
  font-size: 11px; color: var(--kg-cream-muted);
  padding: 1px 6px; border-radius: 4px;
  background: rgba(139,0,46,0.06);
}

.cv-icon-btn {
  width: 36px; height: 36px; border-radius: 8px;
  display: flex; align-items: center; justify-content: center;
  background: none; border: 1px solid transparent;
  color: var(--kg-cream-muted); font-size: 16px;
  cursor: pointer; transition: all var(--kg-ease);
}
.cv-icon-btn:hover { background: var(--kg-surface-2); color: var(--kg-cream); border-color: var(--kg-border); }
.cv-icon-btn-danger:hover { color: var(--kg-danger); background: rgba(220,53,69,0.08); }

/* ── cv-main ── */
.cv-main {
  max-width: 1400px; margin: 0 auto;
  padding: 24px; min-height: calc(100vh - 56px);
}
.cv-view { animation: cvFadeIn .35s ease; }
@keyframes cvFadeIn { from { opacity:0; transform:translateY(8px); } to { opacity:1; transform:translateY(0); } }

/* ── cv-page-header ── */
.cv-page-header {
  display: flex; justify-content: space-between; align-items: center;
  margin-bottom: 24px; flex-wrap: wrap; gap: 12px;
}
.cv-page-title { font-family: var(--kg-font-display); font-size: 26px; font-weight: 700; color: var(--kg-wine); margin: 0; letter-spacing: -0.01em; }
.cv-page-sub { font-size: 14px; color: var(--kg-cream-muted); margin: 4px 0 0; }
.cv-page-actions { display: flex; align-items: center; gap: 8px; }

.cv-search-wrap { position: relative; }
.cv-search-icon { position: absolute; left: 10px; top: 50%; transform: translateY(-50%); color: var(--kg-cream-muted); font-size: 14px; }
.cv-search {
  padding: 8px 12px 8px 32px; border-radius: 8px;
  border: 1px solid var(--kg-border); background: var(--kg-surface);
  color: var(--kg-cream); font-size: 13px; width: 220px;
  transition: all var(--kg-ease);
}
.cv-search:focus { outline: none; border-color: var(--kg-accent); box-shadow: 0 0 0 3px rgba(224,0,77,0.1); }

.cv-btn-ghost {
  padding: 8px; border-radius: 8px; background: none;
  border: 1px solid var(--kg-border); color: var(--kg-cream-muted);
  cursor: pointer; transition: all var(--kg-ease); font-size: 16px;
}
.cv-btn-ghost:hover { background: var(--kg-surface-2); color: var(--kg-cream); }

/* ── cv-stats-grid ── */
.cv-stats-grid {
  display: grid; grid-template-columns: repeat(4, 1fr);
  gap: 16px; margin-bottom: 28px;
}
.cv-stat-card {
  display: flex; align-items: center; gap: 14px;
  padding: 18px 20px; border-radius: 14px;
  background: var(--kg-surface); border: 1px solid var(--kg-border);
  box-shadow: var(--kg-shadow-soft);
  transition: transform var(--kg-spring), box-shadow var(--kg-spring);
}
.cv-stat-card:hover { transform: translateY(-3px); box-shadow: var(--kg-shadow-hover); }
.cv-stat-icon {
  width: 44px; height: 44px; border-radius: 12px;
  display: flex; align-items: center; justify-content: center;
  color: #fff; font-size: 20px; flex-shrink: 0;
}
.cv-stat-body { min-width: 0; display: flex; flex-direction: column; gap: 1px; }
.cv-stat-value { font-size: 26px; line-height: 1.1; font-weight: 700; color: var(--kg-cream); font-variant-numeric: tabular-nums; letter-spacing: -.01em; }
.cv-stat-label { font-size: 12px; color: var(--kg-cream); font-weight: 600; }
.cv-stat-sub { font-size: 11px; color: var(--kg-cream-muted); font-weight: 500; letter-spacing: .01em; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.cv-stat-icon { box-shadow: 0 3px 10px -3px rgba(0,0,0,.25); }

/* ── cv-section ── */
.cv-section { margin-bottom: 28px; }
.cv-section-header {
  display: flex; justify-content: space-between; align-items: center;
  margin-bottom: 16px; flex-wrap: wrap; gap: 12px;
}
.cv-section-title { font-family: var(--kg-font-display); font-size: 20px; font-weight: 600; color: var(--kg-wine); margin: 0; letter-spacing: -0.01em; }

/* ── cv-pill-tabs (compound tabs) ── */
.cv-pill-tabs {
  display: flex; gap: 6px; list-style: none;
  margin: 0; padding: 0; flex-wrap: wrap;
}
.cv-pill-tabs .compound-tab { cursor: pointer; }

.cv-tab-content { min-height: 200px; }

/* ── cv-card ── */
.cv-card {
  background: var(--kg-surface); border: 1px solid var(--kg-border);
  border-radius: 14px; box-shadow: var(--kg-shadow-soft);
  transition: box-shadow var(--kg-ease); overflow: hidden;
}
.cv-card:hover { box-shadow: var(--kg-shadow-elevated); }
.cv-card-header {
  display: flex; justify-content: space-between; align-items: center;
  padding: 16px 20px; border-bottom: 1px solid var(--kg-border);
}
.cv-card-title { font-family: var(--kg-font-display); font-size: 16px; font-weight: 600; color: var(--kg-wine); margin: 0; }
.cv-card-body { padding: 20px; }
.cv-chart { height: 280px; width: 100%; }

/* ── cv-stat-list (study details) ── */
.cv-stat-list { display: flex; flex-direction: column; }
.cv-stat-row {
  display: flex; justify-content: space-between; align-items: center;
  padding: 12px 0; border-bottom: 1px solid var(--kg-border);
}
.cv-stat-row:last-child { border-bottom: none; }
.cv-stat-row-label { font-size: 14px; color: var(--kg-cream-muted); }
.cv-stat-row-value { font-size: 15px; font-weight: 600; color: var(--kg-cream); }

/* ── cv-overview-grid ── */
.cv-overview-grid { display: grid; grid-template-columns: 1.5fr 1fr; gap: 20px; }

/* ── cv-milestones ── */
.cv-milestones { padding: 0; }

/* ── cv-breadcrumb ── */
.cv-breadcrumb { margin-bottom: 16px; }
.cv-back-btn {
  display: inline-flex; align-items: center; gap: 4px;
  background: none; border: none; color: var(--kg-accent);
  font-size: 14px; font-weight: 500; cursor: pointer;
  padding: 6px 10px; border-radius: 6px;
  transition: all var(--kg-ease);
}
.cv-back-btn:hover { background: rgba(224,0,77,0.06); }

/* ── cv-study-hero ── */
.cv-study-hero {
  display: flex; justify-content: space-between; align-items: flex-start;
  padding: 24px; margin-bottom: 24px;
  background: var(--kg-surface); border: 1px solid var(--kg-border);
  border-radius: 16px; box-shadow: var(--kg-shadow-soft);
  gap: 20px;
}
.cv-study-hero-title { font-family: var(--kg-font-display); font-size: 28px; font-weight: 700; color: var(--kg-wine); margin: 8px 0 4px; letter-spacing: -0.01em; }
.cv-study-hero-meta { font-size: 14px; color: var(--kg-cream-muted); margin: 0 0 12px; }
.cv-study-hero-badges { display: flex; gap: 8px; flex-wrap: wrap; }
.cv-compound-badge {
  display: inline-block; padding: 3px 10px; border-radius: 12px;
  font-size: 11px; font-weight: 600; color: #fff;
  letter-spacing: .03em; text-transform: uppercase;
  background: var(--kg-gradient-accent);
}

/* ── cv-tab-bar (study sub-app tabs) ── */
.cv-tab-bar-wrap { margin-bottom: 20px; overflow-x: auto; }
.cv-tab-bar {
  display: flex; gap: 2px; list-style: none;
  margin: 0; padding: 0;
  border-bottom: 2px solid var(--kg-border);
}
.cv-tab-item { flex-shrink: 0; }
.cv-tab-btn {
  display: inline-flex; align-items: center; gap: 6px;
  padding: 10px 16px; border: none; background: none;
  font-size: 13px; font-weight: 500;
  color: var(--kg-cream-muted); cursor: pointer;
  border-bottom: 2px solid transparent;
  margin-bottom: -2px; transition: all var(--kg-ease);
  white-space: nowrap;
}
.cv-tab-btn:hover { color: var(--kg-accent); border-bottom-color: rgba(224,0,77,0.3); }
.cv-tab-btn.active { color: var(--kg-accent); border-bottom-color: var(--kg-accent); font-weight: 600; }

.cv-tab-panels { min-height: 400px; }
.cv-tab-panel { display: none; animation: cvFadeIn .3s ease; }
.cv-tab-panel.active { display: block; }

/* ── cv-login form controls ── */
.login-logo { text-align: center; padding: 36px 36px 0; }
.login-logo-mark {
  width: 56px; height: 56px; border-radius: 16px; margin: 0 auto 14px;
  display: flex; align-items: center; justify-content: center;
  background: var(--kg-cream-brand); color: var(--kg-accent); font-size: 26px;
  box-shadow: 0 6px 18px rgba(224,0,77,0.22), inset 0 0 0 1px rgba(49,4,16,0.06);
}
.login-logo-mark img { display: block; }
.login-brand {
  font-family: var(--kg-font-display);
  font-size: 30px; font-weight: 700; margin: 0;
  color: var(--kg-wine);
}
.login-tagline { color: var(--kg-cream-muted); font-size: 14px; margin: 4px 0 0; }
.login-card { padding: 0 0 32px; }
.login-card form { padding: 24px 36px 0; }
.login-hint { text-align: center; margin-top: 16px; font-size: 12px; color: var(--kg-cream-muted); padding: 0 36px; }

.cv-field { margin-bottom: 18px; }
.cv-label { display: block; font-size: 13px; font-weight: 500; color: var(--kg-cream); margin-bottom: 6px; }
.cv-input {
  width: 100%; padding: 10px 14px; border-radius: 10px;
  border: 1.5px solid var(--kg-border); background: var(--kg-surface);
  color: var(--kg-cream); font-size: 14px; font-family: inherit;
  transition: border-color var(--kg-ease), box-shadow var(--kg-ease);
}
.cv-input:focus { outline: none; border-color: var(--kg-accent); box-shadow: 0 0 0 3px rgba(224,0,77,0.12); }
.cv-input::placeholder { color: var(--kg-cream-muted); }

.cv-input-wrap { position: relative; }
.cv-input-wrap .cv-input { padding-right: 40px; }
.cv-input-icon {
  position: absolute; right: 10px; top: 50%; transform: translateY(-50%);
  background: none; border: none; color: var(--kg-cream-muted);
  cursor: pointer; padding: 4px; font-size: 16px;
}

.cv-btn-primary {
  display: inline-flex; align-items: center; justify-content: center; gap: 8px;
  padding: 11px 20px; border-radius: 10px; border: none;
  background: var(--kg-accent); color: #fff;
  font-size: 15px; font-weight: 600; font-family: inherit;
  cursor: pointer; transition: all var(--kg-ease);
}
.cv-btn-primary:hover { background: var(--kg-accent-2); transform: translateY(-1px); box-shadow: 0 4px 14px rgba(139,0,46,0.20); }
.cv-btn-primary:disabled { opacity: .6; cursor: not-allowed; transform: none; }

/* ── cv-toast ── */
.cv-toast-wrap {
  position: fixed; bottom: 20px; right: 20px; z-index: 1060;
}
.cv-toast {
  background: var(--kg-surface); border: 1px solid var(--kg-border);
  border-radius: 12px; box-shadow: var(--kg-shadow-elevated);
  min-width: 300px; max-width: 420px; overflow: hidden;
  transform: translateY(20px); opacity: 0;
  transition: all .3s ease; pointer-events: none;
}
.cv-toast.show { transform: translateY(0); opacity: 1; pointer-events: auto; }
.cv-toast-header {
  display: flex; align-items: center; gap: 8px;
  padding: 10px 14px; border-bottom: 1px solid var(--kg-border);
  background: var(--kg-surface-2);
}
.cv-toast-close {
  margin-left: auto; background: none; border: none;
  color: var(--kg-cream-muted); cursor: pointer; font-size: 16px;
}
.cv-toast-body { padding: 12px 14px; font-size: 13px; color: var(--kg-cream); }

/* ── cv-loading-overlay ── */
.cv-loading-overlay {
  position: fixed; inset: 0; z-index: 9999;
  display: flex; align-items: center; justify-content: center;
  background: rgba(255,255,255,0.88);
}
[data-bs-theme="dark"] .cv-loading-overlay { background: rgba(15,17,21,0.88); }

.cv-spinner {
  width: 36px; height: 36px; border-radius: 50%;
  border: 3px solid var(--kg-border); border-top-color: var(--kg-accent);
  animation: cvSpin .7s linear infinite;
}
.cv-spinner-lg { width: 48px; height: 48px; border-width: 4px; }
@keyframes cvSpin { to { transform: rotate(360deg); } }

.cv-loading-center { display: flex; flex-direction: column; align-items: center; gap: 12px; padding: 40px; color: var(--kg-cream-muted); }

/* ── cv-skeleton shimmer ── */
.cv-skeleton {
  background: linear-gradient(90deg, var(--kg-surface-2) 25%, var(--kg-border) 50%, var(--kg-surface-2) 75%);
  background-size: 200% 100%; animation: cvShimmer 1.5s infinite; border-radius: 6px;
}
@keyframes cvShimmer { 0%{background-position:200% 0} 100%{background-position:-200% 0} }
.cv-skeleton-text { height: 14px; margin-bottom: 8px; width: 80%; }
.cv-skeleton-title { height: 22px; width: 50%; margin-bottom: 14px; }
.cv-skeleton-card { height: 120px; width: 100%; border-radius: 14px; }

/* ── Empty compound state ── */
.cv-empty-compound {
  text-align: center; padding: 48px 24px;
  background: var(--kg-surface); border: 1px dashed var(--kg-border);
  border-radius: 14px;
}
.cv-empty-compound i { font-size: 40px; color: var(--kg-cream-muted); opacity: .5; margin-bottom: 12px; display: block; }
.cv-empty-compound h4 { font-size: 16px; font-weight: 600; color: var(--kg-cream); margin: 0 0 6px; }
.cv-empty-compound p { font-size: 13px; color: var(--kg-cream-muted); margin: 0; }

/* ── Iframe embed (shared apps) ── */
.cv-iframe-wrap { position: relative; min-height: calc(100vh - 260px); }
.cv-iframe {
  width: 100%; border: none; border-radius: 10px;
  min-height: calc(100vh - 260px); box-shadow: var(--kg-shadow-soft);
}

/* ── Dark mode additions for cv-* ── */
[data-bs-theme="dark"] .cv-input { background: var(--kg-bg); border-color: var(--kg-border); }
[data-bs-theme="dark"] .cv-search { background: var(--kg-bg); border-color: var(--kg-border); }
[data-bs-theme="dark"] .cv-stat-card { background: var(--kg-surface); border-color: var(--kg-border); }
[data-bs-theme="dark"] .cv-card { background: var(--kg-surface); border-color: var(--kg-border); }
[data-bs-theme="dark"] .cv-study-hero { background: var(--kg-surface); border-color: var(--kg-border); }
[data-bs-theme="dark"] .cv-user-chip { background: var(--kg-surface-2); border-color: var(--kg-border); }
[data-bs-theme="dark"] .cv-tab-btn.active { color: var(--kg-accent); }
[data-bs-theme="dark"] .cv-page-title,
[data-bs-theme="dark"] .cv-section-title,
[data-bs-theme="dark"] .cv-study-hero-title,
[data-bs-theme="dark"] .cv-card-title,
[data-bs-theme="dark"] .cv-program-indication { color: var(--kg-cream); }
[data-bs-theme="dark"] .login-card { background: rgba(28,26,24,0.97); }
[data-bs-theme="dark"] .login-brand { color: var(--kg-cream); }
[data-bs-theme="dark"] .brand-title { color: var(--kg-cream); }
[data-bs-theme="dark"] .cv-footer { background: var(--kg-surface); border-top-color: var(--kg-border); }

/* ── cv-footer ── */
.cv-footer {
  margin-top: auto;
  padding: 20px 24px;
  border-top: 1px solid var(--kg-border);
  background: var(--kg-surface);
}
.cv-footer-inner {
  max-width: 1400px; margin: 0 auto;
  display: flex; align-items: center; justify-content: space-between;
  gap: 12px; flex-wrap: wrap;
  font-size: 12px; color: var(--kg-cream-muted);
}
.cv-footer-brand {
  display: inline-flex; align-items: center; gap: 6px;
  font-weight: 600; color: var(--kg-cream); letter-spacing: 0.01em;
}
.cv-footer-brand img { opacity: 0.7; }
.cv-footer-meta { letter-spacing: 0.03em; }
.cv-footer-copy { opacity: 0.7; }

/* ── Selection color ── */
::selection { background: rgba(139,0,46,0.15); color: inherit; }

/* ── Overview Tab Stats ── */
.cv-stats-grid { 
  display: grid; gap: 16px; margin-bottom: 24px; 
  grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); 
}
.cv-stat-card { 
  background: var(--kg-surface); border: 1px solid var(--kg-border); 
  border-radius: var(--kg-radius); padding: 24px; box-shadow: var(--kg-shadow-soft); 
  display: flex; flex-direction: column; transition: transform var(--kg-ease), box-shadow var(--kg-ease); 
}
.cv-stat-card:hover { 
  transform: translateY(-2px); box-shadow: var(--kg-shadow-elevated); 
  border-color: rgba(139,0,46,0.3); 
}
.cv-stat-value { 
  font-family: var(--kg-font-display); font-size: 32px; font-weight: 700; 
  color: var(--kg-accent); line-height: 1.1; margin-bottom: 6px; 
}
.cv-stat-label { 
  font-size: 12px; font-weight: 600; color: var(--kg-cream); 
  text-transform: uppercase; letter-spacing: 0.05em; 
}
.cv-stat-sub { 
  font-size: 11px; font-weight: 500; color: var(--kg-cream-muted); margin-top: 4px; 
}

/* ── Protocol Info List ── */
.cv-stat-list { display: flex; flex-direction: column; }
.cv-stat-row { 
  display: flex; padding: 16px 24px; border-bottom: 1px solid var(--kg-border); 
  align-items: center; transition: background var(--kg-ease); 
}
.cv-stat-row:last-child { border-bottom: none; }
.cv-stat-row:hover { background: rgba(139,0,46,0.02); }
.cv-stat-key { 
  width: 220px; font-size: 13px; font-weight: 600; 
  color: var(--kg-cream-muted); flex-shrink: 0; 
}
.cv-stat-val { font-size: 14px; font-weight: 500; color: var(--kg-cream); }
.cv-stat-val a { color: var(--kg-accent); text-decoration: none; display: inline-flex; align-items: center; gap: 4px; }
.cv-stat-val a:hover { color: var(--kg-accent-2); text-decoration: underline; }