/* --- D3 imza: "lightbox yuzeyi" — kalibre okuma paneli ---
   Ince cool graphite kenarlik + ust kenar backlight ic-isigi (negatoskop).
   Tema-agnostik, yeniden kullanilabilir; birincil panellere uygulanir. */
.tr-lightbox-surface {
  border: 1px solid var(--tr-lightbox-border);
  box-shadow: var(--tr-lightbox-inner-light), var(--elev-1);
}

/* --- D3 imza: "kalibrasyon seridi" — mono vaka-kimligi overlay ---
   DICOM goruntu kosesindeki hasta/aksesyon overlay'inin UI karsiligi.
   Birincil (lightbox) yuzeyin ust kosesine oturur; mono + tabular rakam.
   Tema-agnostik + yeniden kullanilabilir. Dekoratif degil: anlamli aria-label. */
.tr-calibration-strip {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: var(--space-2);
  margin-bottom: var(--space-3);
  padding-bottom: var(--space-2);
  border-bottom: 1px solid var(--tr-lightbox-border, var(--graphite-200));
  font-family: var(--tr-font-mono, var(--font-mono));
  font-size: 0.6875rem; /* 11px — overlay rofili, kucuk ama AA okunur */
  font-weight: 500;
  letter-spacing: 0.04em;
  line-height: 1.4;
  font-variant-numeric: tabular-nums;
  color: var(--graphite-500);
}

.tr-calibration-strip__seg {
  white-space: nowrap;
}

.tr-calibration-strip__seg--ref {
  color: var(--graphite-700);
  font-weight: 600;
}

.tr-calibration-strip__seg--stat {
  color: var(--color-danger);
  font-weight: 700;
  letter-spacing: 0.08em;
}

.tr-calibration-strip__sep {
  color: var(--graphite-400);
  user-select: none;
}

/* --- Typography polish --- */
.tr-patient-theme h1,
.tr-patient-theme .tr-page-title,
.tr-patient-theme .tr-detail-hero__title,
.tr-patient-theme .tr-guided-hero__title,
.tr-patient-dashboard .tr-page-title,
.tr-patient-theme h2,
 .tr-patient-theme .tr-case-card__title,
 .tr-patient-theme .tr-dashboard-focus-card__title,
 .tr-patient-theme .tr-new-case-card__title,
 .tr-patient-dashboard .tr-case-card__title,
 .tr-patient-dashboard .tr-dashboard-focus-card__title,
 .tr-patient-theme h3,
 .tr-patient-theme .tr-case-section__title,
 .tr-patient-theme .tr-dashboard-check__title,
 .tr-patient-theme .tr-new-case-step__title,
 .tr-patient-theme .tr-dashboard-empty-flow__title,
 .tr-patient-dashboard .tr-case-section__title {
  font-family: var(--tr-font-display);
  color: var(--color-text-heading);
}

.tr-patient-theme h1,
.tr-patient-theme .tr-page-title,
.tr-patient-theme .tr-detail-hero__title,
.tr-patient-theme .tr-guided-hero__title,
.tr-patient-dashboard .tr-page-title {
  font-family: var(--tr-font-display);
  font-size: var(--type-h1-size);
  font-weight: var(--type-h1-weight);
  letter-spacing: var(--type-h1-letter-spacing);
  line-height: 1.2;
}

.tr-patient-theme h2,
.tr-patient-theme .tr-case-card__title,
.tr-patient-theme .tr-dashboard-focus-card__title,
.tr-patient-theme .tr-new-case-card__title,
.tr-patient-dashboard .tr-case-card__title,
.tr-patient-dashboard .tr-dashboard-focus-card__title {
  font-family: var(--tr-font-display);
  font-size: var(--type-h2-size);
  font-weight: var(--type-h2-weight);
  letter-spacing: var(--type-h2-letter-spacing);
  line-height: 1.3;
}

