/* AquaFlow V34.2.20 — shared enterprise Order → Delivery → Completed workflow.
   One compact indicator is used in both Order and Delivery workspaces. */
.enterprise-flow-v34220,
#orders .enterprise-flow-v34220,
.admin-mode #orders .enterprise-flow-v34220,
.staff-mode #orders .enterprise-flow-v34220,
#deliveries .enterprise-flow-v34220 {
  display:grid!important;
  grid-template-columns:minmax(0,1fr) 12px minmax(0,1fr) 12px minmax(0,1fr)!important;
  align-items:center!important;
  gap:3px!important;
  width:100%!important;
  min-height:48px!important;
  height:48px!important;
  margin:0 0 8px!important;
  padding:4px 5px!important;
  border:1px solid #dbe7f1!important;
  border-radius:13px!important;
  background:#fff!important;
  box-shadow:0 3px 12px rgba(23,55,89,.035)!important;
  overflow:hidden!important;
}

.enterprise-flow-v34220 > i {
  display:grid!important;
  place-items:center!important;
  width:12px!important;
  height:100%!important;
  color:#91a5b8!important;
  font-size:14px!important;
  line-height:1!important;
  font-style:normal!important;
  font-weight:900!important;
}

.enterprise-flow-v34220 > .bridge-node,
#orders .enterprise-flow-v34220 > .bridge-node,
.admin-mode #orders .enterprise-flow-v34220 > .bridge-node,
.staff-mode #orders .enterprise-flow-v34220 > .bridge-node,
#deliveries .enterprise-flow-v34220 > .bridge-node {
  display:flex!important;
  align-items:center!important;
  justify-content:flex-start!important;
  gap:5px!important;
  min-width:0!important;
  min-height:38px!important;
  height:38px!important;
  padding:4px 5px!important;
  border:1px solid transparent!important;
  border-radius:10px!important;
  background:#f4f7fa!important;
  color:#5d7489!important;
  box-shadow:none!important;
  overflow:hidden!important;
}

.enterprise-flow-v34220 > .bridge-node > b {
  flex:0 0 24px!important;
  display:grid!important;
  place-items:center!important;
  width:24px!important;
  height:24px!important;
  border-radius:8px!important;
  background:#e5edf5!important;
  color:#617b92!important;
  font-size:9px!important;
  line-height:1!important;
  font-weight:900!important;
}

.enterprise-flow-v34220 > .bridge-node > strong {
  min-width:0!important;
  color:inherit!important;
  font-size:10.5px!important;
  line-height:1!important;
  font-weight:900!important;
  letter-spacing:-.1px!important;
  white-space:nowrap!important;
  overflow:hidden!important;
  text-overflow:clip!important;
}

.enterprise-flow-v34220 > .bridge-node > small { display:none!important; }

/* Current Order / Delivery step — AquaFlow blue. */
.enterprise-flow-v34220[data-active-step="orders"] > .bridge-node[data-flow-step="orders"],
.enterprise-flow-v34220[data-active-step="deliveries"] > .bridge-node[data-flow-step="deliveries"] {
  background:#eaf4ff!important;
  color:#0878ef!important;
  border-color:#cfe4fa!important;
}
.enterprise-flow-v34220[data-active-step="orders"] > .bridge-node[data-flow-step="orders"] > b,
.enterprise-flow-v34220[data-active-step="deliveries"] > .bridge-node[data-flow-step="deliveries"] > b {
  background:#0878ef!important;
  color:#fff!important;
}

/* Completed step — green so completion reads instantly. */
.enterprise-flow-v34220[data-active-step="completed"] > .bridge-node[data-flow-step="completed"] {
  background:#eaf8f2!important;
  color:#087a58!important;
  border-color:#bde4d2!important;
}
.enterprise-flow-v34220[data-active-step="completed"] > .bridge-node[data-flow-step="completed"] > b {
  background:#14a36f!important;
  color:#fff!important;
}

@media (max-width:390px) {
  .enterprise-flow-v34220,
  #orders .enterprise-flow-v34220,
  .admin-mode #orders .enterprise-flow-v34220,
  .staff-mode #orders .enterprise-flow-v34220,
  #deliveries .enterprise-flow-v34220 {
    grid-template-columns:minmax(0,1fr) 10px minmax(0,1fr) 10px minmax(0,1fr)!important;
    gap:2px!important;
    min-height:46px!important;
    height:46px!important;
    padding:4px!important;
    border-radius:12px!important;
  }
  .enterprise-flow-v34220 > .bridge-node {
    gap:3px!important;
    min-height:36px!important;
    height:36px!important;
    padding:3px 4px!important;
    border-radius:9px!important;
  }
  .enterprise-flow-v34220 > .bridge-node > b {
    flex-basis:21px!important;
    width:21px!important;
    height:21px!important;
    border-radius:7px!important;
    font-size:8px!important;
  }
  .enterprise-flow-v34220 > .bridge-node > strong { font-size:9.5px!important; }
  .enterprise-flow-v34220 > i { width:10px!important;font-size:12px!important; }
}