/* Route builder: draggable checkpoint/order list */
.route-point-row-draggable {
  display: grid;
  grid-template-columns: 30px 150px minmax(150px, 1fr) 170px 110px auto;
  gap: 10px;
  align-items: center;
  border: 1px solid rgba(15,23,42,.08);
  border-radius: 16px;
  background: #fff;
  padding: 10px;
  transition: transform .12s ease, border-color .12s ease, box-shadow .12s ease, background .12s ease;
}

.route-point-row-draggable:hover {
  border-color: rgba(28,124,84,.28);
  box-shadow: 0 12px 30px rgba(16,24,40,.07);
}

.route-point-row-draggable.is-dragging {
  opacity: .55;
  transform: scale(.995);
}

.route-point-row-draggable.drag-over {
  border-color: rgba(28,124,84,.55);
  background: #ecfdf3;
}

.drag-handle {
  cursor: grab;
  color: #0f7f55;
  font-size: 1.25rem;
  font-weight: 900;
  text-align: center;
  user-select: none;
}

.route-point-actions {
  display: flex;
  gap: 6px;
  justify-content: flex-end;
}

.route-point-actions .btn:disabled {
  opacity: .45;
  cursor: not-allowed;
}

@media (max-width: 1100px) {
  .route-point-row-draggable {
    grid-template-columns: 30px 1fr;
  }
  .route-point-actions {
    justify-content: flex-start;
  }
}

/* Professional checkpoint navigation fields */
.route-point-row .route-point-radius-field{
  display:inline-flex;
  align-items:center;
  gap:6px;
  font-size:12px;
  color:#64748b;
}
.route-point-row .route-point-radius-field input{
  width:88px;
  min-width:88px;
}
.route-point-row input[data-field="navigation_note"]{
  flex:1 1 220px;
  min-width:180px;
}