.tr-patient-theme h3,
.tr-patient-theme .tr-case-section__title,
.tr-patient-theme .tr-dashboard-check__title,
.tr-patient-theme .tr-new-case-step__title,
.tr-patient-theme .tr-dashboard-empty-flow__title,
.tr-patient-dashboard .tr-case-section__title {
  font-size: var(--type-h3-size);
  font-weight: var(--type-h3-weight);
  letter-spacing: var(--type-h3-letter-spacing);
  line-height: 1.4;
}

.tr-patient-theme .tr-kicker {
  font-size: var(--type-meta-size);
  letter-spacing: 0.04em;
  font-weight: 600;
  line-height: var(--type-meta-line-height);
  color: var(--color-text-secondary);
}
.tr-patient-theme .fw-semibold {
  font-weight: 600;
}

.tr-patient-theme,
.tr-patient-dashboard,
.tr-patient-theme p,
.tr-patient-dashboard p,
.tr-patient-theme li,
.tr-patient-dashboard li,
.tr-patient-theme label,
.tr-patient-dashboard label,
.tr-patient-theme input,
.tr-patient-dashboard input,
.tr-patient-theme textarea,
.tr-patient-dashboard textarea,
.tr-patient-theme select,
.tr-patient-dashboard select,
.tr-patient-theme button,
.tr-patient-dashboard button {
  font-size: var(--type-body-size);
  font-weight: var(--type-body-weight);
  line-height: var(--type-body-line-height);
}

.tr-patient-theme .tr-page-subtitle,
.tr-patient-theme .tr-dashboard-focus-card__body,
.tr-patient-theme .tr-detail-hero__body,
.tr-patient-theme .tr-case-section__body,
 .tr-patient-theme .tr-upload-overview__body,
 .tr-patient-dashboard .tr-page-subtitle {
  font-size: var(--type-body-size);
  line-height: var(--type-body-line-height);
  color: var(--color-text-body);
}

.tr-patient-theme .small,
 .tr-patient-theme .form-text,
 .tr-patient-theme .text-muted,
 .tr-patient-dashboard .small,
 .tr-patient-dashboard .text-muted {
  font-size: var(--type-meta-size);
  font-weight: var(--type-meta-weight);
  line-height: var(--type-meta-line-height);
  color: var(--color-text-secondary) !important;
}

.tr-patient-theme .tr-dashboard-stat__value,
.tr-patient-theme .tr-filter-tab-count,
.tr-patient-theme .tr-filter-shell__count,
.tr-patient-theme .tr-intake-progress-badge,
.tr-patient-theme .tr-dashboard-ops-card__value {
  font-variant-numeric: tabular-nums;
}

.tr-patient-theme a:focus-visible,
.tr-patient-theme button:focus-visible,
.tr-patient-theme .btn:focus-visible {
  box-shadow: var(--tr-focus-ring);
  outline: none;
}

/* --- Micro-interactions: button press --- */
.tr-patient-theme .btn:active {
  transform: scale(0.97);
  transition: transform 80ms ease;
}
.tr-patient-theme .btn-primary:active,
.tr-patient-theme .btn-outline-primary:active {
  transform: scale(0.96);
}
.tr-patient-theme .tr-status-chip {
  transition: opacity 120ms ease;
}
.tr-patient-theme .tr-review-decision-card,
.tr-patient-theme .tr-locked-stage-card {
  transition: transform 160ms ease, box-shadow 160ms ease;
}
.tr-patient-theme .tr-review-decision-card:hover,
.tr-patient-theme .tr-locked-stage-card:hover {
  transform: translateY(-2px);
  box-shadow: 0 8px 20px rgba(16, 37, 63, 0.08);
}

.tr-patient-theme .tr-sidebar {
  background: var(--color-sidebar-bg);
  border: 1px solid var(--color-border-default);
  border-radius: 10px;
  padding: 0.75rem;
}

.tr-patient-theme .tr-sidebar .card {
  background: var(--color-card-bg);
}

.tr-patient-theme .tr-sidebar .list-group-item {
  border-color: var(--color-border-default);
  color: var(--color-text-body);
}

