.fc-root {
  --fc-bg: #f8fafc;
  --fc-node-fill: #ffffff;
  --fc-node-stroke: #334155;
  --fc-node-text: #0f172a;
  --fc-link: #64748b;
  --fc-link-label: #334155;
  --fc-start-fill: #ecfdf5;
  --fc-start-stroke: #059669;
  --fc-end-fill: #fef2f2;
  --fc-end-stroke: #dc2626;
  --fc-decision-fill: #fffbeb;
  --fc-decision-stroke: #d97706;
  --fc-process-fill: #ffffff;
  --fc-font: "Segoe UI", system-ui, sans-serif;
  width: 100%;
  height: 100%;
  min-height: 280px;
  background: var(--fc-bg);
  color: var(--fc-node-text);
  font-family: var(--fc-font);
}

.fc-svg {
  display: block;
  width: 100%;
  height: 100%;
}

.fc-shape {
  fill: var(--fc-process-fill, var(--fc-node-fill));
  stroke: var(--fc-node-stroke);
  stroke-width: 1.5;
  transition: fill 160ms ease, stroke 160ms ease, stroke-width 160ms ease;
}

.fc-shape--start {
  fill: var(--fc-start-fill);
  stroke: var(--fc-start-stroke);
}

.fc-shape--end {
  fill: var(--fc-end-fill);
  stroke: var(--fc-end-stroke);
}

.fc-shape--decision {
  fill: var(--fc-decision-fill);
  stroke: var(--fc-decision-stroke);
}

.fc-node-label {
  fill: var(--fc-node-text);
  font-size: 12px;
  font-weight: 600;
  pointer-events: none;
  user-select: none;
}

.fc-node--interactive {
  cursor: pointer;
}

.fc-node--interactive:hover .fc-shape,
.fc-node--interactive:focus-visible .fc-shape {
  stroke-width: 2.25;
}

.fc-link-path {
  fill: none;
  stroke: var(--fc-link);
  stroke-linecap: round;
  stroke-linejoin: round;
  transition: stroke 160ms ease, stroke-width 160ms ease, opacity 160ms ease, fill 160ms ease;
}

.fc-link-hit {
  fill: none;
  stroke: transparent;
  stroke-width: 14;
  stroke-linecap: round;
}

.fc-link--interactive {
  cursor: pointer;
}

.fc-link--interactive:hover .fc-link-path {
  stroke: var(--fc-node-text);
  stroke-width: 2.4;
}

.fc-sankey .fc-shape {
  stroke-width: 1;
}

.fc-sankey .fc-node-label {
  font-size: 13px;
  font-weight: 600;
  paint-order: stroke fill;
  stroke: var(--fc-bg);
  stroke-width: 5px;
  stroke-linejoin: round;
}

.fc-sankey .fc-link-path {
  stroke: none;
  fill: var(--fc-link);
}

.fc-sankey .fc-link-hit {
  stroke: none;
  fill: transparent;
}

.fc-sankey .fc-link--interactive:hover .fc-link-path {
  stroke: none;
  opacity: 0.82 !important;
}

.fc-sankey .fc-node--interactive:hover .fc-shape {
  stroke-width: 1.5;
}

.fc-link-label rect {
  fill: var(--fc-bg);
  stroke: var(--fc-link);
  stroke-width: 1;
}

.fc-link-label text {
  fill: var(--fc-link-label);
  font-size: 11px;
  font-weight: 600;
  pointer-events: none;
  user-select: none;
}

.fc-root {
  position: relative;
  min-height: 0;
}

.fc-message {
  position: absolute;
  inset: 0;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 8px;
  padding: 24px;
  text-align: center;
  color: var(--fc-link-label, #64748b);
  pointer-events: none;
}

.fc-message strong {
  display: block;
  font-size: 16px;
  color: var(--fc-node-text);
}

.fc-loading {
  position: absolute;
  inset: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  background: color-mix(in srgb, var(--fc-bg) 80%, transparent);
}

.fc-loading[hidden],
.fc-message[hidden],
.fc-tooltip[hidden] {
  display: none !important;
}

.fc-loading-card {
  display: flex;
  align-items: center;
  gap: 10px;
  color: var(--fc-node-text);
  font-size: 14px;
  font-weight: 600;
}

.fc-loading-spin {
  width: 16px;
  height: 16px;
  border: 2px solid var(--fc-link);
  border-top-color: var(--fc-node-text);
  border-radius: 50%;
  animation: fc-spin 700ms linear infinite;
}

.fc-tooltip {
  padding: 12px 14px;
  background: #fff;
  border: 1px solid var(--ms-border, #c5d4e8);
  border-radius: 12px;
}

@keyframes fc-spin {
  to { transform: rotate(360deg); }
}

@media (prefers-color-scheme: dark) {
  .fc-root {
    --fc-bg: #0f172a;
    --fc-node-fill: #1e293b;
    --fc-node-stroke: #94a3b8;
    --fc-node-text: #e2e8f0;
    --fc-link: #94a3b8;
    --fc-link-label: #cbd5e1;
    --fc-start-fill: #064e3b;
    --fc-start-stroke: #34d399;
    --fc-end-fill: #7f1d1d;
    --fc-end-stroke: #f87171;
    --fc-decision-fill: #78350f;
    --fc-decision-stroke: #fbbf24;
    --fc-process-fill: #1e293b;
  }
}

html[data-bs-theme="dark"] .fc-root {
  --fc-bg: #000c18;
  --fc-node-fill: #002447;
  --fc-node-stroke: #8eb0cc;
  --fc-node-text: #e8f2fa;
  --fc-link: #8eb0cc;
  --fc-link-label: #8eb0cc;
  --fc-start-fill: #003060;
  --fc-start-stroke: #2b9fd4;
  --fc-end-fill: #003060;
  --fc-end-stroke: #40b050;
  --fc-decision-fill: #002447;
  --fc-decision-stroke: #2b9fd4;
  --fc-process-fill: #002447;
}

html[data-bs-theme="dark"] .fc-tooltip {
  background: #002447;
  border-color: #1a4d7a;
}
