/* All styles are scoped to the projection documentation player. */
.air-dependency-player {
  --adp-ink: #172d46;
  --adp-muted: #52657a;
  --adp-line: #d5e0eb;
  --adp-blue: #245e9c;
  --adp-blue-bg: #edf5ff;
  --adp-green: #197353;
  --adp-green-bg: #ebf7f1;
  --adp-amber: #996116;
  --adp-amber-bg: #fff5e5;
  --adp-gray: #607184;
  --adp-gray-bg: #f1f4f7;
  color-scheme: light;
  box-sizing: border-box;
  max-width: 760px;
  margin: 18px 0 24px;
  border: 1px solid var(--adp-line);
  border-radius: 10px;
  overflow: hidden;
  background: #fff;
  color: var(--adp-ink);
  font-size: 13px;
  line-height: 1.55;
}

.air-dependency-player *,
.air-dependency-player *::before,
.air-dependency-player *::after {
  box-sizing: border-box;
}

.air-dependency-player .adp-header { padding: 16px 16px 12px; }
.air-dependency-player .adp-eyebrow { color: var(--adp-muted); font-size: 12px; }
.air-dependency-player .adp-title { margin-top: 6px; font-size: 18px; font-weight: 600; line-height: 1.4; }
.air-dependency-player .adp-subtitle { margin-top: 6px; color: var(--adp-muted); font-size: 12px; }

.air-dependency-player button {
  min-height: 44px;
  border: 1px solid var(--adp-line);
  border-radius: 6px;
  background: #fff;
  color: var(--adp-ink);
  font: inherit;
  line-height: 1.4;
}