.tr-patient-theme .tr-sidebar .list-group-item:hover,
.tr-patient-theme .tr-sidebar .list-group-item:focus-within,
.tr-patient-theme .tr-sidebar .list-group-item.active {
  background: var(--color-primary-light);
  color: var(--tr-primary);
  border-color: var(--color-border-medium);
}

.tr-patient-theme .tr-sidebar .list-group-item .text-muted {
  color: var(--color-text-secondary) !important;
}

.tr-patient-theme .tr-sidebar .list-group-item.active .text-muted,
.tr-patient-theme .tr-sidebar .list-group-item:hover .text-muted,
.tr-patient-theme .tr-sidebar .list-group-item:focus-within .text-muted {
  color: var(--tr-primary) !important;
}

.tr-patient-theme .navbar.bg-primary {
  background: var(--color-navbar-bg-patient) !important;
}

.tr-patient-theme .navbar-brand,
.tr-patient-theme .navbar-brand:hover,
.tr-patient-theme .navbar-brand:focus {
  color: #ffffff !important;
}

.tr-patient-theme .navbar-brand .small,
.tr-patient-theme .navbar-brand .opacity-75 {
  color: #85b7eb !important;
  opacity: 1 !important;
}

.tr-patient-theme .tr-navbar-user {
  color: #b5d4f4 !important;
}

.tr-patient-theme .btn-outline-light {
  background: rgba(255, 255, 255, 0.1);
  border: 1px solid rgba(255, 255, 255, 0.2);
  border-radius: 7px;
  color: #ffffff;
}

.tr-patient-theme .btn-outline-light:hover,
.tr-patient-theme .btn-outline-light:focus {
  background: rgba(255, 255, 255, 0.18);
  border-color: rgba(255, 255, 255, 0.28);
  color: #ffffff;
}

.tr-patient-theme .alert-info {
  color: #0d4f8a;
  background-color: var(--tr-info-bg);
  border-color: #cde3f7;
}

.tr-patient-theme.tr-auth-page {
  background:
    radial-gradient(circle at 8% -10%, rgba(31, 95, 167, 0.11), transparent 38%),
    radial-gradient(circle at 92% 0%, rgba(24, 76, 135, 0.09), transparent 42%),
    var(--tr-app-bg);
}

.tr-patient-theme .tr-auth-strip {
  background: linear-gradient(90deg, var(--tr-primary) 0%, var(--tr-primary-hover) 100%);
  border-bottom: 1px solid rgba(31, 95, 167, 0.2);
  box-shadow: 0 6px 14px rgba(31, 95, 167, 0.12);
}

.tr-patient-theme .tr-auth-card {
  border-color: var(--tr-border);
  box-shadow: 0 12px 30px rgba(16, 37, 63, 0.1);
}

.tr-patient-theme .tr-auth-card-brand {
  background: var(--tr-primary-soft);
  border-color: rgba(31, 95, 167, 0.2);
}

.tr-patient-theme .tr-auth-card-brand__name {
  color: var(--tr-primary);
}

.tr-patient-theme .tr-summary-card,
.tr-patient-theme .tr-card-emphasis {
  background: #fff;
  border-color: var(--tr-border);
  border-left: 3px solid var(--tr-primary);
}

.tr-patient-theme .tr-case-tabs .nav-link {
  border-color: var(--tr-border);
  color: var(--tr-primary);
  background: #fff;
}

.tr-patient-theme .tr-case-tabs .nav-link:hover,
.tr-patient-theme .tr-case-tabs .nav-link:focus {
  background: var(--tr-primary-soft);
}

.tr-patient-theme .tr-case-tabs .nav-link.active {
  background: var(--tr-primary-soft);
  border-color: rgba(31, 95, 167, 0.25);
  color: var(--tr-primary);
}

.tr-patient-theme .tr-trust-strip,
.tr-patient-theme .tr-case-step-links {
  border-top-color: var(--tr-border);
}

.tr-patient-theme .tr-summary-item {
  border-top-color: var(--tr-border);
}

.tr-patient-theme .case-card {
  border-color: var(--tr-border);
  box-shadow: 0 6px 18px rgba(16, 37, 63, 0.06);
}

