.qd-box {
  border:1px solid #e5e7eb;
  border-radius:12px;
  padding:16px;
  margin-top:16px;
  margin-bottom:28px;
  background:#ffffff;
  box-shadow:0 2px 6px rgba(0,0,0,0.05);
}
.qd-row {
  display:flex;
  flex-wrap:wrap;
  align-items:center;   /* vertical center */
  gap:16px;
  margin-top:8px;
}

/* SLA label block */
.qd-row label {
  display:flex;
  align-items:center;
  gap:8px;
  font-weight:600;        /* bold label */
  min-width:80px;         /* fixed label width */
}

/* SLA dropdown */
.qd-sel {
  min-width:120px;
  padding:6px 10px;
  border-radius:6px;
  border:1px solid #d1d5db;
  font-size:14px;
  line-height:1.4;
}



.qd-pill {
  display:inline-block;
  padding:4px 10px;
  border-radius:999px;
  font-size:12px;
  background:#eef2ff;
  color:#3730a3;
  font-weight:500;
}

.qd-btn {
  background-color:#2563eb;
  border:1px solid transparent;
  border-radius:6px;
  color:#fff;
  cursor:pointer;
  font-size:.97em;
  font-weight:bolder;
  letter-spacing:.03em;
  line-height:2.4em;
  padding:0 1.2em;
  text-transform:uppercase;
  transition:all .2s;
  min-height:2.5em;

  display:inline-flex;
  align-items:center;
  justify-content:center;

  margin-right:6px;   /* 🔧 reduced from 1em */
  margin-top:0;       /* keep tight vertically */
}


.qd-btn:hover { background:#1d4ed8; }
.qd-btn.secondary { background:#6b7280; }
.qd-btn.secondary:hover { background:#4b5563; }
.qd-note { font-size:12px; color:#6b7280; margin-top:6px; }
.qd-sel { min-width:90px; padding:4px; border-radius:6px; border:1px solid #d1d5db; }

/* Tracking timeline */
.qd-tracking {
  border:1px solid #e5e7eb;
  border-radius:10px;
  padding:16px;
  margin-top:24px;
  background:#f9fafb;
}
.qd-timeline { list-style:none; padding-left:0; margin:0; }
.qd-timeline li {
  position:relative;
  padding:8px 0 8px 20px;
  border-left:3px solid #d1d5db;
  margin-left:10px;
  font-weight:500;
  color:#6b7280;
}
.qd-timeline li.done { border-left-color:#2563eb; color:#111827; }
.qd-timeline li span { display:block; }
.qd-timeline li small { display:block; font-size:12px; color:#6b7280; }

.

/* Self Delivery badge */
.dokan-label.qd-self-delivery {
  background-color:#2563eb !important; /* bright blue */
  color:#fff !important;
  font-weight:600;
  border-radius:20px;       /* pill shape */
  padding:4px 12px;
  font-size:13px;
  line-height:1.4;
  display:inline-block;
  text-transform:uppercase;
  letter-spacing:0.3px;
}

/* Optional hover effect (if clickable later) */
.dokan-label.qd-self-delivery:hover {
  background-color:#1d4ed8 !important;
}

.qd-badge-self {
  display:inline-block;
  margin-left:6px;
  padding:2px 6px;          /* tighter like Dokan */
  font-size:11px;           /* same as Dokan */
  font-weight:500;
  line-height:1.2;
  color:#fff;
  background:#2563eb;       /* your chosen blue */
  border:1px solid transparent;
  border-radius:2px;        /* square-ish like Dokan badges */
  vertical-align:middle;
}

.dokan-label-ready-for-pickup {
  background:#f59e0b;  /* orange */
  color:#fff;
  border-radius:2px;
  padding:2px 6px;
  font-size:11px;
  font-weight:500;
  line-height:1.2;
  display:inline-block;
}

/* Out for Delivery */
.dokan-label-out-for-delivery {
  background:#7c3aed;  /* purple */
  color:#fff;
  border-radius:2px;
  padding:2px 6px;
  font-size:11px;
  font-weight:500;
  line-height:1.2;
  display:inline-block;
}

.qd-disabled {
  pointer-events: none;
  opacity: 0.5;
  cursor: not-allowed;
}