.air-dependency-player button { padding: 9px 13px; cursor: pointer; }
.air-dependency-player button:hover:not(:disabled) { border-color: var(--adp-blue); background: var(--adp-blue-bg); }
.air-dependency-player button:focus-visible,
.air-dependency-player input:focus-visible { outline: 3px solid #2465ab; outline-offset: 3px; }
.air-dependency-player button:disabled { opacity: 0.45; cursor: default; }

.air-dependency-player .adp-steps {
  display: grid;
  grid-template-columns: repeat(var(--adp-step-count), minmax(0, 1fr));
  gap: 6px;
  margin: 0 16px 12px;
}

.air-dependency-player .adp-step { display: flex; align-items: center; gap: 7px; padding: 8px; font-size: 12px; text-align: left; }
.air-dependency-player .adp-step-number { display: grid; flex: 0 0 20px; width: 20px; height: 20px; place-items: center; border-radius: 50%; background: var(--adp-gray-bg); font-size: 11px; }
.air-dependency-player .adp-step[aria-current] { border-color: var(--adp-blue); background: var(--adp-blue-bg); color: var(--adp-blue); font-weight: 600; }
.air-dependency-player .adp-step[aria-current] .adp-step-number { background: var(--adp-blue); color: #fff; }

.air-dependency-player .adp-event { display: flex; align-items: baseline; gap: 8px; margin: 0 16px 12px; padding: 9px 10px; border-radius: 6px; background: var(--adp-blue-bg); color: var(--adp-blue); font-size: 12px; font-weight: 600; }
.air-dependency-player .adp-event-index { flex-shrink: 0; font-size: 12px; font-variant-numeric: tabular-nums; }
.air-dependency-player .adp-diagram { display: grid; width: calc(100% - 32px); max-width: 660px; grid-template-columns: minmax(0, 220px) minmax(64px, 1fr) minmax(0, 250px); gap: 8px 0; margin: 0 auto; }
.air-dependency-player .adp-column-title { color: var(--adp-muted); font-size: 12px; font-weight: 600; }
.air-dependency-player .adp-upstream-title { grid-column: 1; grid-row: 1; }
.air-dependency-player .adp-downstream-title { grid-column: 3; grid-row: 1; }
.air-dependency-player .adp-sources,
.air-dependency-player .adp-results { display: grid; grid-template-columns: minmax(0, 1fr); grid-template-rows: repeat(2, minmax(0, 1fr)); gap: 12px; min-width: 0; }
.air-dependency-player .adp-sources { grid-column: 1; grid-row: 2; }
.air-dependency-player .adp-results { grid-column: 3; grid-row: 2; }
.air-dependency-player .adp-card { min-width: 0; padding: 12px; border: 1px solid var(--adp-line); border-radius: 6px; }
.air-dependency-player .adp-card-label { font-size: 12px; font-weight: 600; }
.air-dependency-player .adp-card-value { margin: 6px 0; font-size: 18px; font-weight: 600; line-height: 1.35; overflow-wrap: anywhere; }
.air-dependency-player .adp-card-detail { color: var(--adp-muted); font-size: 12px; }
.air-dependency-player .adp-result { min-height: 112px; }
.air-dependency-player .adp-result .adp-card-value { font-size: 16px; }
.air-dependency-player [data-tone="green"] { color: var(--adp-green); background: var(--adp-green-bg); border-color: #a0ccba; }
.air-dependency-player [data-tone="amber"] { color: var(--adp-amber); background: var(--adp-amber-bg); border-color: #dec59f; }
.air-dependency-player [data-tone="gray"] { color: var(--adp-gray); background: var(--adp-gray-bg); }
.air-dependency-player [data-tone="blue"] { color: var(--adp-blue); background: var(--adp-blue-bg); border-color: #adc7e4; }

.air-dependency-player .adp-flow { position: relative; grid-column: 2; grid-row: 2; min-width: 0; }
.air-dependency-player .adp-flow > svg { position: absolute; inset: 0; display: block; width: 100%; height: 100%; overflow: visible; }
.air-dependency-player .adp-flow path { fill: none; stroke: #adbed0; stroke-width: 1.5; stroke-linecap: round; stroke-linejoin: round; vector-effect: non-scaling-stroke; }
.air-dependency-player .adp-separate-path { display: none; }
.air-dependency-player[data-separate="true"] .adp-joined-path { display: none; }
.air-dependency-player[data-separate="true"] .adp-separate-path { display: block; }
.air-dependency-player .adp-flow .adp-pulse { position: absolute; width: 6px; height: 6px; border: 0; border-radius: 50%; background: currentColor; transform: translate(-50%, -50%); }
.air-dependency-player .adp-flow .adp-pulse[hidden] { display: none; }
.air-dependency-player .adp-note { margin: 12px 16px 16px; padding: 10px; border-left: 2px solid #b6c9dc; background: #f6f8fb; color: var(--adp-muted); font-size: 12px; }

.air-dependency-player .adp-controls { display: flex; gap: 12px; align-items: center; padding: 8px 16px; border-top: 1px solid var(--adp-line); background: #f8fafc; }
.air-dependency-player .adp-buttons { display: flex; flex-shrink: 0; gap: 6px; }
.air-dependency-player .adp-controls button { display: grid; width: 44px; height: 44px; place-items: center; padding: 10px; }
.air-dependency-player .adp-controls button svg { display: block; width: 18px; height: 18px; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }
.air-dependency-player .adp-controls .adp-play svg { fill: currentColor; stroke: none; }
.air-dependency-player .adp-controls .adp-play .adp-pause-icon { display: none; }
.air-dependency-player[data-playing="true"] .adp-controls .adp-play .adp-play-icon { display: none; }
.air-dependency-player[data-playing="true"] .adp-controls .adp-play .adp-pause-icon { display: block; }
.air-dependency-player .adp-play { border-color: var(--adp-blue); background: var(--adp-blue); color: #fff; }
.air-dependency-player .adp-play:hover:not(:disabled) { background: #1c4b7d; color: #fff; }
.air-dependency-player .adp-progress { display: block; flex: 1; width: 100%; min-width: 0; min-height: 44px; margin: 0; accent-color: var(--adp-blue); cursor: pointer; }

@media (max-width: 600px) {
  .air-dependency-player .adp-header { padding: 16px 12px; }
  .air-dependency-player .adp-title { font-size: 16px; }
  .air-dependency-player .adp-steps { gap: 5px; margin-right: 12px; margin-left: 12px; }
  .air-dependency-player .adp-step { flex-direction: column; justify-content: flex-start; padding: 8px 4px; font-size: 12px; text-align: center; }
  .air-dependency-player .adp-event { margin-right: 12px; margin-left: 12px; }
  .air-dependency-player .adp-diagram { width: calc(100% - 24px); grid-template-columns: minmax(0, 1fr) 32px minmax(0, 1.15fr); }
  .air-dependency-player .adp-sources,
  .air-dependency-player .adp-results { gap: 12px; }
  .air-dependency-player .adp-card { padding: 10px 8px; }
  .air-dependency-player .adp-card-value { font-size: 16px; }
  .air-dependency-player .adp-result { min-height: 140px; }
  .air-dependency-player .adp-result .adp-card-value { font-size: 15px; }
  .air-dependency-player .adp-card-label,
  .air-dependency-player .adp-card-detail { font-size: 12px; }
  .air-dependency-player .adp-note { margin-right: 12px; margin-left: 12px; }
  .air-dependency-player .adp-controls { gap: 10px; padding: 12px; }
  .air-dependency-player .adp-buttons { gap: 4px; }
}