.tr-patient-theme .tr-action-strip .tr-action-card:hover {
  box-shadow: 0 10px 22px rgba(16, 37, 63, 0.12);
}

.tr-patient-theme #cases-table .js-case-row:focus-visible {
  outline-color: var(--tr-primary);
  background: var(--tr-primary-soft);
}

/* Fallback scope: patient pages still get redesign even if body class is stale. */
.tr-patient-dashboard {
  --tr-primary: var(--color-primary);
  --tr-primary-hover: var(--color-primary-hover);
  --tr-app-bg: var(--color-page-bg);
  --tr-card-bg: var(--color-card-bg);
  --tr-border: var(--color-border-default);
  --tr-primary-soft: var(--color-primary-light);
  --tr-success: var(--status-done-text);
  --tr-success-bg: var(--status-done-bg);
  --tr-info: var(--status-review-text);
  --tr-info-bg: var(--status-review-bg);
  --tr-warning: var(--status-action-border);
  --tr-warning-bg: var(--status-action-bg);
  --tr-danger: var(--color-danger);
  --tr-danger-bg: var(--color-danger-bg);
  /* Renk gorev-ayrimi: yesil = hastanin eylemi/yolculugu (bkz. panel_tokens .tr-patient-theme). */
  --tr-journey: #137a55;
  --tr-journey-hover: #0f6647;
  --tr-journey-tint: var(--status-done-bg);
  --tr-journey-ring: rgba(19, 122, 85, 0.22);
  /* D5 Part 1 — body class stale ise tema-agnostik btn/card kurali yine token bulsun. */
  --tr-surface-base: var(--color-card-bg);
  --tr-btn-radius: var(--radius-sm);
  --tr-btn-pad-y: 9px;
  --tr-btn-pad-x: 18px;
  --tr-btn-size: var(--type-body-size);
  --tr-btn-weight: 600;
  --tr-btn-primary-ink: #ffffff;
  --tr-btn-primary-bg: var(--tr-journey);
  --tr-btn-primary-bg-hover: var(--tr-journey-hover);
  --tr-btn-outline-border: var(--tr-primary);
  --tr-btn-outline-bg: transparent;
  --tr-card-radius: var(--radius-md);
  --tr-card-border-color: var(--tr-border);
  --tr-card-shadow: var(--elev-1);
  --tr-card-pad: var(--space-4);
  --bs-primary: var(--tr-primary);
  --bs-primary-rgb: 26, 112, 158; /* D3 4b: lumen-600 */
  font-family: var(--font-primary);
  color: var(--color-text-body);
}

/* D5 Part 1: btn + .card/.tr-card tema-agnostik tek tanima tasindi
   (panel_tokens.css). case-card burada kalir: eski 400-konum cascade'ini korur
   (.tr-patient-theme .case-card uzerine yazar) — token-driven, gorsel diff = 0. */
.tr-patient-dashboard .case-card {
  background: var(--tr-surface-base);
  border: 1px solid var(--tr-card-border-color);
  border-radius: var(--tr-card-radius);
  box-shadow: var(--tr-card-shadow);
}

.tr-patient-dashboard .progress {
  background-color: #e9eff7;
  border-radius: 999px;
}

.tr-patient-dashboard .progress-bar {
  background-color: var(--tr-primary);
  border-radius: 999px;
}

.tr-patient-dashboard .badge.bg-success,
.tr-patient-dashboard .text-bg-success {
  color: var(--tr-success) !important;
  background-color: var(--tr-success-bg) !important;
}

.tr-patient-dashboard .badge.bg-info,
.tr-patient-dashboard .text-bg-info {
  color: var(--tr-info) !important;
  background-color: var(--tr-info-bg) !important;
}

.tr-patient-dashboard .badge.bg-warning,
.tr-patient-dashboard .text-bg-warning {
  color: #7a5a00 !important;
  background-color: var(--tr-warning-bg) !important;
}

.tr-patient-dashboard .badge.bg-danger,
.tr-patient-dashboard .text-bg-danger {
  color: var(--tr-danger) !important;
  background-color: var(--tr-danger-bg) !important;
}

