/* Bộ vẽ sơ đồ dòng chảy (ladipage/workshop-so-do-luong.js) — dùng chung quantri + trang bán vé.
   Màu lấy biến --dc-* của khối chứa, có giá trị dự phòng. */
.sdl-canh { fill: none; stroke: var(--dc-trung, #94A3B8); stroke-linejoin: round; transition: stroke-width .3s cubic-bezier(.2, 0, 0, 1); }
.sdl-canh.sdl-dung { stroke: var(--dc-dung, #15803D); }
.sdl-canh.sdl-sai { stroke: var(--dc-sai, #B45309); }
.sdl-canh.sdl-rong { stroke-dasharray: 6 6; opacity: .55; }
.sdl-mui.sdl-trung { fill: var(--dc-trung, #94A3B8); } .sdl-mui.sdl-dung { fill: var(--dc-dung, #15803D); } .sdl-mui.sdl-sai { fill: var(--dc-sai, #B45309); }
.sdl-nhan rect { fill: #fff; stroke: currentColor; stroke-width: 1.2; }
.sdl-nhan text { font: 600 13px/1 system-ui, -apple-system, "Segoe UI", sans-serif; fill: currentColor; font-variant-numeric: tabular-nums; }
.sdl-nhan.sdl-dung { color: var(--dc-dung, #15803D); } .sdl-nhan.sdl-sai { color: var(--dc-sai, #B45309); } .sdl-nhan.sdl-trung { color: #475569; }
.sdl-nut { cursor: pointer; outline: none; }
.sdl-hinh { fill: var(--dc-nen-nut, #fff); stroke: var(--dc-vien-nut, #CBD5E1); stroke-width: 1.6; }
.sdl-nut-hoi .sdl-hinh { fill: #FFFBEB; stroke: #E2C77A; }
.sdl-nut-ket .sdl-hinh { fill: #F1F5F9; }
.sdl-id-da-tra .sdl-hinh { fill: #F0FDF4; stroke: var(--dc-dung, #15803D); }
.sdl-id-huy .sdl-hinh, .sdl-id-huy-tay .sdl-hinh, .sdl-id-da-kin .sdl-hinh { fill: #FEF7EE; stroke: #F2C9A0; }
.sdl-nut:hover .sdl-hinh { stroke: var(--chinh, #2563EB); }
.sdl-nut:focus-visible .sdl-hinh { stroke: var(--chinh, #2563EB); stroke-width: 3.5; }
.sdl-trong .sdl-chu { fill: #64748B; }
.sdl-chu { font: 600 16px/1 system-ui, -apple-system, "Segoe UI", sans-serif; fill: #1E293B; }
.sdl-huy rect { fill: #1E293B; }
.sdl-huy text { font: 700 13px/1 system-ui, sans-serif; fill: #fff; font-variant-numeric: tabular-nums; }
.sdl-trong .sdl-huy rect { fill: #94A3B8; }
.sdl-cho rect { fill: #FFFBEB; stroke: #E2A35C; stroke-width: 1.2; }
.sdl-cho text { font: 700 13px/1 system-ui, sans-serif; fill: var(--cho, #B45309); font-variant-numeric: tabular-nums; }
.sdl-them { font: 800 18px/1 system-ui, sans-serif; fill: var(--dc-cham, #2563EB); transition: opacity .3s; }
.sdl-cham { fill: var(--dc-cham, #2563EB); stroke: #fff; stroke-width: 2.5; filter: drop-shadow(0 1px 2px rgba(37, 99, 235, .35)); }
.dc-cham-tua { cursor: pointer; }
.sdl-hop { transform-box: fill-box; transform-origin: center; }
@media (prefers-reduced-motion: no-preference) {
  .sdl-nay { animation: sdl-nay .18s cubic-bezier(.2, 0, 0, 1); }
}
@keyframes sdl-nay { 50% { transform: scale(1.05); } }