/* BK-SZR-Prozess-Explorer — geführter Durchlauf, große Bühne.
   akteur-badge / plantuml-diagram kommen aus nachrichtenfluss.css */

.bkszr-card .card-header { background: #f8fbff; }

.bkszr-typ { font-size: .72rem; font-weight: 700; padding: 1px 6px; border-radius: 4px; }
.bkszr-typ-mscons { background: #e3f7e3; color: #2e7d32; }
.bkszr-typ-iftsta { background: #ffe9df; color: #c1440e; }

/* ── Stationsleiste ── */
.bkszr-stationbar { display: flex; align-items: stretch; gap: 6px; margin-bottom: 14px; }
.bkszr-stations {
    flex: 1 1 auto; display: flex; align-items: center; gap: 4px; flex-wrap: wrap;
    background: #f5f8fc; border: 1px solid #e6e9ee; border-radius: 10px; padding: 6px 8px;
}
.bkszr-nav {
    flex: 0 0 auto; width: 40px; border: 1px solid #cfd8e3; background: #fff; border-radius: 10px;
    font-size: 1.2rem; color: #1976d2; cursor: pointer;
}
.bkszr-nav:hover:not(:disabled) { background: #e8f3ff; }
.bkszr-nav:disabled { color: #c3ccd6; cursor: default; }
.bkszr-chip {
    display: inline-flex; align-items: center; gap: 6px; border: 1px solid #dbe3ec;
    background: #fff; border-radius: 8px; padding: 5px 9px; cursor: pointer;
    font-size: .82rem; font-weight: 600; color: #455a64; transition: all .12s;
}
.bkszr-chip:hover { border-color: #90caf9; background: #f0f8ff; }
.bkszr-chip.active { border-color: #1976d2; background: #1976d2; color: #fff; box-shadow: 0 1px 4px rgba(25,118,210,.3); }
.bkszr-chip.active code { color: #fff; background: rgba(255,255,255,.20); }
.bkszr-chip-nr { font-size: 1.05rem; line-height: 1; }
.bkszr-chip-lbl { display: inline-flex; align-items: center; gap: 4px; }
.bkszr-chip-edge { background: #eef4fb; }
.bkszr-chip-div { width: 1px; align-self: stretch; background: #cfd8e3; margin: 2px 4px; }

/* ── Bühne ── */
.bkszr-stage {
    border: 1px solid #e6e9ee; border-radius: 12px; padding: 22px 26px;
    background: #fff; min-height: 420px; font-size: 1rem;
}
.bkszr-stage-title { font-weight: 700; color: #0d47a1; margin-bottom: 12px; }
.bkszr-lead { font-size: 1.08rem; color: #37474f; max-width: 70ch; }

/* Diagramm oben, breite UC-Karten darunter (mit vollem UC-Text) */
.bkszr-overview-block { margin-top: 12px; }
.bkszr-overview-top { display: flex; gap: 20px; align-items: flex-start; flex-wrap: wrap; }
.bkszr-overview-top .bkszr-diagram-wrap { flex: 1 1 0; min-width: 240px; }
.bkszr-szen { flex: 2 1 0; min-width: 320px; border: 1px solid #cfe3f5; border-radius: 10px; padding: 16px 18px; background: #fbfdff; }
.bkszr-szen-h { font-weight: 700; font-size: 1.2rem; color: #145ca8; margin-bottom: 12px; }
.bkszr-szen-item { padding: 10px 0; border-top: 1px solid #e2ecf5; }
.bkszr-szen-item:first-of-type { border-top: 0; }
.bkszr-szen-t { font-weight: 700; font-size: 1rem; color: #14202c; }
.bkszr-szen-k { font-size: .92rem; color: #14202c; font-family: ui-monospace, SFMono-Regular, Menlo, monospace; margin-top: 3px; line-height: 1.5; }
.bkszr-szen-n { font-size: .9rem; color: #2a3a47; margin-top: 3px; }
.bkszr-uc-cards-row { display: flex; gap: 16px; flex-wrap: wrap; margin-top: 16px; align-items: stretch; }
.bkszr-uc-card { flex: 1 1 440px; border: 1px solid #e1f0fb; border-radius: 10px; padding: 16px 18px; background: #fbfdff; }
.bkszr-uc-card-active { border-color: #1976d2; background: #eef6ff; box-shadow: 0 0 0 2px rgba(25,118,210,.20); }
.bkszr-uc-card-top { display: flex; align-items: center; gap: 10px; margin-bottom: 8px; }
.bkszr-uc-badge { display: inline-block; background: #1976d2; color: #fff; font-weight: 700; font-size: .85rem; padding: 2px 12px; border-radius: 12px; }
.bkszr-circ { font-size: 1.05rem; color: #1976d2; font-weight: 700; }
.bkszr-uc-card-name { font-weight: 700; font-size: 1.08rem; margin-bottom: 6px; }
.bkszr-uc-stations { font-size: 1rem; color: #546e7a; margin-bottom: 10px; }
.bkszr-uc-ziel { font-size: 1rem; color: #263238; margin-bottom: 8px; }
.bkszr-uc-beschr { font-size: 1rem; color: #37474f; line-height: 1.55; margin-bottom: 8px; }
.bkszr-uc-line2 { font-size: 1rem; color: #37474f; line-height: 1.55; margin-bottom: 8px; }
.bkszr-uc-line2:last-child { margin-bottom: 0; }
.bkszr-uc-ul { margin: 4px 0 0; padding-left: 20px; }
.bkszr-diagram { border: 1px solid #eee; border-radius: 8px; padding: 8px; background: #fafafa; overflow-x: auto; }
.bkszr-diagram svg { max-width: 100%; height: auto; }
.bkszr-diagram-big { padding: 14px; }
.bkszr-ue-diagram-h { font-weight: 600; }
.bkszr-ad-lane { font-weight: 400; color: #5a6b7a; font-size: .9rem; }
.bkszr-ue-line { font-size: 1.05rem; }

/* Stationskopf (Nachricht) */
.bkszr-stage-head { border-bottom: 2px solid #1976d2; padding-bottom: 10px; margin-bottom: 14px; }
.bkszr-stage-route { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
.bkszr-stage-nr { font-size: 1.7rem; line-height: 1; color: #1976d2; }
.bkszr-stage-name { font-weight: 700; font-size: 1.25rem; margin-left: 4px; }
.bkszr-stage-sub { font-size: .92rem; color: #546e7a; margin-top: 6px; }

/* Reiter */
.bkszr-tabs { display: flex; flex-wrap: wrap; gap: 4px; border-bottom: 2px solid #e6e9ee; margin-bottom: 16px; }
.bkszr-tab {
    border: none; background: none; padding: 9px 18px; font-size: .98rem; font-weight: 600;
    color: #607d8b; border-bottom: 3px solid transparent; margin-bottom: -2px; cursor: pointer; border-radius: 6px 6px 0 0;
}
.bkszr-tab:hover { background: #f3f8fd; color: #1976d2; }
.bkszr-tab.active { color: #1976d2; border-bottom-color: #1976d2; background: #f3f8fd; }
.bkszr-pane { display: none; }
.bkszr-pane.active { display: block; animation: bkszrFade .15s ease; }
@keyframes bkszrFade { from { opacity: 0; } to { opacity: 1; } }

.bkszr-uc-name { font-weight: 600; font-size: 1.1rem; color: #263238; }
.bkszr-volltext > summary { cursor: pointer; color: #1976d2; }

/* Schritt-Überblick */
.bkszr-ov-block { padding: 10px 0; border-bottom: 1px solid #eef1f4; }
.bkszr-ov-block:last-child { border-bottom: none; }
.bkszr-ov-label { display: block; font-size: .85rem; font-weight: 700; text-transform: uppercase; letter-spacing: .03em; color: #0d47a1; margin-bottom: 6px; }
.bkszr-ov-sub { font-size: .98rem; font-weight: 600; color: #37474f; }
.bkszr-ov-aktion { font-size: 1.1rem; display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
.bkszr-ov-hinweis { font-size: 1.05rem; color: #263238; margin: 8px 0 0; }
.bkszr-ov-fristval { font-size: 1.05rem; font-weight: 600; color: #263238; }
.bkszr-frist-grid { display: flex; gap: 12px; flex-wrap: wrap; }
.bkszr-frist-bahn, .bkszr-frist-std { flex: 0 1 220px; border-radius: 8px; padding: 8px 12px; }
.bkszr-frist-bahn { background: #e8f3ff; border: 1px solid #b3d8f5; }
.bkszr-frist-std { background: #f5f7fa; border: 1px solid #e0e6ed; }
.bkszr-frist-bahn span, .bkszr-frist-std span { display: block; font-size: .76rem; text-transform: uppercase; letter-spacing: .03em; color: #607d8b; }
.bkszr-frist-bahn b, .bkszr-frist-std b { font-size: 1.15rem; color: #0d47a1; }
.bkszr-frist-std b { color: #455a64; }
.bkszr-frist-grund { font-size: .95rem; color: #455a64; margin: 8px 0 0; }
.bkszr-frist-bed { font-size: .95rem; color: #37474f; margin: 6px 0 0; }
.bkszr-ov-ebdcode { background: #1976d2; color: #fff; padding: 1px 8px; border-radius: 4px; font-weight: 700; }
.bkszr-ov-ul { font-size: 1.02rem; line-height: 1.6; margin: 0; padding-left: 22px; }
.bkszr-ov-more { font-size: .95rem; color: #455a64; margin: 8px 0 0; }
.bkszr-ad-diagram { border: 1px solid #eee; border-radius: 8px; padding: 10px; background: #fafafa; overflow-x: auto; }
.bkszr-ad-diagram svg { max-width: 100%; height: auto; }

/* EDIFACT ↔ Klartext (zweispaltige Decode-Tabelle) */
.bkszr-decode { width: 100%; border-collapse: collapse; font-size: .95rem; }
.bkszr-decode th { text-align: left; font-size: .76rem; text-transform: uppercase; letter-spacing: .02em; color: #607d8b; border-bottom: 2px solid #e6e9ee; padding: 6px 10px; }
.bkszr-decode td { padding: 5px 10px; border-bottom: 1px solid #eef1f4; vertical-align: top; }
.bkszr-decode td.bkszr-d-edi {
    width: 38%; font-family: ui-monospace, "SFMono-Regular", Menlo, Consolas, monospace;
    font-size: .84rem; word-break: break-all;
    background: #1e2530; color: #cfd8dc; border-bottom: 1px solid #2b3442;
}
.bkszr-decode tbody tr:first-child td.bkszr-d-edi { border-top-left-radius: 6px; }
.bkszr-d-edi code { color: #cfd8dc; background: none; font-size: inherit; }
.bkszr-d-de { color: #263238; }
.bkszr-d-label { font-weight: 600; color: #1976d2; }
.bkszr-d-key td.bkszr-d-edi { border-left: 3px solid #ffd54f; background: #232c3b; }
.bkszr-d-key .bkszr-d-edi code { color: #ffe082; font-weight: 600; }
.bkszr-d-tech .bkszr-d-edi code { color: #78909c; }
.bkszr-d-code { background: #fff3e0; color: #e65100; font-weight: 700; padding: 0 6px; border-radius: 4px; }
.bkszr-akteur { color: #00695c; font-weight: 600; }
.bkszr-d-trunc td { color: #e07a5f; font-style: italic; }
.bkszr-datei { word-break: break-all; }
.bkszr-varsel { display: inline-flex; }
.bkszr-no-bsp { border: 1px dashed #cfd8e3; border-radius: 8px; padding: 14px 16px; background: #f8fafc; color: #37474f; font-size: 1rem; }
.bkszr-no-bsp code { background: #eceff1; color: #37474f; padding: 1px 6px; border-radius: 4px; }

/* EBD-Block */
.bkszr-ebd { border: 1px solid #e1f0fb; border-radius: 8px; padding: 12px 14px; margin-bottom: 12px; background: #fbfdff; }
.bkszr-ebd-head { font-weight: 600; font-size: 1rem; margin-bottom: 8px; display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
.bkszr-ebd-head code { background: #1976d2; color: #fff; padding: 2px 8px; border-radius: 4px; font-size: .9rem; }
.bkszr-ebd-rolle { font-size: .8rem; background: #e8f3ff; color: #0277bd; padding: 2px 9px; border-radius: 10px; }
.bkszr-ps-list { margin: 0; padding-left: 0; list-style: none; font-size: .95rem; }
.bkszr-ps2 { margin-bottom: 11px; }
.bkszr-ps2-frage { font-weight: 600; color: #263238; }
.bkszr-ps-nr { display: inline-flex; align-items: center; justify-content: center; width: 22px; height: 22px; border-radius: 50%; background: #1976d2; color: #fff; font-weight: 700; font-size: .8rem; margin-right: 6px; }
.bkszr-ps2-outs { padding-left: 28px; margin-top: 3px; }
.bkszr-out { display: flex; align-items: baseline; gap: 8px; padding: 1px 0; }
.bkszr-out-erg { flex: 0 0 auto; min-width: 38px; font-weight: 700; padding: 1px 8px; border-radius: 4px; text-align: center; font-size: .8rem; }
.bkszr-erg-ja { background: #e8f5e9; color: #2e7d32; }
.bkszr-erg-nein { background: #fdecea; color: #c0392b; }
.bkszr-out-arrow { color: #37474f; }
.bkszr-ps-desc { color: #607d8b; }
.bkszr-fm-title { font-size: .82rem; font-weight: 600; color: #607d8b; margin: 10px 0 4px; text-transform: uppercase; letter-spacing: .02em; }
.bkszr-fmtab { font-size: .9rem; margin-bottom: 0; }
.bkszr-fmtab th { background: #f5f7fa; font-size: .78rem; color: #607d8b; }
.bkszr-code { background: #fff3e0; color: #e65100; font-weight: 700; padding: 1px 8px; border-radius: 4px; }

/* Referenzen / Mechanik */
.bkszr-mech-list { font-size: .98rem; padding-left: 20px; margin: 0; }
.bkszr-mech-list > li { margin-bottom: 10px; }
.bkszr-mech-list code { word-break: break-all; }

/* Mechanismen-Station */
.bkszr-mech-block { margin-bottom: 22px; }
.bkszr-mech-h { color: #0d47a1; font-weight: 700; border-left: 4px solid #1976d2; padding-left: 10px; }
.bkszr-mechtab { font-size: .92rem; }
.bkszr-mechtab th { background: #f5f7fa; font-size: .8rem; color: #607d8b; }
.bkszr-mech-hit { background: #fff8e1; }
.bkszr-mech-hit code { color: #e65100; font-weight: 700; }

/* Durchspielen-Station */
.bkszr-chip-play { background: #e8f5e9; color: #2e7d32; border-color: #c8e6c9; }
.bkszr-chip-play.active { background: #2e7d32; border-color: #2e7d32; color: #fff; }
.bkszr-uebung { border: 1px solid #e6e9ee; border-left: 4px solid #1976d2; border-radius: 10px; padding: 14px 18px; margin-bottom: 16px; background: #fbfdff; }
.bkszr-uebung-head { font-weight: 700; font-size: 1.08rem; display: flex; align-items: center; gap: 10px; flex-wrap: wrap; margin-bottom: 8px; }
.bkszr-uebung-nr { display: inline-flex; align-items: center; justify-content: center; width: 30px; height: 30px; border-radius: 50%; background: #1976d2; color: #fff; font-size: 1.05rem; }
.bkszr-uebung-uc { font-size: .82rem; font-weight: 600; background: #e8f3ff; color: #0277bd; padding: 2px 9px; border-radius: 10px; }
.bkszr-uebung-steps { margin: 0; padding-left: 22px; font-size: 1rem; line-height: 1.6; }
.bkszr-uebung-steps > li { margin-bottom: 6px; }
.bkszr-uebung-titel { font-weight: 600; }
.bkszr-uebung-info { border-left-color: #f0ad4e; background: #fffdf6; }
.bkszr-uebung-info .bkszr-uebung-nr { background: #f0ad4e; }
.bkszr-live-tag { margin-left: auto; font-size: .72rem; font-weight: 700; padding: 2px 9px; border-radius: 10px; }
.bkszr-live-yes { background: #e8f5e9; color: #2e7d32; }
.bkszr-live-info { background: #fff3e0; color: #e65100; }
.bkszr-live-import { background: #eceff1; color: #546e7a; }